This page is also available in english
Imaginasite Per Page Css est un petit utilitaire qui vous permet d’ajouter des styles CSS à une page, un post ou un produit Woocommerce. Ces styles sont automatiquement injectés dans la balise head quand la page – ou l’article – est affichée en Frontend. La prévisualisation en direct dans l’éditeur Gutenberg des modifications facilite l’édition des styles.
Demo vidéo et screenshots
Au départ, un problème récurrent…
Il vous arrive peut-être d’avoir à modifier un ou plusieurs sites que vous n’avez pas développé vous-même. Ces sites, parfois un peu anciens, fonctionnent bien mais ils ont tendance à s’alourdir : au fur et à mesure des modifications demandées et de l’ajout de pages – dont des landing pages qui peuvent être complexes et déconnectées du style visuel du site – la feuille de style principale s’allonge, et tout le site prend de l’embonpoint. Pour éviter cet écueil, l’idéal est d’ajouter les nouveaux styles uniquement dans la page (ou le post) où ils sont nécessaires.
Pourquoi cette extension est utile :
- Pour cesser de culpabiliser quand vous avez 50 lignes de styles CSS à ajouter à une seule page – vous savez que vous allez alourdir tout le site en les ajoutant à la feuille de style principale. C’est ce qu’ont fait les autres développeurs qui ont travaillé sur le site avant vous, et aujourd’hui le fichier style.css fait 2000 lignes, dont la moitié ne sont sans doute plus utilisées / nécessaires.
- Pour éviter d’ajouter une balise <style> dans un bloc HTML au dessus de vos modifications ou en haut de la page. Ce n’est pas ici que ces styles doivent se trouver.
- Pour éditer des styles CSS dans une page ou un post, tout en prévisualisant en direct les modification (dans Gutenberg)
- Pour éviter un menu supplémentaire dans l’administration.
A quoi cette extension ne doit pas servir ?
- Cette extension ne sert pas à définir les styles généraux du site. Ces styles peuvent se trouver :
- dans le fichier theme.json
- dans le menu Apparence > Editeur > CSS additionnels
- dans le menu customize du thème.
- dans le fichier styles.css du thème
- Cette extension ne sera pas non plus très utile pour ajouter ou modifier des styles déjà éditables avec Gutenberg.
Dans les fait, cette extension vous sauve lorsque Gutenberg ne permet pas l’édition souhaitée, et que les styles ajoutés ne sont sensés s’appliquer que sur la page en cours d’édition.
Pourquoi cette extension et pas une autre ?
D’autres extensions permettent d’ajouter des CSS personnalisés aux pages et aux articles WordPress, certaines offrant même davantage d’options. N’hésitez pas à les tester et à les utiliser si elles correspondent davantage à vos besoins. Cela dit, voici les différences principales entre Imaginasite Per page CSS et les autres extensions :
- L’ergonomie : les styles ne sont pas édités tout en bas de la page, mais dans la barre latérale. On voit l’élément qu’on modifie pendant qu’on le modifie, avec une prévisualisation en direct des changements (dans l’éditeur Gutenberg). Cela fait toute la différence.
- L’aspect minimaliste : aucun menu supplémentaire n’est ajouté dans l’administration ; pas de configuration, pas de pubs, juste un champs d’édition augmenté avec CodeMirror dans les pages, les articles, les produits Woocommerce et les templates.
Pourquoi le style ajouté n’est pas appliqué aussi dans la vue « Archives » ?
Effectivement, les styles ajoutés ne sont injectés que dans la balise <head> du post ou de la page. Si vous avez besoin que les styles s’appliquent à d’autres éléments (comme l’archive d’une catégorie), vous pouvez les placer dans la feuille de style globale ou dans le menu customize / CSS additionnels de votre thème.
Cette extension est-elle sécurisée ?
Oui. Notez que vous devez avoir confiance dans les administrateurs qui y accèdent car les styles ajoutés ne sont pas centralisés et donc plus difficilement vérifiables, en particulier si votre site internet contient des centaines d’articles.
Que se passe t-il si je supprime l’extension ?
Les règles de styles CSS ajoutées à l’aide de l’extension à la balise head de vos pages et de vos articles seront supprimées et, logiquement, ne s’appliqueront plus.
