Écrire PHP, CSS et HTML5 pour modifier un site WordPress peut devenir assez frustrant, mais un bon guide peut faciliter les choses. Ce n'est pas ce guide. Il s'agit à peu près de la façon d'ajouter le code à votre site une fois que c'est déjà fait. Mais ne vous inquiétez pas, c'est tout aussi important. Comme il existe plusieurs façons de procéder, il est utile de connaître les différences entre les différentes options. Mais d'abord, deux avertissements :

  1. Avant de modifier quoi que ce soit, sauvegardez-le. En fait, continuez à sauvegarder votre travail tout au long du processus. Il est également utile d'avoir un fichier séparé dans lequel coller les extraits de code rejetés ou bientôt utilisés.
  2. Si vous avez installé le thème de quelqu'un d'autre, n'ajoutez jamais de code à votre thème fonctions.php ou style.css des dossiers. Si vous le faites, lorsque le thème sera mis à jour, tout votre travail acharné sera anéanti.

Au cours du reste de cet article, j'explorerai quelques alternatives, classées de la plus simple à la plus complexe.

Plugins WordPress

Plugins WordPress pour ajouter du code

Tout comme il existe plusieurs types de modification de code, il existe plusieurs types de plugins de code personnalisés. Les 2 types les plus courants sont PHP et CSS. Comme vous le savez peut-être, PHP régit l'architecture et le fonctionnement de WordPress. Ainsi, si vous essayez de modifier les fonctions principales de votre site Web, d'ajouter ou de modifier une fonctionnalité, il existe de nombreux plugins PHP disponibles en téléchargement pour vous y aider.

De même, vous savez probablement aussi ce que fait CSS – il embellit les choses. Et si c'est tout ce que vous voulez modifier, un Plugin CSS personnalisé vous permettra de le faire avec un minimum de tracas. En arrière-plan se cache JavaScript, qui a une relation complexe avec les plugins. Pour clarifier, c'est un peu différent en ce sens que cela fonctionne parfaitement bien si vous l'ajoutez à l'en-tête, au pied de page ou à un thème enfant – mais pour l'utiliser dans un article, vous devez utiliser un plugin spécial. Quelque chose comme Boîte à outils CSS et Javascript devrait faire l'affaire. En remarque, pour la rapidité de votre page, il est préférable de le mettre dans le pied de page.

Écrire vos propres plugins

Il existe une tonne d'extraits de code WordPress disponibles sur Internet pour changer, désactiver ou modifier certaines fonctionnalités. Cependant, savoir où les mettre est crucial pour la fonctionnalité. Par exemple, si vous avez un extrait qui modifie la fonction d'un plugin, vous voudrez qu'il fonctionne quel que soit le thème que vous avez activé. Il en va de même pour les extraits qui traitent des modifications à l'échelle du site. Donc, dans les deux cas, il peut être judicieux de créer un nouveau plugin pour eux. Ne vous inquiétez pas, c'est pas aussi intimidant comme il semble.

L'un des principaux avantages de la création d'un plugin est qu'il vous permettra d'activer ou de désactiver le plugin à la demande. Il permet également d'afficher des informations contextuelles sur le plugin dans les pages du plugin. Le seul inconvénient majeur est qu'il peut être accidentellement désactivé par toute autre personne autorisée à modifier le site, mais un avertissement sévère devrait pouvoir l'empêcher.

En remarque, vous pouvez également créer un dossier appelé plugins mu dans votre wp-contenu dossier. Tous les fichiers PHP qui y sont insérés seront toujours exécutés, et ils ne peuvent pas être activés ou désactivés. Cela éloigne le code personnalisé des dossiers de thème et de plug-in. Mais ne le faites qu'avec des plugins que vous êtes toujours à l'aise d'exécuter en arrière-plan.

Fichiers CSS personnalisés

Si les changements que vous prévoyez sont mineurs, vous pouvez créer un style-personnalisé.css fichier. Si vous souhaitez prévisualiser vos modifications avant de les effectuer, vous pouvez toujours utiliser DevTools si vous utilisez Chrome ou une application similaire. Une autre possibilité est d'ajouter du CSS personnalisé via votre thème WordPress. Certains thèmes premium, comme notre Cadre total, incluez une option de panneau de thème pour ajouter un CSS personnalisé où vous pouvez facilement le trouver et le modifier. De plus, lorsque vous mettez à jour votre thème, les paramètres de votre panneau de thème doivent rester inchangés, de sorte que votre CSS personnalisé reste intact.

