Ajouter des images via des custom field

Ajouter des images via des custom field dans wordpress

Dans le cas ou on aurait supprimé l’éditeur de texte par défaut de wordpress, et qu’on veut quand même se donner ou donner la possibilité à l’utilisateur de télécharger des images pour les afficher sur le site, la solution , ou une des solutions consiste à se créer des custom fields.

Disons que c’est la manière la plus simple. Plutôt que de créer une metabox complexe avec l’uploader de wordpress , plutôt que de créer des custom field dédié dans notre fichier functions.php ou sous forme de plugin, on va simplement utiliser les custom field par défaut de wordpress, puis on va créer le code dans notre page (single.php, ou page.php) qui va récupérer notre  custom field en question pour l’afficher sur le site.

Dans l’édition de notre custom field on lui donne un nom, ‘Image1‘ par exemple. On clique sur « Enter new« , on lui donne son nom et une valeur, puis on valide en cliquant sur « Add Custom Field »

cf

Voici ensuite le code à insérer dans notre fichier single.php.

<p><?php $gallery_data = get_post_meta($post->ID, 'Image1', true); ?></p> 
                        <?php
                        if ($gallery_data == '') {
                            echo '';
                        } else {
                            echo '<img class="custom" src="'. $gallery_data.'">';
                        };
                        ?> 

Ou dans une autre version.

  <p><?php $gallery_data = get_post_meta($post->ID, 'Image1', true); ?></p> 
                        <?php
                        if ($gallery_data == '') {
                            echo '';
                        } else {?>
<!--//                            echo '<img class="custom" src="'. $gallery_data.'">';-->
                             <img src="<?php  echo get_post_meta($post->ID,  'Image1', true); ?>" alt="<?php the_title(); ?>" />
        
                      <?php  };
                        ?>  

On récupère la valeur de notre champ avec le get_post_meta() habituel, on vérifie que le champ est bien rempli avant de l’afficher, puis on insère la valeur de notre champ dans le src d’une balise image.

zz

Ainsi, dans l’édition de notre custom field, il suffira de coller l’url d’une image, et cet url sera directement inséré dans la balise src de l’image.

Il reste ensuite à styliser l’image en fonction de ses besoins.

Laisser un commentaire

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

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.