SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

291 Plugins, 198 contribs sur SPIP-Zone, 66 visiteurs en ce moment

Accueil > Squelettes > Squelettes spéciaux > STORY (HTML5UP) > Story (HTML5UP)

Story (HTML5UP)

17 mai 2018 – par erational – 18 commentaires

8 votes

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 :

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

Dernière modification de cette page le 18 mai 2018

Retour en haut de la page

Vos commentaires

  • Le 25 octobre à 21:44, par En réponse à : Story (HTML5UP)

    Bonjour,

    Faut-il ajouter un plugin pour pouvoir choisir un style graphique ?

    • Le 25 octobre à 23:16, par JLuc En réponse à : Story (HTML5UP)

      Non, les squelettes HTML5up portés par SPIP sont indépendants et chacun a été porté en SPIP de manière différente. Mais avec le plugin zpip, le plugin zengarden permet de choisir parmi un lot de thèmes.

    Répondre à ce message

  • Le 13 octobre à 17:52, par dut En réponse à : Story (HTML5UP)

    J’aimerai recourir à la fonctionnalité des blocs dépliables dans un site avec ce squelette, mais ceci n’est pas pris en compte.

    Y’a t’il des choses à ajouter dans le head pour que le script fonctionne ?

    Cordialement

    • Le 16 octobre à 14:16, par dut En réponse à : Story (HTML5UP)

      Je reviens car j’ai avancé.

      Dans le fichier inc/inc_head en mettant la balise #INSERT_HEAD après l’insertion des script, le problème a disparu.

      erational, je te laisse juger de l’interet de fixer cette intervertion dans le zip de ce plugin.

    Répondre à ce message

  • Le 11 octobre à 21:55, par dut En réponse à : Story (HTML5UP)

    J’aimerai recourir à la fonctionnalité des blocs dépliables dans un site avec ce squelette, mais ceci n’est pas pris en compte.

    Y’a t’il des choses à ajouter dans le head pour que le script fonctionne ?

    Cordialement

    Répondre à ce message

  • Le 3 juillet à 16:00, par ivandps En réponse à : Story (HTML5UP)

    Bonjour,
    j’ai l’impression que le titre du site ne s’affiche pas ?
    http://amidesk.com/maquette
    Une idée ?
    Merci !

    Répondre à ce message

  • Le 24 mai à 17:09, par Patrick En réponse à : Story (HTML5UP)

    Bonjour,
    J’ai fait un spip « onepage » à partir de la dist.
    Pour tester votre plugin, je lai installé en local.
    Merci
    Mais comment supprimer les dépendances aux autres plugins si c’est possible ?

    • Le 25 mai à 07:57, par Patrick En réponse à : Story (HTML5UP)

      Trouvé :
      paquet.xml
      lignes 21 etc. « necessite »
      je cherche à faire un site onepage le plus léger possible.
      L’ordre des articles est donné par leur ordre de rédaction.
      Merci

    Répondre à ce message

  • Le 17 mai à 22:34, par KrAL En réponse à : Story (HTML5UP)

    Bonjour , ce squelette m’a l’air magnifique mais je ne sais pas pourquoi mais les logos apparaissent extrêmement grossis et inutilisables , trop zoomés .
    De plus , je ne sais pas comment on specifie qu’un article est Hero ou Gallerie et je ne sais pas non plus comment écrire du texte à côté de l’article ...qui apparait à droite .
    Voici ICI mon essai de site , je le laisse tel quel ...

    • Le 18 mai à 08:16, par erational En réponse à : Story (HTML5UP)

      Bonjour,

      Votre lien renvoie actuellement une page blanche ...

      Pour choisir les articles hero et galerie, il faut aller sur la page configuration du plugin :
      ecrire/ ?exec=configurer_html5up_story

      Pour les logos, il faut prendre en effet des tailles suffisantes (au minimum 1000px de large) car ils servent d’illustration et sont affichés en plein écran.

    • Le 18 mai à 08:23, par KrAL En réponse à : Story (HTML5UP)

      Euh non , ce n’est pas une page blanche ...

      Merci pour ce conseils j’irai voir sur la page dès que possible .
      Ok pour les logos , au début je croyais qu’ils étaient trop gros ...

      Merci pour ce magnifique squelette, je vais bien arriver à en faire quelque chose :)

    • Le 18 mai à 08:32, par KrAL En réponse à : Story (HTML5UP)

      Merci mais , sur la page de configuration ,il y a très peu de choses , on peut aller à modifier et là , que fait-on ?
      je regarderai plus tard , merci ...

    • Le 18 mai à 08:35, par erational En réponse à : Story (HTML5UP)

      C’est un thème pour créer un site très simple sans coder.
      Le nombre d’options est volontairement limité.

      Si cela ne convient pas, vous pouvez forker le plugin et l’adapter à vos besoins.
      La page _patron est là pour vous donner la syntaxe de thème graphique.

      Merci de ne pas inonder le forum de messages peu utiles du type « Je verrais plus tard .... »

    • Le 18 mai à 13:20, par KrAL En réponse à : Story (HTML5UP)

      Ah , je n’avais pas vu ce message , désolé , mais j’étais navré de ne pouvoir expérimenter immédiatement la proposition .
      Je fais remarquer qu’ajouter des excuses dans un post n’inonde pas le forum , je regarderai le patron ...

    Répondre à ce message

  • Le 18 mai à 13:17, par KrAL En réponse à : Story (HTML5UP)

    Je me rends compte que je croyais que mes participations n’étaient pas passées mais elles se sont additionnées en fait :) Si quelqu’un peut enlever les doublons , merci ...

    En fait le lien, bien sûr est le même que celui qu’on trouve sur l’interface privée bien sûr . J’y été allé mais je n’avais pas compris :
    On va sur l’ « article Hero » on clique sur modifier mais ce n’est pas là qu’on crée l’article , on choisit parmi les articles déjà créés . et on enregistre...
    Du coup ça marche , au lieu d’être à droite , mon article est à présent à gauche ...mais mon logo est trop long .
    Je pense qu’il va falloir expérimenter ... s’il y avait une documentation , même en anglais , je suis preneur ...

    Merci beaucoup encore une fois pour ce squelette , navré que je sois aussi maladroit ...

    Répondre à ce message

  • Le 18 mai à 08:30, par KrAL En réponse à : Story (HTML5UP)

    Petit problème :
    http://ll.cilal.net/ecrire/?exec=configurer_html5up_story ---> not found

    Bon je suis vraiment pressé , merci , je regarde ça plus tard ...

    Répondre à ce message

  • Le 18 mai à 08:26, par KrAL En réponse à : Story (HTML5UP)

    Euh non , ce n’est pas une page blanche ...

    Merci pour le truc pour la configuration , je vais regarder .

    Pour les logos ,je croyais avoir mis trop gros au début et plus je réduisais , moins ça allait ... :)

    Bravo pour ce magnifique squelette , je vais bien y arriver un jour mais il est assez différent de tous les squelettes que j’ai pu tester ...

    Répondre à ce message

