Tout savoir sur WordPress

Advanced Custom Fields pour les débutants

ACF est devenu une extension incontournable ces dernières années pour le développement de sites WordPress. Utilisé par les particuliers comme par les professionnels, elle vous offre la possibilité d’ajouter des champs personnalisés dans vos articles et pages. Voyons aujourd’hui comment créer votre premier groupe de champs !

Cet article est le premier d’une série de tutoriels destinés à apprendre à utiliser ACF, et tirer parti de tous ses champs personnalisés. Vous découvrirez au fur et à mesure des champs vraiment utiles, et des petites astuces très pratiques. Et si vous avez des questions, n’hésitez pas à commenter ! Bonne lecture !

Prérequis : Afin d’utiliser ACF, il faudra ajouter quelques lignes pas compliquées dans vos templates PHP. Au minimum il faut être assez à l’aise avec le Template Hierarchy des thèmes WordPress. Il n’est pas nécessaire d’avoir de grandes bases PHP, car souvent on copie colle les exemples donnés dans la documentation ACF.

ACf, Pour quoi faire ?

Imaginons que nous voulions faire un blog de jeux vidéo, sur lesquels on teste des jeux et donne des notes. Exactement sur le principe de GameKult :

Un blog de jeux vidéo avec des champs additionnels personnalisés

Pour cela on rédigerait des articles, mais on aurait besoin, en plus de l’éditeur visuel de WordPress par défaut, de champs supplémentaires : Un champ pour mettre une note, afficher les plus et les moins, le prix de vente, l’image de la pochette et la date de sortie.

A l’origine, les champs personnalisés

WordPress propose déjà un système de champs personnalisés (custom fields). Mais leur interface n’est pas très sexy :

custom-fields

Le principe est le suivant : Vous créez un champ en lui donnant un nom, à gauche, et une valeur, à droite. Vous pouvez ensuite facilement afficher cette valeur dans votre page via la fonction get_post_meta().

Les problèmes :

Les champs ne sont pas prédéfinis, il faut les ajouter manuellement sans faire de faute sur le nom, et l’interface reste très limitée.

ACF à la rescousse !

ACF permet d’ajouter des champs personnalisés ergonomiques à vos contenus

C’est la qu’intervient ACF : il va vous permettre de créer des champs personnalisés de plusieurs types différents : éditeur de texte, champ texte simple, champ image, champ URL… de les définir à l’avance, et vous n’aurez plus qu’à les remplir lors de l’écriture de votre article.

Petit point technique : sachez qu’ACF stocke ses informations dans les champs personnalisés, il utilise donc les bases de WordPress sans les réinventer, et apporte une couche d’amélioration de l’interface. Du coup, il n’est pas lourd, et même si vous le désinstallez, les valeurs seront toujours présentes et exploitables par votre site.

Voici un exemple de page d’administration contenant des champs ACF, que nous utilisons sur notre plateforme WPChef.

champs-chef

Comme vous pouvez le constater nous utilisons une grande variété de types de champs (texte, textarea, URL, couleur, select, cases à cocher utilisateur, relationnel…) Et cela nous simplifie grandement la vie ! Bon par contre, pour arriver à obtenir une mise en forme par colonnes, il faudra impérativement passer par la version Pro (tuto à venir à ce sujet)

les champs dont nous aurons besoin

Revenons en à notre blog de jeux vidéo. On va faire l’inventaire des champs que nous allons devoir créer via ACF, et de ceux qui sont par défaut fournis par WordPress. Ce dernier nous offre nativement :

  • Un champ titre
  • Un éditeur visuel pour le contenu de l’article
  • Des taxonomies : Catégories et étiquettes
  • Une image à la Une

Et voici ce que nous aimerions ajouter à nos articles :

  • Un champ note (numérique, sur 20)
  • Un champ « Les plus »
  • Un champ « Les moins »
  • Un champ date de sortie
  • Un champ prix
  • Un champ image pour la pochette du jeu

