web-dev-qa-db-fra.com

Impossible d'afficher correctement le champ de personnalisation d'image ACF dans Genesis Framework

WP 4.7.3 avec Types, Genesis Sample Theme, ACF et quelques plugins très connus, rien de spécial ou de non standard.

Je sais comment afficher correctement les champs d'un champ de répéteur de champs personnalisés avancés sur une page ou un modèle. Dans mon cas, pour chaque message, j'ai entré l'un des trois champs d'image possibles. Donc, pour récupérer cette taille d'image, cela ressemblerait à quelque chose comme:

$count = get_post_meta( get_the_ID(), 'items', true );

    if ( $count ) {

        for ( $i = 0; $i < $count; $i++ ) {

            $item_100x100   = get_post_meta( get_the_ID(), 'items_' . $i . '_item_100x100', true );
            $item_200x200   = get_post_meta( get_the_ID(), 'items_' . $i . '_item_200x200', true );
            $item_300x300   = get_post_meta( get_the_ID(), 'items_' . $i . '_item_300x300', true );

            if ( $item_100x100 ) {
                echo '<p class="overview">' . wp_get_attachment_image( $item_100x100, 'items' ) . '</p>';
            } elseif ( $item_200x200 ) {
                echo '<p class="overview">' . wp_get_attachment_image( $item_200x200, 'items' ) . '</p>';
            } elseif ( $item_300x300 ) {
                echo '<p class="overview">' . wp_get_attachment_image( $item_300x300, 'items' ) . '</p>';
            }

        }

    }

Je pense que c'est correct et cela fonctionne très bien.

Ensuite, je travaille sur un fichier archive-cpt.php qui doit afficher plusieurs champs personnalisés pour chaque publication trouvée, y compris cette image.

Maintenant, si je devais montrer l'image sélectionnée, je pourrais faire:

// Featured image
if ( $image = genesis_get_image( 'format=url&size=item-image' ) ) {
    printf( '<a href="%s" rel="bookmark"><img src="%s" alt="%s" class="alignleft" /></a>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );
}

// Entry title
echo '<h2 class="entry-title" itemprop="headline"><a href="' . get_permalink() . '">'. get_the_title() .'</a></h2>';

Mais je ne montre pas l'image sélectionnée de l'article, j'essaie de montrer un champ personnalisé de type image à partir d'un champ de répéteur ACF.

Si je fais:

if ( $item_100x100 ) {
    $image = wp_get_attachment_image( $item_100x100, 'items' );
} elseif ( $item_200x200 ) {
    $image = wp_get_attachment_image( $item_200x200, 'items' );
} elseif ( $slope_map_300x300 ) {
    $image = wp_get_attachment_image( $item_300x300, 'items' );
}

printf( '<a href="%s" rel="bookmark"><img src="%s" alt="%s" class="alignleft" /></a>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );

Je reçois l'image imprimée à l'écran mais suivie de la chaîne

"alt =" mon-alt-texte "class =" alignleft "/>

à côté de cela.

J'ai essayé plusieurs autres choses, mais je me suis retrouvé avec le même résultat ou juste le titre de l'article lié à l'article et aucune image.

Quelqu'un peut aider? Merci d'avance.

REMARQUE: Je n’utilise pas les commandes get_field (), etc. d’ACF, car a) elles ne sont pas de type WP natif et b) elles ajoutent des requêtes de base de données (beaucoup, des dizaines si vous avez plusieurs répéteurs ou Contenu flexible). Avec WP natif, vous n’ajoutez qu’une seule requête à la base de données.

custom-fieldpost-metaadvanced-custom-fieldsgenesis-theme-framework
2
Karls

Ok, alors voici la bonne réponse, avec le code complet pour un champ de répéteur ACF:

$count = get_post_meta( get_the_ID(), 'items', true );

if ( $count ) {

    for ( $i = 0; $i < $count; $i++ ) {

        $item_100x100   = intval( get_post_meta( get_the_ID(), 'items_' . $i . '_item_100x100', true ) );
        $item_200x200   = intval( get_post_meta( get_the_ID(), 'items_' . $i . '_item_200x200', true ) );
        $item_300x300   = intval( get_post_meta( get_the_ID(), 'items_' . $i . '_item_300x300', true ) );

        if ( $item_100x100 ) {
            $image_id = wp_get_attachment_image_src( $item_100x100, 'full' );
        } elseif ( $item_200x200 ) {
            $image = wp_get_attachment_image_src( $item_200x200, 'full' );
        } elseif ( $item_300x300 ) {
            $image = wp_get_attachment_image_src( $item_300x300, 'full' );
        }

        if ( $image ) {
            echo '<a href="' . get_permalink() . '" rel="bookmark"><img src="' . $image[0] . '" alt="' . the_title_attribute( 'echo=0' ) . '">';

        }

    }

}

Ou, au lieu de cela, le

écho

une partie, vous pouvez faire:

printf( '<a href="%s" rel="bookmark"><img src="%s" alt="%s" class="alignleft" /></a>', get_permalink(), $image[0], the_title_attribute( 'echo=0' ) );

Il vous suffit de changer le "plein" à la taille d'image souhaitée.

UPDATE: Comme @bosco l'a souligné ci-dessous, wp_get_attachment_image renverra un élément HTML entier. Nous voulons simplement que l'URL de l'image puisse définir l'attribut src. Par conséquent, nous utiliserons wp_get_attachment_image_src dans notre code. Je me rends compte que je m'amusais avec le HTML.

1
Karls