Ginza

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
(à venir)

Aperçu

Page d’accueil

Page article

Installation

• Télécharger et activer le plugin Ginza
• Le plugin active automatiquement les plugins
  • oEmbed
  • Crayons
  • Metas+
  • Champs extras
  • Rang auteurs

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)

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

Zone 2 : Articles à la une (articles affichés en pleine largeur)

Zone 3 : Articles récents (articles affichés en demi-largeur)

Zone 4 : Et aussi (articles affichés sous forme de liste)

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.