Créer une page d’option ACF pour son thème
Créer une page d’option pour son site wordpress peut etre très interessant selon vos besoins. Chez A&F Développement, nous avons pour habitude d’utiliser les page d’option ACF pour tout ce qui va etre utilisé partout sur le site et à besoin d’etre administrable. Par exemple, nous plaçons le logo dans la page d’option. Ainsi, l’administrateur pourra changer son logo facilement. Vous pouvez aussi mettre en place un colorpicker afin de définir les couleurs principal de votre site et utiliser les variables en CSS pour pouvoir administrer les couleurs de votre site. Ou encore gérer le contenu d’un shortcode. Dans cet article nous allons voir comment administrer le logo de son site.
Créer une page d’option sur ACF
Pour créer une page d’option sur ACF, il vous suffit d’aller dans votre fichier functions.php à la racine de votre thème et d’ajouter ce code :
// Vérifie si la fonction ACF add_options_page existe
if (function_exists('acf_add_options_page')) {
// Ajoute une page d'options nommée "Options du site" dans le menu d'administration
// avec une capacité d'édition de "edit_posts" et pas de redirection après la sauvegarde
$parent = acf_add_options_page(
array(
'page_title' => 'Options du site',
'menu_title' => 'Option du site',
'menu_slug' => 'option-du-site',
'capability' => 'edit_posts',
'redirect' => false
)
);
}Après avoir ajouté ce code, vous devriez avoir un nouvel élément sur votre administrateur comme cela :
En cliquant dessus, vous remarquez que cette page est entièrement vide. Nous allons maintenant voir comment créer des champs ACF sur cette page.
Créer des champs pour sa page d’option ACF
Pour créer nos premiers champs, il faut se rendre sur les paramètres d’ACF et de créer un nouveau groupe de champ et d’y ajouter un champ image que l’on appellera « Logo ». Voici donc les paramètres à appliquer :
Pour assigner ce groupe de champs à votre page d’option, il faut Renseigner « Page d’options est égal à Option du site » dans le cadre « Assigner ce groupe de champs ».
Maintenant, que vous avez vos nouveaux champs dans votre page d’option, vous pouvez y ajouter votre logo. Je vous recommande d’ajouter un texte alternatif à votre image pour le SEO de votre site.
Récupérer le logo sur votre site
Pour récupère votre logo, il faut ajouter ce code dans votre fichier header.php pour qu’il soit sur tous les header de votre site :
<?php
// Récupère l'URL et l'alt text du logo depuis les options du site
$logo = get_field("logo", "option"); ?>
<!-- Affiche l'image de logo en utilisant l'URL et l'alt text récupérés -->
<img src="<?= $logo["url"]; ?>" alt="<?= $logo["alt"]; ?>">Explications :
- La fonction get_field permet de récupérer la valeur du champ logo. (Contrairement à la fonction the_field qui, elle, va afficher la valeur. Mais comme on retourn un array, on ne peut pas afficher la valeur)
- Le second paramètre « option » permet de dire qu’on va chercher la valeur dans la page d’option. Sans ce paramètre, il ira chercher le champs dans les options de la page courante.
- On ajoute l’url de l’image grâce à $logo[« url »] et le texte alternatif grave à la variable : $logo[« alt »].
Félicitation, nous avons vu comment administrer le logo de notre site grâce à la page d’option ACF. Vous savez maintenant comment ajouter et récuperer des champs et l’afficher où vous le souhaitez sur votre site.