Et en soi il nous faudrait aussi des champs pour le genre (Action, course), la plateforme (Playstation, XBox), et l’éditeur. Mais je vous les garde pour un prochain article, car ce genre d’informations devraient être des taxinomies et non des champs ACF.

Voici donc le zoning de la page. En bleu, les champs WordPress fournis de base, et en rouge, les champs additionnels que nous allons créer avec ACF :

article-blog

Sur GameKult il n’y a pas la date de sortie et le prix dans le test du jeu, on les ajoutera dans le bloc où se trouve la pochette. On va maintenant installer ACF et se lancer dans la configuration de nos champs.

Installer ACF et configurer votre premier groupe de champs

Advanced Custom fields possède une version gratuite, qui offre déjà un beau panel de champs personnalisés. Depuis votre installation WordPress, rendez-vous dans Extensions > Ajouter puis cherchez « Advanced Custom Fields ».

acf-plugin

C’est celui avec le plus d’installations actives, et crée par Elliot Condon, qui est le bon ! Une fois activé, un menu ACF devrait être apparu en bas à gauche du menu principal, cliquez sur ACF, puis sur Ajouter.

Vous tombez sur un écran qui ressemble à ça, contenant 3 blocs principaux :

Créer un groupe de champs

Indiquez tout d’abord le titre de votre groupe de champs : « Test de jeux vidéo ».

  • Le premier bloc est la zone dans laquelle nous allons définir nos champs ;
  • Le deuxième bloc nous permettra d’indiquer à ACF dans à quel endroit afficher nos champs (pour nous : dans les articles) ;
  • Enfin, le troisième bloc va nous offrir quelques options de mise en forme.

Mais concentrons-nous pour le moment sur le premier bloc.

Définir les champs

Cliquez sur le bouton Ajouter, un formulaire apparait. Nous allons tout d’abord définir le type en cliquant sur le champ select « type de champ » :

ACF Types de champs

Vous avez devant vous la liste de tous les champs proposés par ACF. En voici quelques uns parmi les plus populaires :

  • Champ texte
  • Champ URL
  • Champ numérique
  • Champ Image
  • Champ Mail
  • Liste de choix
  • Case à cocher
  • Vrai/Faux
  • Champ Relationnel (celui-ci est particulièrement intéressant, j’en parle plus en détails ici)
  • Ainsi que quelques champs plus avancés que j’aborderais dans de prochains articles

Une version Pro est également disponible, elle vous permet d’accéder à 4 types de champs supplémentaires :

  • Les répéteurs
  • Les contenu flexible
  • Les galeries d’images
  • Les pages options

Un prochain article traitera de ces champs de la version Pro. En attendant, vous pouvez en apprendre plus à ce sujet sur le site officiel ACF Pro.

Pour notre site de jeux vidéos, on va commencer par un champ type Nombre. Indiquez ensuite un titre de champ, par exemple Note du jeu. En quittant le champ vous verrez que la ligne suivante, Nom du champ, sera remplie automatiquement :

nom du champ

Le nom du champ est le nom informatique, sans accent ni caractère spécial, qui vous sera très utile lorsque vous voudrez afficher la valeur dans le template de votre page. Vous pouvez le modifier tant que vous ne mettez pas de caractère interdit.

Selon le type de champ choisi, des options différentes feront leur apparition. Pour les champs Nombre, vous pourrez choisir la valeur minimale et maximale, ainsi que des préfixes / suffixe (qui ne seront affichés que dans l’admin).

options champ

Voilà pour ce premier champ. Cliquez sur fermer le champ en bas, puis sur Ajouter à nouveau. Nous allons maintenant ajouter les plus et les moins.

Je choisis le type Éditeur WYSIWYG, et je l’appelle Les plus (son nom sera alors les_plus). C’est le même éditeur visuel que WordPress possède par défaut.

champ wysiwyg

Dans les options on peut choisir si l’on veut un éditeur complet, avec toutes les options, ou une version minimale. Je choisis basic et je retire les boutons de média (Après tout, on est pas sensé pouvoir mettre des images ici).

options

