web-dev-qa-db-fra.com

Utilisation de champs personnalisés avancés avec Wordpress et Lightbox

J'utilise le Plugin ACF . Je veux avoir un champ où je peux télécharger une image, et le résultat affichera la totalité de l'image dans la Lightbox, puis l'image entière sera redimensionnée dans une vignette de ce champ (comme une Lightbox normale).

Jusqu'ici j'ai le script ici, et c'est là où je suis:

<div class="single last">
<a href="<?php echo the_field('image_gallery'); ?>" rel="lightbox" title="<?php the_title(); ?>">

<?php
$main_car_pic = addslashes(the_repeater_field('image_gallery'));
$reg_ext = "#.jpg#i";
$thumb_ext = "-150x150.jpg";
$car_thumb = preg_replace($reg_ext, $thumb_ext, $main_car_pic);

echo $car_thumb
?>

Le champ Répéteur ACF ne fonctionne pas correctement et je ne peux pas savoir pourquoi. Quelqu'un a-t-il déjà utilisé ACF et redimensionne-t-il les images en vignettes? peut fournir tout ce qui pourrait aider.

4
Owen O'Neill

Il se passe beaucoup de choses ici. Tout d’abord, vous devez stocker l’image de champ répéteur en tant qu’ID (ce qui nécessite probablement de modifier les paramètres du sous-champ et éventuellement de ré-télécharger certaines de vos images), puis d’utiliser toutes les fonctions de l’API WordPress Core pour le gérer. (Vous croiserez probablement les chemins avec wp_get_attachment_image_src .) Cela supprime votre utilisation de la regex-ing, fait que la taille de votre image profite de add_image_size, etc.

Deuxièmement, vous devez suivre l'exemple de code du champ répéteur sur la page que vous avez liée. get_repeater_field() renvoie un objet que vous pouvez parcourir avec une instruction while et une get_sub_field() de type boucle. (À part: get_field( 'a_repeater_field' ) renvoie un tableau que vous pouvez parcourir avec une instruction foreach.)

Votre code final ressemblera à quelque chose comme ceci:

<?php if( get_field('image_gallery') ) {
    while( the_repeater_field('image_gallery') ) {
        $large_img_src = wp_get_attachment_image_src( get_subfield('an_image_subfield'), 'large' );
        echo '<a href="' . $large_img_src[0] . '">' . wp_get_attachment_image( get_sub_field('an_image_subfield'), 'thumbnail' ) . '</a>';
    }
} ?>

Vous pouvez remplacer "miniature" et "grand" par un tableau ou une taille d'image personnalisée.

4
mrwweb