Comment modifier WordPress CSS

Après avoir lu ce tutoriel, vous pourrez facilement implémenter la personnalisation WordPress CSS. Les méthodes pour modifier les CSS peuvent varier d'un thème à un autre. Par conséquent, les techniques décrites incluent le code de modification à l'aide de l'option CSS supplémentaire, éditer le code de l'éditeur de thème et utiliser des plugins.

Toutes les instructions expliquées dans ce tutoriel comprennent des captures d'écran, ce qui permet à tous les utilisateurs de les suivre facilement.

Important: Ce n'est pas un tutoriel de codage CSS mais un tutoriel vous montrant comment ajouter CSS personnalisé dans WordPress. Le tutoriel s'adresse aux utilisateurs avec une idée de base de la programmation CSS, bien que dans la dernière section, vous pouvez trouver un plugin qui vous permet de modifier CSS de manière visuelle.

Édition CSS à partir de l'écran de personnalisation WordPress (CSS supplémentaire):

La première méthode expliquée dans ce tutoriel est la plus conventionnelle: édition WordPress CSS du panneau CSS supplémentaire illustré dans l'écran de personnalisation.

Lorsque vous modifiez le CSS en utilisant cette technique, votre édition restera même après la mise à jour de votre thème sans avoir besoin d'un thème enfant (mais, l'utilisation d'un thème d'enfant est toujours recommandée). Bien sûr, cette édition sera supprimée si vous changez votre thème.

Pour commencer, connectez-vous à votre tableau de bord WordPress et sur le menu de gauche, déplacez votre curseur de souris Apparence et appuyez sur le Personnaliser Option comme indiqué dans la capture d'écran ci-dessous (Apparence> Personnaliser).

Une fois dans l'écran de personnalisation avec un aperçu en direct de votre site, faites défiler le menu de gauche pour trouver le bouton CSS supplémentaire et appuyez dessus.

Vous verrez une boîte vide où vous pouvez taper votre code; Vous pouvez modifier votre site CSS.

Une fois que vous avez terminé de modifier votre CSS, appuyez sur le Publier bouton pour appliquer les modifications.

Comment modifier CSS à partir du tableau de bord WordPress:

Vous pouvez également modifier votre CSS en modifiant le .CSS fichiers via l'éditeur de thème.

Lorsque vous utilisez cette technique, il est préférable d'utiliser un thème enfant et d'enregistrer une sauvegarde de vos fichiers.

Pour commencer, connectez-vous à votre tableau de bord WordPress et sur le menu de gauche, déplacez votre pointeur de souris Apparence Et puis appuyez sur Éditeur de fichiers à thème Comme indiqué dans l'image suivante (Apparence> Éditeur de fichiers de thème).

Sur la colonne de droite (Fichiers à thème) Trouvez le fichier CSS que vous souhaitez modifier. Certains thèmes contiennent un fichier nommé personnalisé.CSS; Si votre thème comprend ce fichier, c'est là que vous devez placer votre code CSS personnalisé. Sinon, modifiez le fichier CSS disponible en fonction de vos besoins.

Une fois édité, n'oubliez pas d'appuyer sur le Mise à jour Bouton de fichier pour appliquer les modifications.

C'est comment modifier vos fichiers de thème à partir du tableau de bord; Bien sûr, vous pouvez également mettre à jour les fichiers via un client FTP comme Filezilla.

Comment modifier WordPress CSS à l'aide d'un plugin:

Cette section montre comment modifier votre WordPress CSS à l'aide d'un plugin. Dans certains cas, un thème peut ne pas prendre en charge CSS par défaut; Dans de tels cas, un plugin peut aider.

Pour commencer, connectez-vous à votre tableau de bord WordPress et sur le menu de gauche, déplacez votre curseur de souris Apparence puis appuyez sur le Ajouter un nouveau option (Plugins> Ajouter nouveau).

Dans l'écran d'installation des plugins, utilisez le champ de recherche et tapez "éditeur CSS". Lorsque les plugins disponibles apparaissent, appuyez sur le Installer maintenant bouton du Siteorigin CSS plugin, comme indiqué dans la capture d'écran ci-dessous.

Une fois installé, appuyez sur le Activer bouton pour activer le plugin.

Après avoir installé le plugin, dans le menu de gauche du tableau de bord, appuyez sur Apparence Et puis appuyez sur CSS personnalisé (apparence> CSS personnalisé).

Vous verrez une boîte vide où vous pouvez ajouter votre code CSS; Après avoir modifié votre code CSS, appuyez sur le Enregistrer CSS bouton pour appliquer les modifications.

C'est ainsi que vous pouvez modifier votre code CSS dans WordPress à l'aide d'un plugin.

Il existe d'autres plugins que vous pouvez utiliser:

• Blocs CSS: éditeur CSS pour Gutenberg Blocks: Ce plugin vous permet de modifier les blocs CSS de l'éditeur Gutenberg Blocks.
• Éditeur de style visuel CSS: Ce plugin vous permet d'ajouter votre CSS personnalisé sans codage. Vous pouvez éditer des éléments visuellement en les cliquant, y compris les couleurs, les tailles, les positions, les polices, etc.
• CSS simple: Cet éditeur CSS comprend un aperçu en direct dans le personnalisateur. Vous pouvez appliquer CSS personnalisé à des publications ou des pages spécifiques via un métabox.
• Éditeur CSS avancé: Ce plugin vous permet d'ajouter différents codes CSS personnalisés pour différents appareils (ordinateur, mobile et tablettes) à l'aide du personnalisateur en direct. Le plugin vous permet également de réduire votre CSS, l'optimisant pour les moteurs de recherche (SEO).
• CSS PRO personnalisé: Cet éditeur CSS comprend également un aperçu en direct en temps réel via une interface utilisateur simple.
• CSS et JS personnalisés simples: Ce tutoriel vous permet d'ajouter à la fois CSS et JS personnalisés. Ce plugin ne modifie pas vos fichiers de thème et vous permet d'exporter votre code et de le garder même après avoir modifié votre thème.

Vous pouvez installer tous les plugins mentionnés ci-dessus en tapant leur nom sur le champ de recherche dans l'écran d'installation des plugins.

Conclusion:

Comme vous pouvez le voir dans les instructions ci-dessus, l'édition ou l'ajout de votre code CSS WordPress personnalisé est assez simple et peut être effectué par n'importe quel utilisateur en suivant quelques étapes comme décrit précédemment.
Les utilisateurs doivent considérer lors de la modification de CSS que le code personnalisé peut affecter les performances du site; Minifier le code CSS est toujours une bonne pratique, et il y a des plugins supplémentaires pour le faire pour vous automatiquement.

Les utilisateurs peuvent toujours supprimer le CSS ajouté personnalisé, mais lorsqu'il est fait via le tableau de bord édition à thème Option, il est recommandé de faire une sauvegarde du fichier à modifier.

N'oubliez pas qu'une mise à jour du thème peut réécrire vos modifications, essayez toujours de trouver le coutume.CSS dossier lorsqu'il est présent.

Cet article comprend une liste de plugins que vous pouvez utiliser; Le marché propose des plugins supplémentaires qui n'étaient pas mentionnés, et vous pouvez explorer jusqu'à ce que ce soit le montant de vos besoins.

Merci beaucoup d'avoir lu cet article expliquant comment modifier WordPress CSS. J'espère que c'était utile. Continuez à suivre LinuxHint pour plus de tutoriels et de conseils WordPress.