Qu’est ce qu’un Custom Fields dans WordPress ?

Custom Fields

 

Un champ personnalisé (custom field) se compose d’une clé (key) et d’une valeur (value). A l’aide de ces custom fields vous pouvez afficher presque tous les types d’information dans votre blog.

 

Custom Field Example

 

Voici quelques exemples d’utilisation de champs personnalisés.

 

Exemple 1.

Vous avez besoin d’afficher une petite image (preview) avec un petit texte à côté dans une catégorie. Pour cela, il faut créer un fichier my-image dans le dossier wp-content/uploads/ et y uploader les images nécessaires. Ensuite vous devez écrire au bon endroit dans le fichier index.php (dans le dossier de votre thème) le code suivant :

<img src="http:// VOTRE_SITE /wp-content/uploads/my-image/<?php echo get_post_meta($post->ID, "preview", $single = true); ?>" />
Voici un exemple de son application:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<table>
<tr>
<td><img src="http://www.wp-info.ru/wp-content/uploads/my-image/<?php echo get_post_meta($post->ID, "preview", $single = true); ?>" /></td>
<td><a href="<?php the_permalink() ?>"><?php the_title(); ?></a>
<?php the_content(); ?></td>
</tr>
</table>
<?php endwhile; ?>
<?php endif; ?>

 

Lorsque vous créez un enregistrement dans les champs personnalisés vous devez ajouter une nouvelle clé  – preview , et sa valeur sera le nom de l’image choisi, par exemple : mypic.jpg

Comme résultat, votre image mypic.jpg s’affichera au bon endroit.

<img src="http:// VOTRE_SITE /wp-content/uploads/my-image/mypic.jpg" />

 

Exemple 2.

Si vous avez oublié d’indiquer la clé preview d’ un custom field sur un enregistrement, le lien vers l’image sera cassé :

<img src="http:// VOTRE_SITE /wp-content/uploads/my-image/" />
C’est pourquoi il est logique de vérifier l’existence de la valeur de chaque custom field avant son affichage :
<?php $image = get_post_meta($post->ID, 'preview', true); if($image !== '') { ?>
<img src="http:// VOTRE_SITE /wp-content/uploads/my-image/<?php echo $image ?>" />
<?php } ?>

 

Exemple 3 :

On peut aussi vérifier l’existence de la valeur de la clé preview et si elle manque – afficher une image par défaut, par exemple defpreview.gif

<?php $image = get_post_meta($post->ID, 'preview', $single = true); ?>
<?php if($image !== '') { ?>
<img src="http://VOTRE_SITE/wp-content/uploads/my-image/<?php echo $image ?>" />
<?php }
else { ?>
<img src="http://Votre_Site/wp-content/uploads/my-image/defpreview.gif<?php echo $image ?>" alt="Image introuvable"/>
<?php } ?>

 

Il y a beaucoup d’exemples d’utilisation des custom fields, mais les exemples listés ci-dessus ont été donnés juste pour montrer leur principe de fonctionnement.

Articles similaires

COMMENT UTILISER FLEXBOX?

Imaginez que vous pouvez construire un layout très compliqué en quelques minutes ! Maintenant c’est possible avec Flexbox. Flexbox est un modèle de boîte flexible, un nouveau layout CSS qui offre la possibilité de créer facilement des maquettes ...

10 Outils pour améliorer votre responsive design

Saviez-vous qu'en 2014 le nombre d'utilisateurs mobiles a surpassé ceux qui utilisent des ordinateurs ? Dans un monde aussi ouvert socialement (d'un point de vue virtuel) et mobile vous êtes obliges de penser au responsive design de votre site web. ...