Le 15 avril 2015, j'ai fait un talk lors d'un meetup du groupe Wordpress Lille. Cette présentation portait sur la découverte et l'utilisation du plugin Wordpress Advanced Custom Fields Pro. Le plugin ayant de nombreuses fonctionnalités, j'ai fait le choix d'en aborder qu'une partie, laissant la voie ouverte pour d'autres talks. On s'intéresse donc ici aux fonctions présentes dans la version gratuite du plugin et de la fonction "répéteur de champs".

Qu'est-ce qu' Advanced Custom Fields.

Advanced Custom Fields (ACF) est un plugin WordPress qui permet d'enrichir le contenu des pages à l'aide de champs personnalisés. ce type de champ existe de manière native dans WordPress mais ACF offre à l'utilisateur une interface graphique très simple pour en faciliter la création et la gestion.

Version gratuite et version Pro

Le plugin existe en version gratuite et pro, cette première s'installe directement depuis l'admin de WordPress, une simple recherche sur le nom permet de la trouver.
La version gratuite permet de créer tout type de champs personnalisés, et de d'affecter l'affichage de groupes de champs aux pages que l'on souhaite. On peut également y inclure une logique conditionnelle, certains champs ne s'affichant alors que lorsque d'autre ont été remplis.

En version pro, on ajoute de nouvelles fonctions plus avancées :

  • le répéteur de champs, fonction à laquelle on va s'intéresser dans le cas pratique
  • le contenu flexible (Flexible Content) qui permet d'ajouter à la volée, et dans la page d'édition, des "modules" contentant des champs et du html. (fera l'objet d'un prochain talk et prochain article)
  • la gestion de galeries d'images
  • la création de pages d'options au travers d'une interface graphique.

Combien coûte ce plugin

Le plugin, dans sa version pro coûte 25$ AUD pour une licence individuelle, soit environ 18€. Ce n'est pas un paiement à l'année, vous ne payez qu'une fois.
La version développeur permettant l'installation sur un nombre de sites illimité est à 100$ AUD (72 €). L'auteur, Elliot Condon , est sympa. Si vous optez pour la licence individuelle avant de passer à la pro, vous ne payer que la différence.

Interface graphique du plugin

Une fois le plugin installé, on retrouve une nouvelle entrée dans le menu principal de l'admin de WordPress. C'est via cette interface que l'on va très simplement créer nos champs. Ci après un exemple classique d'utilisation pour un site qui aurait une section "portfolio".

Advanced Custom Fields

Simple d'utilisation et rapide

On crée un nouveau groupe de champ que l'on nomme comme on veut. On ajoute les champs nom du client, site web, image principale et description puis on indique que l'on souhaite afficher ce groupe de champ que pour les pages de type "portfolio".

Advanced Custom Fields

La foire au champs

ACF dispose d'un grand nombre de champs utilisables. On utilisera fréquemment les champs basiques ainsi que les champs images ou encore l'insertion de google map. Mais il est intéressant de noter qu'on peut aller plus loin grâce au type champ relationnel ou encore via la création d'onglets si on souhaite soigner la présentation.

Advanced Custom Fields

Simple a intégrer

Jusqu'à maintenant nous n'avons pas encore parlé de code, toute se faisant via une interface graphique. Nous pouvons donc créer des champs mais il nous faut également une solution pour pouvoir les afficher où on le souhaite dans nos pages.
On va faire cela à l'aide de deux fonctions très simples. La première va permettre d'afficher directement le contenu du champ à l'emplacement où la fonction est appelée :

// Affiche direcement le contenu d'un champ 
<p><?php the_field('nom_du_champ');?></p>

La seconde fonction permet d'affecter le contenu d'un champ à une variable pour un usage ultérieur. On verra par la suite qu'un champ peut contenir autre chose que du texte ou un nombre, un objet par exemple.

// Usage ultérieur du contenu d'un champ 
<?php $ma-variable = get_field('nom_du_champ');?>

Mainteant que nous savons ce qu'est Advanced Custom Fields, voyons comment l'utiliser dans un cas pratique et fictif.

Article précédent : Apprendre Ruby on Rails
Article suivant : Advanced Custom Fields, cas pratique

Je suis disponible pour des missions longues / CDD / CDI Cliquez pour en savoir plus