Formation « Développer un thème WordPress sur mesure »

Des Add-ons utiles pour ACF

Lecture : 3 minutes • 0

ACF est tellement réputé qu’il existe des centaines d’add-ons pour améliorer encore l’expérience du développeur : nouveaux champs, nouvelles fonctionnalités… Vous trouverez forcément votre bonheur !

Les add-ons pour ACF

Des add-ons pour ACF, il en existe des centaines. Et un site a eu l’idée de réunir les meilleurs d’entre eux, c’est AwesomeACF.

Capture d'écran du site AwesomeACF
La page d’accueil du site AwesomeACF

Vous allez trouver pas mal de nouveaux champs comme un sélecteur de police d’écriture Google Font, un sélecteur de pictogrammes Font Awesome, un éditeur de code source, un sélecteur de pays, un éditeur de tableaux et mêmes des outils visuels pour améliorer l’édition de vos groupes de champs.

La plupart des add-ons sont gratuits mais quelques-uns sont payants. Bref, avant de vouloir coder votre propre champ sur mesure, regardez d’abord s’il n’existe pas sur ce site !

Découvrir des add-ons pour ACF


Et vous, avez-vous un add-on que vous jugez indispensable pour ACF ? N’hésitez pas à m’en faire part sur le Slack Capitaine WP ou dans les commentaires sous ce cours !

Faire fonctionner Yoast avec ACF

L’analyse de contenu de Yoast permet aux référenceurs d’avoir des indications chiffrées sur les bonnes pratiques du référencement :

  • Est-ce que l’article a un nombre de mots minimum ?
  • Est-ce que le mot-clé de la requête est présent dans le titre ?
  • Et dans le contenu, en quantité raisonnable ?

Dans chacune de vos publications, les bons critères passent au vert, tandis que les mauvais restent en rouge.

Par contre, Yoast ne reconnaît pas nativement vos champs ACF. Et si le contenu de la page se trouve en majorité hors de l’éditeur, alors Yoast va rater son analyse.

Capture d'écran de la metabox de Yoast.
L’analyse SEO de Yoast avec des indicateurs au rouge

Essayez : lorsque vous avez fini de configurer vos groupes de champs, allez saisir du contenu dans votre page. Vous allez très vite voir Yoast tirer la gueule. Les indicateurs resteront pour la plupart rouges, surtout si vous utilisez peu ou pas du tout l’éditeur natif.

Eh bien ne vous inquiétez pas, car la solution est vraiment très simple. Il vous suffit d’installer cette extension et le tour est joué :

ACF Content Analysis for Yoast SEO

ACF Content Analysis for Yoast SEO

Extension WordPress qui ajoute le contenu de tous les champs ACF à l’analyse du score…

Thomas Kräftner, ViktorFroberg, marol87, pekz0r, angrycreative, Team Yoast

Vous n’avez même pas besoin de configurer quoi que ce soit ! Une fois activée, l’extension indiquera à Yoast les champs ACF et il saura en lire leur contenu. Et ce, même si ce sont des répéteurs, ou encore des dispositions dans un champ flexible.

Ajouter des pictogrammes avec Font Awesome

Font Awesome est une librairie open source proposant plus de 1500 icônes gratuites. Du coup c’est l’outil idéal pour proposer des pictogrammes sur votre site. Et justement, il y a un champ ACF pour permettre de choisir facilement une icône :

Advanced Custom Fields: Font Awesome Field

Advanced Custom Fields: Font Awesome Field

Adds a new 'Font Awesome Icon' field to the popular Advanced Custom Fields plugin.

mattkeys

Une fois l’extension activée, il vous suffira de choisir le champ « Font Awesome Icon ». Pensez juste à activer le chargement automatique de la librairie Font Awesome (en front) dans les options. Voici à quoi ressemblera le champ :

Capture d'écran du champ Font Awesome
Le champ Font Awesome

Et pour afficher le pictogramme dans vos templates, un simple et classique the_field() fera l’affaire :

PHP
page.php

Le HTML nécessaire au fonctionnement de Font Awesome sera généré et la police de pictogrammes chargée automatiquement.

Ajouter un tableau administrable

Il existe un champ tableau plutôt bien fait, qui vous évitera de vous arracher les cheveux avec des répéteurs.

Advanced Custom Fields: Table Field

Advanced Custom Fields: Table Field

Un module de tableau de champs pour l’extension Advanced Custom Fields.

Johann Heyne

L’interface est plutôt agréable et vous permettra de faire des tableaux comprenant le nombre de colonnes et de lignes que vous souhaitez.

Capture d'écran du champ tableau d'ACF
Le champ tableau ACF

Pour l’afficher sur votre page, il va falloir plusieurs boucles pour itérer sur les éléments, mais ce code fonctionnera à tous les coups :

PHP
page.php

Il vous suffira d’ajouter un peu de CSS pour donner un style à votre tableau !


Je pense que vous êtes prêts ! J’ai partagé avec vous tout ce que je savais à propos d’ACF. Vous devriez maintenant être capables de gérer tous types de projets WordPress !

Mais avant de conclure avec ACF, je vous propose dans le prochain cours une étude de cas concrète.

0

Questions, réponses et commentaires

Laisser un commentaire