Vous pouvez aussi écrire des instructions, qui seront affichées dans l’administration, avant le champ. Ceci peut être très pratique lorsque vous concevez un site pour votre client, afin d’expliquer ce que vous attendez de lui dans ce champ. 

instructions

Une fois tous les paramètres entrés, cliquez sur Fermer le champ en bas, puis survolez la ligne de votre champ « Les plus » : vous verrez apparaitre un lien « Dupliquer ». Cliquez dessus pour créer le champ « Les moins ». Il faudra simplement changer le titre du champ, ainsi que son nom informatique : optez pour « les_moins ».

champs ACF dupliqués

On va maintenant créer le champ image pour la pochette : cliquez sur Ajouter un champ, puis choisissez le type Image. Pour l’instant on va modifier une seule option : pour Valeur affichée dans le template choisissez URL de l’image (pour le moment).

url-image

Restent ensuite le prix, qui est un simple champ texte avec comme suffixe « € » ainsi que la date de sortie, qui est un champ Date standard. Et voilà ! Notre groupe de champs est prêt !

groupe de champs ACF

Et pour les tire-au-flanc voici L’export XML du groupe de champs. Il vous suffit d’utiliser Outils > Importer > WordPress pour importer le groupe de champs (encore une fois, ACF utilise des fonctions natives de WordPress). Vous pouvez vous aussi exporter vos champs depuis le menu ACF > Exporter.

Passons maintenant au bloc suivant.

Assigner un groupe de champs à une ressource WordPress

Afin que ces champs apparaissent dans notre administration WordPress, il faut indiquer au groupe quelques conditions. Par défaut cela tombe bien puisque l’on peut lire : Montrer ce groupe quand le Type de publication est égal à post (articles donc).

condition

Le dernier paramètre nous permet de choisir parmi les types de publications disponibles : les articles, les pages, et dans l’exemple ci-dessous le portfolio (car j’ai ajouté un Type de publication Portfolio. Plus d’infos sur les Custom Post Type de WordPress sur le codex)

Le premier paramètre quant-à lui nous permet de choisir parmi de nombreuses ressources WordPress :

types

On pourrait donc par exemple faire apparaitre ces champs seulement dans un article ou une page particulière, dans une catégorie donnée, dans une page qui aurait un modèle de page spécifique… On pourrait même ajouter des champs ACF dans les pages de profil des utilisateurs ! Le choix est large et vous permettra de tout faire.

Des boutons « et » et « oui ajouter une règle » vont vous permettre d’aller encore plus en précision. Par exemple, si notre blog ne propose pas que des tests de jeux vidéos, mais aussi des articles sur d’autres thématiques, on voudra alors que nos champs n’apparaissent que pour la catégorie Jeux vidéo. Dans ce cas on clique sur « et » et on choisi les options suivantes :

regles

Nota : Il faut préalablement avoir défini une catégorie « Jeux vidéo » dans vos articles. Dans ce cas les champs n’apparaitront pas dans vos articles tant que vous n’avez pas assigné la catégorie « Jeux vidéo ».

Pour l’instant on ne s’occupe pas du troisième bloc (je vous prévois un tuto spécial à ce sujet), et on passe directement à la suite.

Rédiger son article avec les champs ACF

Rendez-vous maintenant dans Articles > Ajouter. Vous devriez voir apparaitre vos champs sous l’éditeur WordPress (si vous avez mis la condition de catégorie, sélectionnez la catégorie correspondant, ici « Jeux video »).

Si vous avez Yoast d’installé, les champs apparaitront après. Vous pouvez cependant les glisser au dessus et leur position sera enregistrée pour les futurs articles.

champs-article

Les champs apparaissent les uns sous les autres, sur fond gris. On verra plus tard comment améliorer un peu tout cela. Il ne nous reste plus qu’à remplir tous ces champs !

contenu

Le champ image fait appel à la bibliothèque native de WordPress, vous pourrez donc facilement importer un média ou le retrouvé parmi ceux précédemment importés.

media

Pour la date un calendrier apparait pour vous simplifier la saisie :

calendrier