N'oubliez pas que CSS cascade en sens inverse, ce qui signifie que les règles qui apparaissent plus tard ont toujours la priorité sur les règles qui apparaissent plus tôt. Ainsi, tout CSS appliqué à une feuille distincte remplacera le code par défaut de la page. Cela s'applique également au CSS inséré dans…

Thèmes enfants WordPress

Créer un thème enfant WordPress

Pour les non-initiés, un thème enfant hérite des fonctionnalités d'un autre thème, vous permettant de modifier votre design à volonté (vous pouvez apprendre tout ce que vous voulez savoir dans notre guide des thèmes enfants WordPress). Ils ont été inventés dans le but précis de vous permettre de modifier un thème sans perdre vos modifications lors de la mise à jour. Les thèmes enfants reflètent toutes les modifications que vous apportez au thème externe ou “parent”. Ainsi, comme pour appliquer un effet de calque Photoshop, vous ne modifiez pas réellement le contenu ; vous pouvez l'enlever à tout moment pour remettre les choses comme elles étaient.

Créer un thème enfant lorsque vous souhaitez modifier votre code vous évitera bien des maux de tête, et c'est assez facile (au fur et à mesure des modifications de WordPress). Accédez simplement à votre site via FTP et créez un dossier, puis créez un style.css fichier correspondant à ce dossier. C'est une pratique courante de le nommer nom-du-thème-enfant. Après cela, tout ce dont vous avez besoin est une ligne dans votre nouveau style.css's header pour définir le modèle. Mais il y a aussi des trucs que ça aide d'avoir – qui peuvent être trouvés sur le Page du codex WordPress.

Ensuite, apportez les modifications nécessaires au thème actuel sous le @importer ligne. Le seul inconvénient des thèmes enfants est la quantité de recherches que vous devez effectuer sur le thème parent avant de pouvoir le modifier, sans provoquer de conflits ni d'effets secondaires étranges. Et rappelez-vous qu'avec les thèmes enfants, vous n'avez qu'à spécifier ce qui sera différent du thème d'origine. Pour appliquer les modifications, il suffit de le compresser, de le télécharger via le Apparences > Thèmes page dans votre tableau de bord WordPress et activez-la via WordPress. Cela suppose que votre thème parent est également téléchargé, bien sûr.

Afficher le code

Affichage du code ajouté

Il y a un autre type d'ajout de code que nous n'avons pas couvert : l'afficher. Si vous êtes un concepteur Web et que vous souhaitez montrer comment quelque chose est fait, le présenter de manière à ce que les téléspectateurs puissent le copier et le coller, il est important de le noter correctement. La façon dont votre code sera interprété par WordPress dépend de si vous utilisez la section HTML de Visual Post Editor. Le saisir directement dans l'éditeur visuel fonctionnera pour le neutraliser, mais il n'y a aucun moyen de le mettre dans le bon format ou dans une boîte de code. L'éditeur visuel le formatera simplement de la même manière qu'un texte ordinaire. D'un autre côté, l'éditeur HTML le transformera en code et ruinera votre site Web. Ne vous inquiétez pas, vous pouvez annuler cela.

Cependant, il y a un compromis. Vous pouvez surligner et mettre votre code dans un bloc en utilisant le et balises, mais cela n'empêchera pas le code de s'activer. Tout ce qu'il fera, c'est de le mettre en police montoype, dans une boîte, pour montrer que c'est officiellement du code. Pour l'empêcher de s'activer, vous devez changer les symboles actifs en ce qu'on appelle entités de personnage amusantes. Les versions les plus courantes de ceux-ci, et celles qui sont suffisantes pour neutraliser la plupart du code, changent < et > en < et >respectivement (vous pouvez en savoir plus sur l'affichage du code dans notre article sur l'écriture de code personnalisé dans vos articles WordPress).


Comme vous pouvez le voir, il existe de nombreuses façons d'ajouter du code personnalisé à WordPress, et je vous encourage à expérimenter, à jouer avec et à voir celles qui vous conviennent. Y a-t-il d'autres façons d'ajouter du code personnalisé que j'ai manqué ? Faites-moi savoir dans les commentaires.

Laisser un commentaire