Utilisez un champ personnalisé au lieu de l’image en vedette dans WordPress

Récemment, j’ai profité pleinement des images en vedette WordPress (ou des vignettes de publication comme certains les appellent) pour le curseur d’image utilisé dans mes thèmes gratuits. Cependant, certaines personnes m’ont demandé s’il était possible d’avoir une image distincte pour le curseur puis leur vignette de publication car le curseur d’image a tendance à être beaucoup plus grand, alors j’ai pensé que j’écrirais un tutoriel rapide vous montrant comment ajouter un champ personnalisé à votre thème afin que vous puissiez définir une image distincte pour le curseur avec «l’image sélectionnée» définie comme sauvegarde.

Étape 1: créer le champ personnalisé

La première étape consiste à créer le nouveau champ personnalisé (voir le codex si vous n’êtes pas familier avec Les champs personnalisés). Insérez ce qui suit au début de la boucle, ce qui serait juste APRÈS l’instruction “while (have_posts)” ou “foreach ($ myposts as $ post”. Remplacez l’endroit où il est dit “Alternative Image” par ce qui a du sens, comme l’image du curseur , image de l’auteur… etc.

//get custom field titled "Post Image"
$alternative_post_image = get_post_meta($post->ID, 'Alternative Image', $single = true);

Étape 2: afficher un nouveau champ personnalisé au lieu de l’image en vedette

Vous pouvez maintenant passer un test rapide pour voir si le champ personnalisé existe et si tel est le cas, afficher l’URL définie dans le champ personnalisé, sinon afficher la vignette de l’article. Insérez le code suivant à l’endroit où vous souhaitez afficher votre image.

<?php
//if custom field isn't blank
if ($alternative_post_image !== '' ) { ?>
<img src="https://www.wpexplorer.com/custom-field-image-wordpress/<?php echo $alternative_post_image; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" />
<?php } else { ?>
<?php
//show featured image
the_post_thumbnail();
?>
<?php } ?>

Étape 3: Utilisez le champ personnalisé dans vos publications

Vous pouvez maintenant utiliser votre formulaire de champ personnalisé dans l’éditeur de publication pour définir le lien vers votre image alternative. Entrez le nom de votre champ personnalisé (dans cet exemple, il s’agit de «Autre image») dans le champ «Nom», puis l’URL de votre image dans le champ «Valeur». Cliquez ensuite sur «Ajouter un champ personnalisé».