Une fois le tout saisi, cliquez sur Publier !  Et rendez-vous sur votre article. Et là … (mauvaise) Surprise !

frontend

Ben ils sont ou mes champs ? A part le contenu standard fourni par WordPress, je ne vois aucun de mes champs ACF !?

Et oui c’est normal. C’est vous qui allez décider où vous souhaitez les placer, et pour cela, pas le choix, il va falloir ouvrir votre éditeur de code préféré et aller tripatouiller dans vos templates !

Afficher les valeurs des champs dans vos templates

Pour rappel, WordPress définit automatiquement quel template il va charger en fonction du contenu à afficher. Ici nous affichons un article, c’est donc la page single.php qui va être chargée. Si vous avez besoin de vous rafraichir la mémoire, voici le Template Hierarchy :

template-hierarchy

Ainsi que la documentation du codex qui va avec. Ou pour encore plus de fun, essayez WPHierarchy,  qui le propose de manière interactive (Merci Maxime Culea). Rassurez-vous, en général, on ne prend en compte que les blocs gris foncés à gauche, et bleu foncé à droite. Le reste traite de cas potentiellement très spécifique que l’on a pas besoin dans la vie de tous les jours.

Il va également falloir utiliser la documentation d’ACF, qui, je vous rassure, est la documentation la mieux faite qu’il m’est été donné de voir. Propre, intuitive, et les exemples donnés sont pour 99% du temps ceux que vous aurez besoin d’utiliser !

Alors, par ici :  documentation ACF officielle.

Commençons par le plus simple : pour afficher un champ de type texte, ou éditeur visuel, il suffit d’utiliser la fonction suivante :

<php the_field('nom_du_champ'); ?>

Vous vous rappelez les noms informatiques de champs ? Ceux qui sont sans accent ni caractère spécial ? C’est maintenant qu’ils vont nous être utiles ! indiquez entre parenthèses le nom du champ à afficher, et le tour est joué ! Et placez donc ce code là où vous le souhaitez dans votre page. Par exemple :

<?php the_field('note_du_jeu'); ?> / 20
Prix : <?php the_field('prix'); ?>€
Date de sortie : <?php the_field('date_de_sortie'); ?>


<br />
<div class="appreciations">
  

<br />
<div class="plus">

<br />
<h3>Les Plus</h3>
<p>

    <?php the_field('les_plus'); ?>
</div>
<p>



<br />
<div class="moins">

<br />
<h3>Les Moins</h3>
<p>

    <?php the_field('les_moins'); ?>
</div>
<p>


</div>
<p>


<img src="<?php the_field('pochette'); ?>" alt="Pochette du jeu">

Et voilà le travail : ajoutez le HTML et le CSS à votre convenance. Pensez à ajouter « sur 20 » à la suite de la note ainsi que « € » à la suite du prix. Notez que comme on a demandé à l’image de renvoyer son URL, j’affiche le contenu du champ dans l’attribut src de la balise <img>.

Voyons maintenant le résultat :

Les champs ACF dans le template

Pas mal non ? On voit nos champs bien affichés ! Par contre on fait face à un problème : l’image est bien trop grosse. Tout à l’heure on choisi « URL de l’image » comme format de sortie. Du coup c’est l’image originalement importée qui est affichée. Si elle faisait 3000px de large, elle sera affichée en l’état, et elle pèsera très lourd dans le chargement de la page.

Comme vous le savez peut-être, WordPress génère plusieurs images de tailles intermédiaires, que vous pouvez gérer dans Réglages > Médias. Vous pouvez également créer de nouvelles tailles d’images grâce à la fonction suivante qu’il faudra placer dans le functions.php de votre thème.

add_image_size ( 'pochette', 200, 80, false );

Le premier paramètre est le nom du format d’image. Viennent ensuite la largeur et la hauteur visées, et le dernier paramètre permet de contraindre le ratio ou non.

Nous allons donc maintenant aller changer le format de sortie de l’image. Allez dans le menu ACF, puis cliquez sur votre groupe de champs. Cliquez ensuite sur le champ Pochette afin de modifier ses options, Choisissez alors  ID de l’image dans Valeur à afficher dans le template.

