HTML5UP Massively

Squelette SPIP pour intégrer le modèle Massively de HTML5UP.
https://html5up.net/massively

Installation

A l’activation, le plugin installe aussi les plugins suivants (+ leurs dépendances) :

Pour installer Favicon, il faudra éventuellement ajouter le dépôt “Externals” - https://files.spip.net/externals/archives_externals.xml - sur la page d’administration des dépôts de votre site (/ecrire/?exec=depots).
(cf aussi https://plugins.spip.net/spip.php?page=depots)

Options

La page de configuration propose quelques options de couleurs :

  • la couleur de la typographie
  • la couleur de survol des liens et autres accents colorés
  • la couleur d’arrière plan de la page
  • la couleur de fond sous le contenu
  • la couleur d’arrière plan du pied de page
  • l’image d’arrière-plan est configurable dans les options (v0.7.0)
  • le choix de fixer l’arrière-plan (v0.7.0)
  • la couleur de typographie du pied de page
  • la couleur de typographie sous le pied de page

Dans les options aussi : lorsqu’il y a plusieurs articles dans une rubrique, le sous-menu des articles peut être soit masqué et apparaître au clic d’un bouton, soit être visible et apparaître sous forme d’onglet.

Et encore des options pour la page accueil ou l’entête :

  • Le titre de la page d’accueil peut être précisé, sinon ce sera le titre du site. C’est aussi le premier item du menu,
  • on peut choisir d’afficher le slogan et le descriptif sur la page d’accueil, ou pas,
  • un article peut être choisi pour être mis en avant sur la page d’accueil,
  • le mode d’affichage de la page d’accueil : mode blog avec les derniers articles publiés (par défaut) ou mode site avec les rubriques à la racine du site (secteurs),
  • l’âge maximum des articles sur la page d’accueil.

Des pages uniques

Avec le plugin Pages on peut créer :

  • une page nommée “mentions” qui servira pour les mentions légales et sera liée en pied de page.

L’image de fond de page

C’est une image pour laquelle est choisi le rôle “arrière-plan”. Pour mettre un rôle à une image, il faut qu’elle soit liée à un objet de SPIP, un article, une page unique...
(cf Rôle de documents)
Avec la version 0.7.0 du plugin, il est aussi possible de choisir l’image depuis la page de paramétrage du squelette. Si c’est elle est choisie là, l’image avec le rôle arrière-plan ne sera pas prise en compte.

Les images en général

Le plugin Centre Image permet de cibler le centre d’intérêt d’une image qui doit être recadrée.
L’image utilisée pour le fond de page est celle pour laquelle on a choisi le rôle d’arrière-plan.

Les liens sociaux

Le plugin Liens Sociaux permet d’utiliser des liens et des icônes adéquates vers les réseaux utilisés.

Le formulaire de contact

Le plugin Formulaire de contact avancé permet d’ajouter facilement un formulaire en pied de page.

Personnalisation

La feuille de style /squelettes/css/perso.css sera prise en compte pour personnaliser l’affichage sans perdre les mises à jour possibles. Idem pour les javascripts avec le fichier squelettes/js/perso.js

Les objets éditoriaux et fonctionnalités de SPIP

Seuls les squelettes article.html et rubrique.html sont intégrés à ce squelette, avec les pages sommaire.html et plan.html
Les mots-clefs seraient certainement bien appréciés.
Les sites syndiqués, les forums ou les pétitions ne sont pas encore prévus.

Comme tout dans l’univers SPIP, il est possible à tout utilisateur de participer en proposant une amélioration.

Les autres squelettes HTML5 UP

Le site html5up.net propose de beaux thèmes dont certains ont été adaptés pour SPIP. Voyez la liste des squelettes HTML5Up adaptés pour SPIP.

Bon SPIP !

Discussion

23 discussions

  • 4

    Bonjour, Une version de Massively pour Spip 4 est elle prévues ? Merci

    • Bonjour,
      ce sera la même, bien sûr. Malgré tout il faut peut-être tester SPIP4 en forçant la compatibilité des plugins SPIP3.2, en ajoutant cette ligne dans config/mes_options.php
      define('_DEV_VERSION_SPIP_COMPAT',"3.2.99");

    • Bonjour, Je n’ai pas trouvé le fichier “mes_options.php” par contre j’ai fait la modification indiquée dans “connect.php” et tout semble fonctionner normalement en local.

    • Le fichier mes_options.php n’existe pas par défaut puisque ce sont “mes options” (= vos options à vous pour personnaliser SPIP), il faut donc le créer.

    • Merci bien, effectivement ça fonctionne avec cette syntaxe au début <?php, si non c’est la cata. Explications sur le fichier mes_options.php https://www.spip.net/fr_article4654.html

    Reply to this message

  • 1

    Bonjour,

    Je vous remercie pour ce thème, très fonctionnel et extrêmement pratique, je voudrais modifier quelques éléments, j’ai pal cherché sur des tuto’s et des forums, malheureusement, je n’y arrive pas. J’avoue tout de suite être très mauvais en termes de développement web.

    -  Je n’arrive pas mettre la page “mentions” en pied de page, toutes mes excuses je dois être vraiment nul ; j’ignore comment faire...

    -  Je souhaiterai adjoindre un numéro issn sur la page, j’ai tenté de l’inclure tout en bas de la page ; à côté du “plan du site”...etc. J’ai modifié le fichier footer.html dans /squelettes/inclure mais ça n’a pas fonctionné... j’ai dû mal m’y prendre.

    -  troisième et dernier point ; est-ce possible de mettre en place une newsletter ?

    Encore merci pour votre attention,

    • Bonjour,
      -  pour la page “mentions”, if faut que ce soit une page unique (vérifiez peut-être que le plugin de ce nom est bien activé) : cf dans Édition > Pages uniques, et le nom de la page doit juste être “mentions”, pour le titre c’est comme vous voulez.
      -  Pour ajouter du contenu dans la page, avez-vous quelques notions de comment fonctionne le code dans un squelette SPIP ? Vous pouvez peut-être trouver ce qui vous manque par ici : https://www.spip.net/fr_article899.html#Filtrer-les-resultats
      -  Pour la lettre d’information rien n’empêche d’activer le plugin Newsletters, c’est tout à fait indépendant du squelette Massively.

    Reply to this message

  • 3

    Bonjour,
    Je viens de mettre à jour la dernière version de Massively, j’ai “recalculé les CSS” et les icônes des réseaux sociaux en bas de page on disparues, le lien sous l’icone (absente) fonctionne bien par contre. Il y a eu une MAJ il n’y a pas très longtemps du plugin “Réseaux sociaux” ça vient peut être de là ?

    Reply to this message

  • 1

    au départ je pensais que ça dysfonctionnait ainsi par rapport au fait que j’étais “connecté” à mon espace, ensuite j’ai eu deux retours (aujourd’hui et il y a deux jours) de lecteurs qui arrivaient pas accéder à tel ou tel article et ce qui a fini de me persuade c’est ce partage sur FB : https://www.facebook.com/ethalides/posts/2861490014115587
    c’est le logo du site qui s’affiche et non celui de l’article... comme si le lien posté était celui de la homepage...

    j’avoue ne pas comprendre... mais s’il n’y a aucun dys’ de votre côté j’en suis bien content :)

    encore merci pour votre attention !

    • Désolé, je ne vois pas.
      Je ne sais pas si ça a un effet, le site est bien accessible en “https” mais aussi en “http” sans “s”, et ça peut poser des soucis dans certains cas. Vous pourriez peut-être placer ces lignes dans le .htaccess pour diriger tout le trafic sur le “https” :

      RewriteCond %{HTTPS} !=on
      RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

      Et aussi, pour une question ergonomique, vous pouvez peut-être prendre l’option “Menu > Masquer la navigation des articles” dans le paramétrage du squelette... ?

    Reply to this message

  • 5

    Bonjour d’abord merci pour ce thème fluide et efficace,
    j’ai pourtant un petit souci avec, certains articles parfois ne veulent pas s’ouvrir et renvoient en boucle vers la homepage, notamment lorsque le lien est posté sur les RS (réseaux sociaux), est-ce un problème connu ? si oui, comment le réparer ?
    Encore merci pour votre attention...

    • Bonjour,
      il y a peut-être des soucis avec les urls arborescentes, est-ce que vous avez ce réglage sur votre site ?
      Quand vous dites “lorsque le lien est posté sur les RS”, ça signifie quoi exactement ?

    • Merci pour votre réponse, par RS j’entendais réseaux sociaux (j’aurais dû le préciser pardon)...

      sinon vous avez tout à fait raison pour les urls ! ce sont des “URLs Propres en query-string : ?Titre-de-l-article”

      je crois que c’est dû aux majuscules des titres, j’ai remarqué que quand je tombe sur un cas pareil où ça n’arrête pas recharger la homepage il suffit de changer (dans l’url) les majuscules par des minuscules pour que la bonne page se charge, je viens de découvrir ça il y a à peine une petite heure, à voir si c’est vraiment ça, qu’en pensez-vous ?

      Merci pour votre réponse et votre attention !

    • Alors vous pourriez déjà cocher l’option pour transformer toutes les urls en minuscule, dans la configuration avancée des urls. (cf /ecrire/?exec=configurer_urls en bas de page)
      Ce n’est pas ce à quoi je pensais, mais si c’est votre solution parfait...

    • non finalement je me suis trompé ça continue de le faire !
      ce lien par exemple, qui pourtant il y a quelques jours fonctionnait parfaitement :
      https://litteralutte.com/?par-dela-le-bon-et-le-mauvais-deleuze

      merci !

    • Je ne constate aucun dysfonctionnement, tout semble fonctionner comme sur des roulettes :o)

      Après quelle action avez-vous ce problème ? Est-ce lorsque vous êtes connecté uniquement ?
      Peut-être pouvez-vous visiter le site en étant déconnecté pour essayer de reproduire le phénomène...

    Reply to this message

  • 4

    Bonjour,

    je n’arrive pas à afficher une image dans le corps de texte d’un article.
    Que cela soit avec le raccourci

    <img436|left> 
    <doc436|left> 

    ou

     <media436|left>

    du plugin modèles media.
    Une idée ?
    Question subsidiaire : le logo de l’article n’est pas repris dans le squelette article ?
    Voir site
    Merci de vos réponses.
    Cordialement

    • Bonjour,
      Je ne vois pas de soucis sur une installation toute fraîcheé, les images sont incluses correctement.
      Est-ce que vous avez d’autres plugins activés non nécessaires à Massively ?

    • Bonjour,

      il semble qu’il y ait une incompatibilité avec le couteau suisse.
      Dommage pour le CS et son glossaire interne.

      Le logo de l’article ne s’affiche pas dans la page article. C’est voulu par le thème ?

      Merci

    • Oui pour le logo, c’est voulu. Ça permet de ne pas faire des pages systématiquement identiques. Il faut le mettre manuellement si on veut, et du coup on peut le mettre à droite ou à gauche ou plus bas dans le texte...

    • Le glossaire interne, c’est un peu comme Dictionnaires ?

    Reply to this message

  • Didier

    Bonjour,
    J’ai un petit souci avec la combinaison des plugin « Massively » et « Galleria », uniquement avec Firefox sous Windows 10.
    Quand j’arrive sur le site, que j’ouvre un article avec une galerie « Galleria » les photos défilent dans la galerie sans problème avec la flèche de droite, exemple à partir de la page d’accueil en cliquant sur :https://www.gualeni.com/La-cite-Fruges-Le-Corbusier-a-Pessac.html . Si je passe à un autre article avec galerie en passant par la touche back du navigateur par exemple sur :https://www.gualeni.com/Promenade-dans-Bordeaux-et-ses-environs.html , là les images ne peuvent plus défiler, c’est coincé sur la première image. Si j’utilise l’option “pleine page” de « Galleria », là, ça fonctionne en pleine page et si je ferme la pleine page les images défilent bien dans la galerie. Après sur une ou deux galeries ça marche puis ça ne fonctionne plus pour les suivantes…
    J’ai vidé le cache du site, le cache du navigateur mais le problème subsiste.
    J’utilisais avant le plugin HTML5UP Editorial, je suis revenu sur ce plugin et là aucun souci avec Firefox sous Windown10. Idem avec l’habillage de base de Spip.

    Reply to this message

  • 2

    Bonjour,
    Une fois que l’on a sélectionné un article à mettre en évidence sur la page d’accueil, je ne vois pas comment le retirer et revenir à l’affichage initial sans article mis en évidence.
    Merci
    Cordialement

    • Didier

      Pour retirer cet article mis en avant, il faut faire : / modifier/ choisir le même article/ là une petite croix rouge apparait à droite du titre de l’article/ cliquer dessus /enregistrer.
      Ça serait plus simple si la croix apparaissait après l’enregistrement de l’article mais ce n’est pas le cas, il faut le rechoisir pour le supprimer.

    • Bonjour,
      oui, c’est un défaut ergonomique qui est en cours de correction...

    Reply to this message

  • Jean Philippe

    Bonjour,

    Comment paramétrer l’âge récent des articles de telle sorte qu’ils soient toujours affichés ? En dehors de mettre un nombre de jours énorme.
    Merci.

    Reply to this message

  • Didier

    Je pensais avoir trouvé comment afficher des images de fond de façon aléatoire.
    Dans le fichier styles_config.css, à la ligne 47 il est écrit :
    <BOUCLE_bg(DOCUMENTS){role=arriereplan}{0,1}{!par date}{tout}>
    j’ai remplacé {!par date} par {par hasard}

    Le problème est que moi, en tant qu’administrateur connecté, si je clique sur la fonction “Recalculer la page”, l’image change de façon aléatoire mais le visiteur lambda ne voit que ma dernière manip car pour lui le changement aléatoire ne fonctionne pas.
    Comme si l’image était bloquée en cache. Quelqu’un verrait-il une solution ?
    Merci

    Reply to this message

Add a comment

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 / PostgreSQL
  • 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 apparait.

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.

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom