Comment éditer un fichier CSS WordPress?

Modifiez toujours le fichier custom.css au lieu du fichier styles.css
Modifiez toujours le fichier custom.css au lieu du fichier styles.css.

WordPress est un framework de styles utilisant le langage de conception CSS. CSS signifie Feuilles de style en cascade. Ces feuilles de style contiennent les instructions qu'un navigateur utilisera pour générer l'apparence visuelle d'un site Web. Commencez à l'étape 1 ci-dessous pour apprendre à modifier les fichiers CSS dans WordPress.

Méthode 1 sur 4: édition via l'interface wordpress

  1. 1
    Accédez à votre éditeur en parcourant: L'éditeur affiche tous les fichiers de votre dossier de modèles.
    • Apparence (dans la barre de gauche)
    • Éditeur
  2. 2
    Ouvrez le fichier custom.css ou style.css. De préférence, vous souhaitez utiliser le fichier custom.css s'il y en a un. Cela facilite la mise à jour de votre thème à l'avenir.
  3. 3
    Effectuez les modifications CSS souhaitées et enregistrez votre fichier CSS.
  4. 4
    Ouvrez votre site Web. Vérifiez si les modifications se sont déroulées comme elles étaient censées le faire.

Méthode 2 sur 4: édition via ftp

  1. 1
    Ouvrez le FTP de votre site Web via votre logiciel préféré.
  2. 2
    Accédez à votre répertoire de thèmes. Tous les thèmes sont situés dans ce dossier:/wp-content/themes/
  3. 3
    Recherchez le fichier custom.css ou styles.css dans le répertoire principal. Utilisez custom.css dans la mesure du possible et ne modifiez pas les fichiers css dans les sous-dossiers.
  4. 4
    Téléchargez le fichier css et apportez les modifications requises dans un éditeur de fichier. Utilisez de préférence un éditeur qui comprend la syntaxe du code, comme notepad++ ou sublime text.
  5. 5
    Téléchargez votre fichier lorsque les modifications sont terminées. Vérifiez les changements dans votre site Web.

Méthode 3 sur 4: édition via un plugin CSS personnalisé

  1. 1
    Téléchargez un plugin CSS personnalisé.
  2. 2
    Ouvrez votre éditeur CSS. En fonction de votre plugin vous le trouverez:
    • Dans la barre de gauche
    • Sous Apparence dans la barre de gauche
    • Sous Outils dans la barre de gauche
  3. 3
    Apportez les modifications que vous souhaitez appliquer à votre site Web.
  4. 4
    Vérifiez les modifications en visitant votre site Web.
Enregistrez votre fichier CSS
Effectuez les modifications CSS souhaitées et enregistrez votre fichier CSS.

Méthode 4 sur 4: modifier le champ CSS actuel de votre thème

  • De nombreux thèmes ont un champ CSS personnalisé intégré.
  1. 1
    Ouvrez vos options de thème. Selon le thème vous le trouverez:
    • Dans la barre de gauche (sous le nom du thème)
    • Dans la barre de gauche sous Apparence
  2. 2
    Parcourez les options de votre thème à la recherche d'un champ "css personnalisé" ou "styles personnalisés".
  3. 3
    Saisissez les modifications que vous souhaitez créer. Vérifiez-les en visitant votre site Web.

Conseils

  • Modifiez toujours le fichier personnalisé. css au lieu du fichier styles.css. Si vous mettez à jour votre thème, le fichier styles.css sera écrasé, mais pas le fichier custom.css!
  • Le css personnalisé custom.css ou plugin/thème remplace généralement le style.css par défaut
  • Une autre feuille de style remplace-t-elle vos modifications? Utilisez des sélecteurs CSS plus spécifiques. Par exemple au lieu d'utiliser #myblock use.page.sidebar #myblock
  • Votre édition est-elle toujours remplacée? Ajoutez une balise!important à votre ligne. Par exemple «couleur: rouge;» devient "couleur: rouge!important;".

Mises en garde

  • La modification de votre style.css au lieu de custom.css rendra difficile le suivi de ce que vous avez modifié
FacebookTwitterInstagramPinterestLinkedInGoogle+YoutubeRedditDribbbleBehanceGithubCodePenWhatsappEmail