id-image

 

Enregistrez votre groupe de champs. D’après la documentation ACF sur le champ Image, le code PHP sera à peine plus complexe. Une fois en possession de l’identifiant de votre image, vous pouvez utiliser les fonctions natives de WordPress à votre disposition pour l’afficher, comme wp_get_attachment_image

$image = get_field('pochette');
$size = 'pochette'; // (thumbnail, medium, large)
if( $image ) {
	echo wp_get_attachment_image( $image, $size );
}

Comment m’y retrouver dans un thème que je n’ai pas conçu ?

Vous êtes nombreux à me demander en commentaires comment trouver le bon endroit dans un thème que l’on a pas conçu. En effet ce n’est pas forcément facile au début, voici donc quelques conseils :

Repérer les fonctions clés

Pour commencer repérer les fonctions de base de WordPress : comme the_content() qui appelle le contenu à afficher. Si vous voulez afficher un champ avant, le code sera à placer quelque par avant cette instruction. Alors parfois ce n’est pas évident car le fichier single appelle d’autres bouts de templates. Dans le thème twenty
sixteen par exemple il n’y a pas the_content, mais à la place un get_template_part() qui va chercher un sous fichier content-single dans le dossier template-parts :

code theme

D’ailleurs on remarque ligne 25 que le template d’affichage des commentaires est appelé. Donc si par exemple vous souhaitez afficher un champ entre votre contenu et les commentaires, ce sera en ligne 23 qu’il faudra ajouter votre code !

utiliser les classes CSS comme repères

Deuxième conseil : servez-vous du HTML pour savoir ou est placé quoi. Depuis votre navigateur ouvrez votre inspecteur de code (clic droit > inspecter l’élément) et regardez comment est conçue la page. Vous devriez voir des noms de classe CSS. Recherchez-les dans votre thème (j’utilise la recherche globale sur Sublime Text avec CMD+MAJ+F pour rechercher dans tous les fichiers)

inspecter html

Bien entendu ne mettez-pas la charrue avant les boeufs : il vous faudra de bonnes bases en HTML/CSS et quelques bases PHP pour être à l’aise avec les thèmes. Et certains thèmes, avouons-le, sont codés avec les pieds, donc ce ne sera pas tous les jours facile !

Conclusion

Et voilà ! Libre à vous maintenant de créer autant de champs et les afficher ou bon vous semble dans vos templates. Essayez, expérimentez, et je reviens prochainement avec la suite de ce tutoriel, car oui, ce n’est pas fini ! J’ai encore de nombreuses choses à vous montrer avec Advanced Custom Fields.

Si vous avez des questions, des remarques, laissez-nous un commentaire !

Découvrez la suite des tutoriels ACF :

Inscrivez-vous à la newsletter pour recevoir les prochains tutos !

Pour ne pas manquer les prochains tutos ACF, je vous invite à vous inscrire à notre Newsletter ! Promis, pas de spam, que du bon ;)

Cet article a été mis à jour il y a 504 jours - Il n'est peut être plus à jour !

Article écrit par Maxime BJ

Développeur, bloggeur et formateur Web spécialisé WordPress. 31 ans. Grenoblois. Co-fondateur de WPChef, l’organisme de formation WordPress.

Organisateur de WPInAlps, le meetup WordPress Grenoblois. Vous pouvez me rencontrer lors d’événements tels que WordCamp Paris et Europe. Traducteur Français de l’extension Advanced Custom Fields. Également développeur d’applications web avec MeteorJs. Je m’occupe un site pour apprendre l’informatique aux débutants gratuitement.

J’aime les jeux vidéo, la rando, la bouffe bien grasse et les voyages.

