Présentation
Ginza est un squelette sous Bootstrap4. Il propose:
- une présentation classique des contenus sous forme éditoriale des articles et rubriques
- il est multilingue et est livré avec les fichiers de langue en français, anglais et arabe et les liens de traduction.
- il embarque la galerie modale “Fancybox” pour présenter vos photos de façon élégante
- il est largement configurable notamment en termes de couleurs
- il utilise les polices systèmes et donc affiche correctement n’importe quelle chaine Unicode (arabe, asiatique, ....)
- il est facilement surchargeable pour le personnaliser à vos besoins
Ce squelette est idéal pour tenir un blog, pour les universitaires et chercheurs
Le squelette se débrouille aussi bien sur les smartphones.
Exemple de site basé sur Ginza
https://vbat.org/
Aperçu
Page d’accueil
Page article
Installation
- Télécharger et activer le plugin Ginza
- Le plugin active automatiquement les plugins
A l’installation,
- le plugin crée aussi un champs extra pour gérer les tris des rubriques
- le plugin désactive la boîte multimédia fourni par défaut par SPIP pour la remplacer pour FancyBox
Lorsque votre site passe en production, il est recommandé d’activer la compression des fichiers javascript et CSS pour avoir un site rapide à charger.
Configuration
Le squelette est configurable
Liens vers les pages démo
Choix des contenus (menu, page d’accueil, pied de page, pagination)
Astuce: Si le plugin Sélections éditoriales est installé, le menu de configuration vous propose en plus du sélecteur d’articles habituel, de gérer les blocs avec une sélection éditoriale (ce qui permet plus de confort notamment avec l’interface en glisser-déposer).
Choix de la palette du site
Présentation des rubriques
Sur chaque rubrique, vous pouvez choisir l’ordre des affichages des articles qui y figurent
Page d’accueil
La page d’accueil est composée de plusieurs zones.
Zone 1: L’article de ré-assurance
- Le contenu du texte se définit dans le menu de configuration du squelette.
- Il est possible d’utiliser la syntaxe SPIP pour ajouter un lien, une image
- Le menu de configuration permet aussi d’ajouter un bouton pour renvoyer sur un contenu plus complet.
Zone 2: Articles à la une (articles affichés en pleine largeur)
- la sélection des articles se fait manuellement dans le menu configuration
- on affiche le titre de l’article
- l’image est le logo de l’article. Il est recommandé d’utiliser des images de largeur 1200 pixels ou plus
Zone 3: Articles récents (articles affichés en demi-largeur)
- la sélection des articles se fait manuellement et/ou de façon automatique (articles récents) dans le menu configuration
- on affiche le titre de l’article
- l’image est le logo de l’article. Il est recommandé d’utiliser des images de largeur 1200 pixels ou plus
- si l’article contient un champs descriptif on l’affiche à gauche de l’image
Zone 4: Et aussi (articles affichés sous forme de liste)
- la sélection des articles se fait manuellement et/ou de façon automatique (articles récents) dans le menu configuration
- on affiche le titre de l’article uniquement
Personnaliser Ginza
Ajouter une feuille de style personnalisée
Vous pouvez ajouter votre feuilles de style personnelle.
Cette feuille de style devra s’appeler css/perso.css.
Il est recommandé de la déposer dans le répertoire squelettes/
Ajouter un logo
Pour ajouter le logo, il suffit d’ajouter un logo dans le menu de configuration du site.
Il est conseillé de choisir un format en PNG transparent ou en SVG
Plus globalement, la présentation de l’identité est défini dans un fichier inc/branding.html que l’on peut surcharger selon vos besoins.
Surcharger d’autres blocs
Plus généralement, vous pouvez surcharger tous les les éléments du squelette en ajoutant votre copie modifiée dans le répertoire squelettes/.
Si vous utilisez le plugin squelette par rubriques, vous pouvez aussi ajouter des déclinaisons spéciales pour une rubrique donnée, par exemple squelettes/rubrique-45.html
Modèle <bouton> fourni
Ginza fournit un nouveau raccourci <bouton> pour facilement ajouter des boutons dans le texte des rédacteurs
Un bouton minimal: Un bouton “découvrir” qui renvoie sur l’article n°5
<bouton|url=5>Un bouton complet: Un bouton qui renvoie vers le site SPIP.net avec un texte personnalisé sur hyperlien
<bouton|url=https://www.spip.net|titre=Le site officiel de SPIP>affichera
Astuces
Le squelette est basé sur Bootstrap 4. On peut donc facilement utiliser les classes fournies dans vos articles SPIP (voir les exemples dans l’article démo)
Remarques
Le squelette est sur la forge git de SPIP. N’hésitez pas à contribuer en conservant à l’esprit de laisser le squelette aussi générique que possible.
Discussions by date of activity
2 discussions
Bonjour,
J’essaie ce squelette mais je n’arrive pas à changer la palette de couleur sur la page /ecrire/?exec=configurer_ginza
Je choisis une couleur, j’enregistre mais la sélection n’est pas prise en compte (j’ai désactivé le cache) et la fenêtre de choix reste affichée (cf capture ci-joint).
Merci
Bizarre , je n’arrive pas à reproduire ton bug.
Peux-tu essayer sur un autre navigateur genre chrome pour voir si le bug demeure ?
Bonsoir,
J’ai essayé avec un navigateur basé sur Chromium et c’est pareil.
Par contre pour le même site sur la page ecrire/?exec=configurer_identite
il y a une option de configuration pour l’Écran de connexion
et là je n’ai pas de problème pour choisir la couleur.
Pour moi ce problème n’est pas bloquant.
dd
Désolé, je n’arrive pas à reproduire ton bug.
Le squelette utilise le champs de saisies couleur standard qui fonctionne parfaitement.
Tu as peut être un plugin supplémentaire qui casse un javascript ou quelque chose de ce type.
Essaie en désactivant (temporairement) les plugins pour identifier le problème.
a++
Bonsoir,
C’est moi qui suis désolée ; Je n’appuyais pas sur le bon carré pour modifier la couleur de fond de page.
Maintenant j’ai trouvé et cela fonctionne.
Merci d’avoir regardé.
dd
Content que cela fonctionne ! Merci pour le retour :)
Reply to this message
Au top ! Merci pour le squelette !
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 :
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.
Follow the comments:
|
