Introduction à Advanced Custom Fields (ACF) et cas pratique simple : « créer une page pour présenter une critique de cinéma ». Meetup WPrennes #3 - 1 juillet 2016

1. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016
WordPress +
ACF
Vers l'infini et au-delà…
MeetupWordPress–Rennes–01/07/2016

2. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Brice Capobianco
Site // b-website.com
Twitter // @BriceCapobianco
Plugins //
• Simple Revisions Delete
• WP Plugin Info Card
• WP Envato Affiliate Card (add-on)
2
Resp. commercial en agence & freelance WordPress

3. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 ACF c’est quoi ?
Plugin gratuit avec version Pro ($25 / $100)
Créé par Elliot Condon
ACF = Advanced Custom Fields
“Customise WordPress with powerful,
professional and intuitive fields.”
3

4. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Comment ça fonctionne ? 1/3
Vous avez sans doute
déjà vu ça ?
Et pour afficher :
Avec des champs personnalisés bien sûr !
4
<?php echo get_post_meta( $post_id, ’mon-champ’ ); ?>

5. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Comment ça fonctionne ? 2/3
C’est pratique mais :
• Pas de contrôle sur l’affichage (Page ? Poste ?)
• Aucun formatage possible (WYSIWYG/Date/Nombre/Color Picker)
• Pas de « liste de choix », de bouton radio, checkbox
• Pas de champ média
• Ergonomie absente
• Etc.
Pour résumer : Très peu exploitable pour la contribution.
Si ça existe déjà, pourquoi utiliser ACF ?
5

6. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Comment ça fonctionne ? 3/3
Nous y voilà, il va enfin lâcher le morceau !
6
ACF utilise les champs personnalisés de WordPress
(donc c’est du natif et c’est léger)
Voici ce qu’il ajoute :
• Ergonomie (pour les devs et contributeurs)
• Souplesse
• Personnalisation avancée
• Affichage conditionnel (groupes de champs et champs)
Voici où il l’ajoute :
• Contenus
• Taxonomies
• Profils utilisateurs

7. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016
Exemple pratique
Et si on créait une page pour
présenter une critique de cinéma ?
7

8. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 De quoi avons-nous besoin ?
Un champ pour coller l’url de la bande annonce
Un champ pour insérer l’affiche du film
Un champ pour saisir la note de la critique
• Format : Numérique
• Requis : Oui
• Valeur min : 0
• Valeur max : 5
8
Commençons par faire simple, il me reste moins de 5 minutes

9. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Créer un groupe de champs
9
Simple, ergonomique et paramétrages fins

10. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 La contribution avec ACF
10
C’est quand même bien mieux, non ?

11. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Comment récupérer ces infos ?
<?php echo get_post_meta( $post_id, ’mon-champ’ ); ?>
ACF fourni sa fonction simplifiée d’appel des champs :
<?php echo get_field( ’mon-champ’ ); ?>
Si le champ est vide, get_field retourne FALSE
11
On n’y échappe pas, il faut savoir « coder » un minimum

12. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Construction de la fonction
12
Récupération des champs, mise en forme et insertion dans le contenu

13. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 Affichage des données
13
Le résultat en seulement 10 minutes. Convaincu ?

14. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016 «Vers l'infini et au-delà… »
Groupes de champs à affichage conditionnel (ACF location rules)
Affichage conditionnel de champs
Insertion de médias, documents, Maps Google, etc.
Lister les taxonomies et les contenus pour créer des liens ou des
relations entre vos contenus
Une super API pour ajouter vos propres champs
En version pro :
• galeries photos,
• champs répétés,
• groupes de champs flexibles,
• ACF dans vos pages d’options !
14
Vous pouvez imaginer toute structure de page !

15. WordPress+ACF-versl’infinietau-delà…
MeetupWordPress–Rennes–01/07/2016
Merci !
A vous le micro
15
MeetupWordPress–Rennes–01/07/2016