Les champs ACF ne sont pas seulement limités aux publications comme les pages et les articles. Il est également possible d’assigner des groupes à des taxonomies, des utilisateurs, des médias ou encore des widgets.
Sommaire du cours
ACF peut s’insérer dans les moindres recoins de WordPress. On va voir dans ce cours qu’on est loin d’être limités aux simples publications. D’ailleurs, on a vu précédemment qu’on pouvait tout à fait assigner un groupe de champs à une page d’options.
Eh bien on va voir qu’on peut ajouter des groupes à de nombreux endroits comme l’écran des de gestion des taxonomies, le profil des utilisateurs, la bibliothèque de médias, les menus et même les widgets.
Assigner un groupe de champs à une taxonomie
Pour commencer, on va voir comment ajouter un groupe de champs ACF à l’interface d’édition des taxonomies.
Pour cela on va créer un nouveau groupe qui nous permettra de définir une couleur et un pictogramme pour chacune de nos catégories du site. C’est quelque chose que je fais fréquemment dans mes blogs d’ailleurs.
Dans les conditions d’assignation du champ, sélectionnez Taxonomie dans la sous-rubrique « Formulaires ». Ne vous trompez pas car il y en a deux. Voici leur différence fondamentale :
- Articles > Taxonomie permet d’afficher un groupe dans un article lorsqu’une catégorie en particulier est sélectionnée ;
- Alors que Formulaires > Taxonomie affiche les champs dans l’interface de gestion de la taxonomie en question.
Si vous avez choisi le bon, vos champs apparaitront lorsque vous ajoutez ou modifiez une catégorie :
Maintenant, il ne nous reste plus qu’à afficher la donnée dans notre template. Comme pour les options ACF, il faut utiliser le second paramètre de la fonction the_field() :
Ce code s’utilisera surtout dans les pages category.php, tag.php ou taxonomy.php.
Vous pouvez également retrouver ces valeurs lorsque vous faites un menu affichant vos taxonomies sur le blog :
Pour plus d’informations, consultez la documentation ACF à ce sujet.
Assigner un groupe de champs aux médias
De la même manière, on va pouvoir afficher des champs ACF dans la bibliothèque de médias de WordPress.
On pourrait imaginer d’ajouter un champ « Copyright » pour indiquer qui est l’auteur du cliché.
En assignant le groupe de champs, je vais même pouvoir indiquer sur quels formats de médias je veux afficher ce champ. Je peux choisir un format en particulier comme le JPG, tous les formats images d’un coup, vidéo, fichiers…
Une fois dans la bibliothèque, je vois bien mon champ apparaitre :
Et pour récupérer cette information, voici le code à utiliser :
Là encore, la documentation ACF vous donnera quelques informations utiles.
Assigner un groupe de champs aux widgets
Si vous utilisez encore les widgets, vous pouvez les améliorer en ajoutant des champs ACF à l’intérieur !
Pour cela créez un groupe de champs et assignez-le au widget de votre choix. Je choisis simplement le widget Texte :
Vos champs devraient apparaitre dans votre widget. Allez dans Apparence > Widgets et ajoutez un widget Texte.
Le but maintenant va être de Hooker le widget en question pour modifier son apparence lors de son affichage :
Référez-vous à la documentation ACF pour plus d’exemples.
Assigner un groupe de champs aux menus
Il y a deux manières d’ajouter des champs ACF aux menus, selon votre besoin :
- Soit assigner des champs au menu de manière générale ;
- Soit assigner des champs à chaque élément du menu.
La première solution permet par exemple de définir une couleur de fond pour votre menu, ou éventuellement sa disposition (horizontal, vertical…) en jouant avec des classes CSS.
La seconde solution va permettre de personnaliser chaque élément du menu, et vous pourrez par exemple permettre de définir des icônes en plus (ou à la place) des intitulés.
Champs pour le menu en général
On va imaginer vouloir permettre de modifier la couleur de notre menu. Pour cela on crée un groupe de champs avec un simple champ couleur, que l’on va assigner à tous les menus.
Petite astuce : choisissez le réglage Sans contour pour ne pas afficher le titre du groupe de champ et ainsi éviter une démarcation avec la zone du dessus (Réglages du menu). Rendez-vous dans Apparence > Menus pour voir le résultat :
Maintenant, on va jouer avec un hook dans functions.php pour modifier le HTML généré et incorporer notre couleur :
Une documentation très complète est disponible pour les menus et ACF.
Champs pour les éléments d’un menu
Cette fois, on va agir au niveau des éléments de notre menu. Ce sera beaucoup plus utile. On ne va pas recréer un groupe de champs mais simplement reprendre le même que pour les taxonomies, qui contient un champ couleur et un champ icône.
Il nous suffit donc d’ajouter une condition grâce au bouton Ajouter une règle, et choisir cette fois Élément de menu est égal à Tous.
Ouvrez un élément de votre menu en cliquant dessus, et les champs devraient apparaître juste au-dessous du Titre de la navigation. Il ne nous reste plus qu’à ajouter le code correspondant, toujours via un hook :
Selon ce que vous souhaitez obtenir, il faudra peut-être effectuer quelques manipulations supplémentaires. Pensez à utiliser var_dump() sur la variable $item pour découvrir tout ce qu’elle a à vous offrir.
Et comme toujours, il y a une documentation ACF dédiée à ce sujet.
Assigner un groupe de champs aux commentaires
On peut également assigner un groupe de champs aux commentaires. Du coup, le formulaire va finir dans la partie publique du site. D’ailleurs on verra dans quelques cours comment afficher un formulaire ACF directement en front.
Imaginons qu’on veuille afficher une case à cocher pour demander à l’internaute d’accepter la politique de confidentialité. Je crée un groupe de champs pour cela, avec un bouton vrai/faux que je rends obligatoire, et j’assigne le champ aux Commentaires.
En affichant un article, vous verrez votre bouton apparaître juste en-dessous de la zone de texte Commentaire.
Afficher le champ dans l’administration WordPress
Maintenant, si on veut afficher cette information dans la liste des commentaires dans l’admin, il va falloir utiliser le hook suivant :
Voici ce que ça donne dans votre interface de gestion des commentaires de WordPress :
Afficher les champs en back et en front
Vous pourriez également imaginer un champ image, afin que vos internautes puissent joindre une capture d’écran à leur commentaire, ce qui est pratique si vous faites du support.
Dans ce cas utilisez plutôt le hook comment_text pour insérer l’image à la suite du contenu du commentaire :
Ce hook va s’exécuter autant côté back, que front. Ajoutez un test avec is_admin() si vous voulez limiter son affichage au backend.
Pour plus d’informations, consultez la documentation.
Assigner un groupe de champs aux utilisateurs
Et pour terminer, on va voir comment gérer nos groupes de champs en fonction des utilisateurs. Et il existe plusieurs conditions relatives tantôt aux rôles, et tantôt directement aux utilisateurs. D’ailleurs leurs effets sont très différents.
Champs dans le profil utilisateur
Vous pouvez assigner un groupe de champ aux utilisateurs, afin d’ajouter des informations à leur profil. Dans cet exemple on va ajouter un champ Twitter et un champ Facebook.
Il faudra ensuite assigner le groupe de champs à Formulaire utilisateur et Ajouter / Modifier.
Le champ apparaitra autant lors de l’ajout d’un utilisateur, que lors de sa modification. au niveau des autres choix on a :
- Inscription, qui permet d’ajouter les champs lorsque l’utilisateur s’inscrit par lui-même, si votre site le permet ;
- Ou Ajouter, qui permet d’afficher les champs seulement à la création du compte, et ne seront donc pas visibles dans le profil par l’utilisateur lui-même.
Au niveau du code PHP, c’est assez simple et ça fonctionne partout :
Pour cibler l’utilisateur, il faut indiquer user_ suivi de son identifiant. Celui-ci est récupérable de plusieurs manières, selon ce que vous voulez faire :
- Si vous voulez afficher le profil de l’utilisateur actuellement connecté, utilisez
get_current_user_id(); - Pour afficher le profil de l’auteur d’un article, utilisez
$post->post_author.
Pour plus d’informations, il existe une documentation ACF sur ce sujet.
Vous pourriez également limiter l’affichage de ces champs à un rôle en particulier, par exemple les auteurs.
Pour cela il faut ajouter une règle dans le groupe de champs :
Après tout ces champs ne sont pas nécessaires pour l’administrateur.
Afficher un groupe en fonction du rôle utilisateur
Si vous voulez maintenant limiter l’accès à certains groupes de champs à des rôles bien précis, c’est tout à fait possible grâce à la condition Rôle utilisateur actuel :
Si vous choisissez Administrator, le groupe n’apparaitra pas aux éditeurs ou autres rôles. Pratique pour limiter la responsabilité des données.
Utilisez le bouton Ajouter une règle pour ajouter un autre rôle. Il faudra par contre réécrire tout le bloc de conditions précédent.
Aparté: La différence entre Rôle utilisateur et Rôle utilisateur actuel
Le rôle utilisateur n’est utile que dans la page de profil utilisateur. Rôle utilisateur actuel a un tout autre but : vérifier que l’utilisateur connecté a bien le droit d’afficher et modifier les valeurs d’un groupe de champs dans les différentes pages de l’administration.
ACF n’est donc pas limité aux seules publications du site, il peut s’inviter partout dans votre interface d’administration ! Cela peut-être utile dans bien des cas lorsque les projets deviennent un peu complexe.
En tout cas ACF ne reculera devant aucun obstacle, et vous non plus ! Il reste un cas de figure que l’on n’a pas encore vu, et il est tellement intéressant qu’il mérite son propre cours : assigner un groupe de champs à un bloc Gutenberg.
Gilles
Le 11 juillet 2022
Bonjour
Une fois que j’ai créé mon groupe de champ, j’aimerais créer un template spécifique qui n’afficherait que les champs de ce groupe.
Existe t-il un cours spécifique à ce besoin.
Comment lier mes champs ACF à ce nouveau template et l’afficher via un menu qui comporterait tous les posts de nouveau groupe de champs ACF.
Merci pour votre aide.
Maxime BJ
Le 11 juillet 2022
C’est dans le sens inverse qu’il faut raisonner : si tu assignes un groupe de champ à un type de publication par exemple, il faudra aller modifier le modèle rattaché à ce dernier. Pour cela je te conseille de voir ou revoir le cours sur le Template Hierarchy. C’est lui qui t’indiquera comment trouver le bon template, ou le créer s’il n’existe pas. Par exemple si tu as assigné un groupe de champ dans le CPT Projets, alors il faudra modifier le template single-projets.php.
Christophe
Le 4 janvier 2024
J’ai suivi le tuto mais je bloque sur où mettre le code Acf pour qu’il s’affiche sur mon thème.
J’utilise le Thème Kadence et quand je met le code dans archive.php, je n’ai pas ma zone de texte que je voudrais ajouter dans la taxonomie des produits.
Maxime BJ
Le 4 janvier 2024
Les cours de mon site partent du principe que vous allez coder votre thème sur mesure. Le thème Kadence utilise Kadences blocks en supplément de l’éditeur de blocs (Gutenberg). Le contenu est donc géré par des blocs, et pas dans le fichier archive. Une des solution serait de créer un bloc sur mesure avec ACF pour faire apparaitre les informations là où tu le souhaites.