Styles générés par SPIP

Published : 1 March 2011 – updated on 16 March 2019 – by tetue

1
2
3
4
5
4 Votes

Ce framework propose un style de base pour les éléments générés par SPIP.

Contenus : typographie et médias

À partir du moment où l’on dispose d’une base typo (comme celle de ce plugin ou de n’importe quel bon framework CSS), il n’est pas nécessaire de styler ces sélecteurs générés par SPIP pour des enrichissements typographiques, sauf pour mettre des variantes à disposition des rédacteurs.

-  h3.spip : intertitre
-  hr.spip
-  ul.spip
-  ol.spip
-  deux types de citations : blockquote.spip et blockquote.spip_poesie
-  tableau : table.spip, tr.row_even, tr.row_odd
-  hyperliens : .spip_out, .spip_in, .spip_mail, .spip_url, .spip_glossaire, etc.
-  etc.

Voir cet exemple exhaustif de charte typo SPIP, également distribué en «Base de démarrage».

Les alignements des médias sont déjà définis (dans ce plugin). Vous n’avez donc pas besoin de les prévoir, sauf en cas d’habillage spécifique.

-  .spip_logos
-  .spip_documents
-  .spip_documents_center
-  .spip_documents_left
-  .spip_documents_right
-  .spip_doc_titre
-  .spip_doc_descriptif

Les illustrations et documents sont générés par SPIP sur une structure imposée en dl dd dt. Voir cet exemple exhaustif de rendus d’insertion, également distribué en «Base de démarrage».

Formulaires SPIP

C’est sans doute la partie la plus contraignante de SPIP pour l’intégrateur. Les formulaires ont une structure HTML imposée mais cohérente, à base de ul li, dans une div englobante, avec ces sélecteurs :

-  .formulaire_spip : conteneur englobant de tout formulaire généré par SPIP
-  .formulaire_spip ul
-  .formulaire_spip li
-  .formulaire_spip li.obligatoire
-  .formulaire_spip li.erreur

-  input.text, input.password, etc.
-  .boutons : conteneur des boutons
-  input.submit

-  .reponse_formulaire
-  .reponse_formulaire_erreur
-  .erreur_message
-  .reponse_formulaire_ok

-  .previsu
-  etc.

Voir documentation et exemples : «Structure HTML des formulaires de SPIP 2».

Surlignement des résultats de recherche :
-  .pas_surlignable : à placer par défaut sur tout élément body pour éviter le surlignage intempestif des pages
-  .surlignable : à placer sur les conteneurs où les résultats d’une recherche doivent apparaître surlignés
-  .spip_surligne : surlignement d’un terme de la requête

Autres

N’oublions pas la pagination :
-  .pagination (avec .sep et .on) : suite de liens dans un p (et non pas en ul li)

Discussion

5 years 1 year 3 months Without limit
par date
Filter

No discussion

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
  • 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 apparaît.

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