35 Commentaires

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

  1. Salut !

    Très bon article. Merci.

    Dans l’exemple de wpchef, ce serait bien de préciser que les colonnes sont disponibles avec la version Pro seulement.
    Pour le champ image, je trouve l’utilisation de l’ID le plus simple en association avec wp_get_attchment_image.
    Et pour l’affichage des champs dans les template, penses-tu que l’échappement soit nécessaire?

    Vivement le tutoriel sur la version Pro.

  2. Tout d’abord joli article sur ACF, félicitations Maxime.

    Pour répondre à Grégoire,
    Je dirais que c’est effectivement un bon tip que de retourner l’id d’une image car c’est moins gourmand. Plutôt que de retourner toutes les metas dans un tableau, tu utilise l’id pour récupérer l’info qui t’intéresse et/ou obtenir un objet.
    Concernant le front, il faut impérativement escape, surtout qu’ACF ne sanitize pas proprement tous les champs. Il y a de multitudes de failles XSS qui ne seront pas corrigées par Eliott.
    Pour finir ceux qui souhaite se perfectionner et/ou chercher de l’aide, un nouveau site voit le jour : https://acfextras.com

  3. Salut Maxime,
    Super article en effet, clair et bien illustré par l’exemple.
    Pour répondre à Grégoire, je n’ai pas ACF Pro, mais avec « Advanced Custom Fields: Row Field » [ https://fr.wordpress.org/plugins/advanced-custom-fields-row-field/ ] j’arrive à peu prêt à m’en sortir pour faire des colonnes.
    Et petite question pour la fin, j’utilise ACF en MU plugin lorsque j’en ai besoin pour un projet. Bonne pratique ou pas ? (je pense aux mises à jours notamment).
    Merci !

    • Merci !
      Mhh c’est un peu délicat pour le MU. Faudrait mieux le laisser en extension. A la limite tu peux faire un code à la main en MU pour tester si ACF est là et activé, et dans le cas contraire forcer l’activation. Mais bon après voilà ton client c’est pareil il pourrait très bien changer son thème et hop c’est le bazare. Moi je préférais faire de l’éducation (et de la menace lol)

    • Merci pour vos réponses et le GIST :)
      C’est un peu extrême le die(), mais après tout !
      Avant j’utilisais simplement un if ( function_exists( ‘get_field ‘) ) mais visiblement c’était pas suffisant…
      Comme tu dis, la menace ça marche pas mal des fois !

  4. Bonjour,

    Super pour ce tutoriel qui est très clair. J’ai néanmoins une question : comment fait-on pour assigner les articles d’une catégorie à une page précise de notre site ?
    Un gand merci d’avance.

    • Salut, est-ce que tu peux préciser un peu ce que tu veux faire, afin que je te fournisse la meilleure réponse possible ?

    • Bonjour Maxime,

      Merci pour ta rapidité ;-)

      Voici mon projet de site : je crée un site pour une compagnie de spectacles. Dans le menu, il y a une page « spectacles » qui va lister l’ensemble des spectacles joués par la compagnie. Pour cela, j’ai créé des champs personnalisés avec le plugin ACF que j’ai attribués aux articles ayant la catégorie « spectacles ». Ma question est la suivante : comment puis-je procéder pour que les articles ayant la catégorie « spectacles » s’affichent sur la page « spectacles » du site ?

      Un grand merci d’avance !

    • Du coup ici pas besoin d’ACF.
      Ta page Spectacle contient quoi ? Seulement les articles de la catégorie spectacle ? Du coup tu fais un lien dans ton menu vers la catégorie directement.
      Mais si, comme je le pense, ta page spectacle possède un contenu (par exemple du texte et des champs ACF) + tu veux lister les spectacles alors il te faudra faire la chose suivante :
      – créer un modele de page spectacle (assigner du coup ton groupe de champ au modèle de page et non pas directement la page)
      – faire une boucle WordPress personnalisée pour aller chercher tes spectacles

      Pour faire des boucles personnalisées : http://www.geekpress.fr/wp-query-creez-des-requetes-personnalisees-dans-vos-themes-wordpress/

    • Merci pour cette réponse Maxime.
      Mais si j’affecte les champs personnalisés à un modèle de page je ne pourrai saisir qu’un seul spectacle ?! Pour coller à l’exemple du tutoriel, on peut considérer qu’un spectacle est équivalent à un jeu vidéo donc les spectacles sont bien des articles auxquels j’affecte un groupe de champs personnalisés et une catégorie ? Ensuite il me reste à faire la boucle pour afficher le contenu sur un page. Si j’ai bien tout compris ?

    • Oui c’est ça, je prenais l’exemple si dans le contenu de ta page « spectacles » tu avais aussi des champs. Après dans la boucle tu pourras appeler the_title, the_content mais également les fonctions the_field d’ACF !

  5. Bonjour,
    Merci pour cet article bien complet sur ACF.
    J’ai « investi » sur la version pro car elle le mérite bien (et soutien auteur) et on peut souligner le support réactif.
    Reste qu’il y a un truc qui me freine pour son adoption massive, c’est la possibilité de le lier à une extension formulaire qui permettrait à des anonymes ou pas! de rentrer directement des données sur nos sites sans passer par le back-office
    J’ai acheté http://codecanyon.net/item/accesspress-anonymous-post-pro/9160446 mais l’auteur a été obligé (s’est gentiment proposé) de coder en dur notamment les cases à cocher d’ou opération non pérenne !
    J’ai contacté d’autres auteurs mais la plupart ne garantisse rien car cela s’avèrerait complexe.
    Je n’ai ni le temps et compétence de coder celà (je sais c’est possible)
    https://formidablepro.com/ est une solution intérresssante et moins couteuse que gravity forms même si les auteurs annoncent pareil pas de compatibilité 100% (notamment checkbox)

    Avez-vous tester cette solution ou une autre ?
    Merci pour vos retours

    • Salut, Tu peux le faire nativement avec Gravity Forms qui le gère plutôt pas mal (perso j’ai ajouté un plugin gratuit qui permet d’enregistrer sur n’importe quel Custom Post Type) et le tour est joué !

    • Bonjour,
      Merci de ta réponse.
      J’avai bien vu Gravity Forms mais la solution serait plus coûteuse!.
      J’espère d’autre retours sur formidable pro ou autre
      Bonne journée

    • Salut,
      avec gravity, le hook le submission_form,
      ou alors avec Caldera Forms (gratuit lui), il y a un addon « Run Action » (Trigger an action with your form submission. A simple, free form processor for Caldera Forms that lets you do anything with your form data.)

  6. Bonjour,
    j’ai testé le plugin ACF, lisant tellement d’éloge dessus, je n’avais pas compris que le plugin n’évitait pas de devoir toucher aux fichiers du thème, il faut connaitre le codage au minimum, je ne trouve pas qu’il est fait pour les débutants.
    Je voulais créer une liste de noms, pour aider une amie, visible en partie tableau de bord, pour ne pas avoir à retaper les noms à chaque fois, pas sûr le fait, il a été plus rapide de faire à l’ancienne les pages , remplir à la main comme un texte que d’utiliser et comprendre ACF.
    Désolé mais il ne m’a pas convaincu, j’ai supprimé le plugin.

    • Je te comprend tout à fait, mais techniquement, sans toucher au thème c’est hélas impossible ! Peut être un jour avec les page builder !

  7. Bonjour,
    Merci Maxime pour ce top tuto !
    Je débute et patauge encore avec php…
    Je souhaitais avoir une petite précision, peut être un peu bête ;) mais dans la partie du tuto ou il faut « attaquer » le fichier single.php
    je souhaitais savoir dans quelle partie du fichier tu colles ton code ?
    j’ai le thème par défaut d’installer pour tester toutes mes petites manip et dans le fichier single.php j’ai des boucles dans tous les sens…

    je ne sais si je suis clair dans ma question…

    Merci d’avance pour ta réponse…

    • Je met à jour l’article. Effectivement pas toujours facile de s’y retrouver dans un thème que l’on a pas conçu, il va falloir s’aider du HTML pour comprendre où l’on est !

  8. Bonsoir et merci pour votre tuto tres clair!
    j’ai juste une question importante: je cherche a ajouter des custom fields sur tous les articles de mon site: j’ai donc selectionne:
    « Show this field group if post type is equal to post.
    Mais maintenant je passe a la partie code a ajouter dans l’editeur:
    je vais donc dans mon child theme et j’ajoute le code, mais dans quel fichier? j’ai modifié le fichier single.php mais sans effet. Est ce bien le bon fichier a modifier? ou c’est plutot le fichier functions.php?
    merci bcp bcp pr votre aide

    • Oui c’est bien single.php. Après, selon le thème, le code diffère et pour s’y retrouver ce n’est pas toujours évident. face aux nombreuses questions je vais mettre à jour l’article tout de suite avec quelques techniques pour s’y retrouver

  9. Hello,

    Très bon article.
    EN revanche, j’ai besoin d’aide SVP sur:
    Comment faire apparaitre ces champs avec liste des choix sur les pages lorsqu’un internaute se rend sur le site, je souhaite qu’il fitre ses recherche à partir des champs que j’ai créés?

    Merci.

  10. Merci beaucoup d’aborder ce sujet essentiel avec autant de simplicité !!!

    Tout fonctionne mais je n’ai pas compris comment faire pour afficher un contenu texte unique dans plusieurs pages (ex : chapô) ?

    Bien entendu, il faut pouvoir éditer ce contenu une seule fois dans un champ unique placé sur une seule page…

    Je sais que c’est possible mais je cale ;(

    Si vous pensez pouvoir me mettre sur une piste, ce serait génial !!!!!

    • Alors le plus simple c’est de créer une page Options (version pro) pour gérer un contenu « global » réutilisable partout : the_field(‘chapo’,’options’); Ou alors depuis récemment le champ Clone devrait aussi aider

    • Hello!

      Tout d’abord merci bcp pour ce post!
      je cherche une notice claire depuis 3 jours et c’est la seule qui est claire et nette!!!

      Pour tout vous dire je débute avec WP…
      J’au choisi pour la construction de mon site le thème CUSTOMIZR… celui-ci ne contient pas de fichier single.php…
      J’ai lu sur un forum qu’on pouvait ajouter notre code sur le fichier functions.php (c’est d’ailleurs ce qu’indique la notice sur le bo wordpress…
      ça marche pôôôô!!!
      Je tourne en rond depuis ce matin… Je comprend bien le principe mais j’arrive pas à mettre en pratique! Quelqu’un pourrait me dépatouiller???
      Merci d’avance ;-)

    • Je pense que le plus simple pour le moment c’est que tu partes sur un thème fait main, histoire que tu apprennes les bases du theming WordPress. En t’aidant de la doc officielle (le codex) ainsi qu’en étudiant le thème de base de WP, et éventuellement la base underscore.

      Normalement tous les thèmes sont sensés avoir un single.php, c’est l’un des templates les plus utilisés

  11. Tres bon article !!!
    Au cas ou vous seriez disponible je cherche quelqu’un pour m’aider a développer des formulaire d’édition de contenu par les utilisateur.

    Exemple : on a 2 CPT un film et l’autre réalisateur avec different champ ( nom du film, durée du film, extrait du film …
    Nom du réalisateur, date de naissance du real , liste de film réalisé… ).

    Et je voudrais qu’un utilisateur puisse ajouter via un formulaire un film ou un realisateur.
    Ou si l’utilisateur est sur l’article ( Steven Spielberg ). Il puisse ajouter un film réaliser par StevenSpielberg.

    ACF pro serait indispensable pour créer ce genre de fonctions notament avec ( repeteater filed ) ?

    Sinon je c’essaie de comprendre le ACF(_form()
    Mais quand je l’utilie avec le theme seventeen le formulaire n’apparait pas.
    avec le theme fourteen aucun probleme.
    Et le theme avec lequelle je voudrais l’utiliser ( Kleo ) le formulaire apparait mais la page bug impossible de scroller.

    Bref je galere et je cherche des information voir un coach qui porrit passer une heure ou deux a debugger et créer un formulaire d’exemple.

8676a75e2db0377650802756dab17ca6000000000000000000000000000000