HTML5UP Story

Squelette SPIP « onepage » pour intégrer le thème Story de HTML5UP
https://html5up.net/story

Ce squelette permet de réaliser très simplement des sites de type « one page » sans toucher une ligne de code.

Site de démonstration
https://www.phideco.com/

Installation

A l’activation, le plugin installe aussi les plugins suivants :

Configuration

La page de configuration permet quelques réglages :

  • Couleur principale du site
  • Article « hero » : l’article à la une
  • Article galerie : l’article qui sert pour placer les images en diaporama
  • Un pied de page : Texte libre

Les icônes de réseaux sociaux

En utilisant le plugin "Liens vers les réseaux sociaux", vous pourrez personnaliser les icônes des réseaux à afficher.

Rédaction

Configuration du site
Dans le menu configuration du site, pensez à renseigner :

  • Le titre du site
  • Son slogan
  • Un logo de site (qui sera repris dans l’article hero)

Les articles
Rédigez vos articles le plus simplement possible :

  • Un titre
  • Un texte court
  • Ajouter un logo à l’article qui servira d’illustration. En général il est préférable d’avoir une illustration carrée. Si aucune illustration n’est trouvée, on prend des images génériques. Utiliser des logos de tailles importantes (1000 à 2000px de large) car ces logos sont affichés en mode plein écran).

Le squelette liste tous les articles du site classés par ordre de numéro en alternant automatiquement les images à gauche puis à droite.

Pensez donc à utiliser la convention suivante :

10. Accueil
20. Savoir-Faire
30. Contact
....

Pour que le thème fonctionne bien graphiquement, il faut éviter d’écrire de longs articles, mais il faut plutôt écrire de nombreux petits articles (1 article = 1 paragraphe).

Article Hero
On affiche :

  • Le logo du site réduit
  • Le texte
  • Le logo de l’article sert pour le fond de page

Le titre de l’article Hero n’est pas affiché.

Article galerie
Cet article sert à créer le diaporama.
Créer l’article et y déposer vos images dans le portfolio.

Personnalisation

Pour les personnes qui veulent ajouter leurs propres styles, vous pouvez créer un fichier CSS personnalisé squelettes/css/html5_story_theme.css.

Une page « patron » est aussi livrée avec le squelette à l’adresse suivante :
http://monsite.tld/spip.php?page=_patron

Les autres squelettes HTML5 UP

Le site html5up.net propose de beaux thèmes dont certains ont été adaptés pour SPIP.
Voir la liste des thèmes html5up portés sur SPIP...

Discussion

Une discussion

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom