Ce petit framework CSS pour SPIP 2 fournit une base de travail pour l’intégration, sous la forme d’un jeu de feuilles de style dynamiques et paramétrables, proposant les pré-réglages fondamentaux, notamment typographiques.
Note de version
Dans la continuité de la précédente, cette seconde version propose :
- une base typographique complète et harmonieuse, encore plus proche de Blueprint,
- sans plus aucune image (plus de puce sur les listes, ni de guillemets sur les citations), ni autre fioriture,
- avec un meilleur support d’IE, sans hack,
- prise en charge de l’impression (sans feuille dédiée),
- et adopte le reset 2 d’Eric Meyer
- et certaines bonnes pratiques du HTML5 Boilerplate.
Bref, que du bon !
Attention : ce plugin distribue un framework CSS. Il n’y a pas lieu de le mettre à jour après l’avoir installé sur votre site ! La compatibilité avec Pétronille 1 n’est pas garantie, en particulier au delà de la révision 45096.
Mise en service
- Ce plugin s’installe et s’active comme n’importe quel autre
- Si vous partez de la dist de SPIP, pensez à désactiver toute autre feuille de style, en particulier
spip_style.css
, sans quoi il risque d’être sans effet - Un panneau de config permet de régler la taille de typo, l’interlignage, la police, les couleurs, etc.
- Videz les caches (SPIP et navigateur)
- Prévisualisez à cette page
?page=demo/typo
- Construisez ensuite votre habillage sur cette base, dans votre propre feuille de style, style.css, comme d’habitude
Démo et kit d’intégration
Une démo statique est disponible à part. C’est une extraction figée des feuilles de styles générées par ce plugin, avec des gabarits HTML exemplaires et commentés, utilisables hors SPIP. Elle peut donc servir de kit de démarrage pour l’intégrateur.
Voir aussi la doc dédiée de cette rubrique : « Arborescence de l’intégration », « Ordre d’appel des feuilles de style », etc.
Dans SPIP, prévisualisez en affichant les pages :
- ?page=demo/typo
- ?page=demo/form
Vous pouvez aussi installer la base de démarrage (sur un SPIP vide), qui met quelques intéressantes pages de test à disposition, dont une « charte typo » qui présente un échantillon de chacun des enrichissements typographiques disponibles nativement dans SPIP (voir exemple de charte typo) et des alignements d’images (voir exemple d’alignements d’images).
Comment utiliser une grille CSS dans SPIP ?
Pourquoi n’y a-t-il pas de grille dans ce framework ? Parce qu’il existe déjà bien des grilles CSS, parce que vous avez sans doute vos habitudes et que ce petit framework veut limiter les contraintes et vous laisser libres de choisir ce qui vous arrange.
Vous pouvez compléter cette base avec un autre framework CSS et plus particulièrement par la grille de votre choix. Il suffit pour cela de déposez les feuilles de style voulues dans dossier « squelettes », en les renommant selon la nomenclature Daisy : grid.css, layout.css... Elles seront alors automatiquement appelées dans les squelettes.
Aucune discussion
Ajouter un commentaire
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.
Suivre les commentaires : |