Répondre à cet article

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 Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Formidable, le générateur de formulaires

    23 janvier 2012 – 2531 commentaires

    Un générateur de formulaires facilement configurable pour les non-informaticiens et facilement extensible pour les développeurs. Introduction L’objectif était de créer un plugin permettant de générer des formulaires. Historiquement, 2 plugins (...)

  • Calendrier Mini 2.0

    19 mai 2012 – 256 commentaires

    Ce plugin ajoute la balise #CALENDRIER_MINI qui insère un petit widget de navigation par mois dans les dates des évènements. Fonctionnement du mini calendrier Le mini calendrier présente un mois à la fois. Les jours du mois comportant des (...)

  • Owl Carousel 2

    30 novembre 2017 – 41 commentaires

    Owl Carousel est un diaporama jQuery adaptable aux différentes tailles d’écran, qu’on peut actionner par glisser, il utilise CSS3 mais il est compatible avec les vieux navigateurs, et il est aussi paramétrable. Le présent plugin permet d’utiliser (...)

  • Paiement avec Formidable

    16 février 2015 – 69 commentaires

    Ce plugin « Paiement avec Formidable » permet d’ajouter une étape de paiement à la fin de la saisie d’un formulaire créé par le plugin Formidable. Il le complète et nécessite par ailleurs le plugin bank qui gère l’interface technique avec les prestataires (...)

  • Bouquinerie V2 : guide de l’utilisateur

    3 janvier – 18 commentaires

    Configuration Quels contenus Selon la maquette adoptée pour votre site, vous pouvez décider que certains éléments des livres ou auteurs de livre ne sont pas utilisés. Vous trouverez dans la page de configuration du plugin la possibilité de (...)