Il y a des projets qui nécessitent l’affichage de toutes les images sous forme de thumnails dans votre page archive.php ou ailleurs.La plupart du temps nous n’avons besoin que de l’image à la une avec l’excerpt de wordpress mais cet excerptne permet pas l’affichage des images.
Ce « petit » morceau de code (que nous vous conseillons de placer dans un autre fichier que functions.php à l’aide d’un « include ») vous aidera comme il se doit à afficher les images où et comme vous le souhaitez.
Dans le fichier functions.php avec ou sans « include » :
/** récupération des thumbnails **/
<?php function get_post_images($args = array()) { global $post; $defaults = array( 'number' => -1, 'order' => 'ASC', 'orderby' => 'post_date', 'output' => OBJECT, 'post_id' => null, 'preserve_keys' => false ); $args = wp_parse_args($args, $defaults); $post_id = (int) $args['post_id']; if (0 === $post_id) { if (!in_the_loop()) { return false; } $post_id = $post->ID; } extract($args, EXTR_SKIP); $attachments = false; $buf = false; $number = (int) $number; $number = (0 === $number) ? -1 : $number; $order = strtoupper(trim($order)); if ('ASC' !== $order && 'DESC' !== $order) { $order = 'ASC'; } switch (strtolower(trim($orderby))) { case 'natural': $orderby = 'natural'; break; case 'post_id': $orderby = 'ID'; break; case 'post_date': default: $orderby = 'post_date_gmt'; break; } if ('natural' !== $orderby) { $attachments = get_children(array( 'order' => $order, 'orderby' => $orderby, 'numberposts' => $number, 'post_mime_type' => 'image', 'post_parent' => (int) $post_id, 'post_status' => 'inherit', 'post_type' => 'attachment' )); } if (!$attachments) { if ($post_id == $post->ID) { $post_content = $post->post_content; } else { $my_post = get_post($post_id); if (!$my_post) { return false; } $post_content = $my_post->post_content; unset($my_post); } $regexp = apply_filters('get_images_regexp', '#<\s*?img\s+.*?wp-image-(\d+)[^>]*>#i'); if (1 === $number) { preg_match($regexp, $post_content, $matches); if (isset($matches[1])) { $matches = array($matches[1]); } } else { preg_match_all($regexp, $post_content, $matches); if (isset($matches[1])) { $matches = $matches[1]; } } unset($regexp, $post_content); if ($matches_count = count($matches)) { $stack = array(); if (-1 === $number) { $c = $matches_count; } else if ($number < $matches_count) { $c = $number; } else { $c = $matches_count; } unset($matches_count, $number); for ($i = 0; $c > $i; ++$i) { $id = (int) $matches[$i]; $stack[$id] = get_post($id); } if ('natural' === $orderby) { $attachments = $stack; } else { $tmp = array(); foreach ($stack as $id => $attachment) { $tmp[$id] = $attachment->$orderby; } natcasesort($tmp); foreach (array_keys($tmp) as $id) { $attachments[$id] = $stack[$id]; } unset($tmp, $attachment); if ('DESC' === $order) { $attachments = array_reverse($attachments, true); } } unset($stack, $id, $c, $i); } } if ($attachments) { switch (trim(strtoupper($output))) { case ARRAY_A: $buf = array(); foreach ($attachments as $id => $attachment) { $buf[$id] = get_object_vars($attachment); } break; case ARRAY_N: $buf = array(); foreach ($attachments as $id => $attachment) { $buf[$id] = array_values(get_object_vars($attachment)); } break; case OBJECT: default: $buf = $attachments; break; } if (!$preserve_keys) { $buf = array_merge(array(), $buf); } } return apply_filters('get_images', $buf); }
Affichage des thumbnails à mettre dans votre code php dans la boucle wordpress pour que vos images soient bien celles de votre article (ID)
<?php $img = get_post_images(); if ($img != false) { for ($i = 0; $i < count($img); $i++) { ?> <div class="votre classe"> <img src="<?php echo wp_get_attachment_thumb_url($img[$i]->ID); ?>"/> </div> <?php } } ?>
Exemple : Afficher les images dans un carroussel (Bulma) avec Fancybox
<div id="carousel-accueil" class="carousel overflow"> <?php $img = get_post_images(); if ($img != false) { for ($i = 0; $i < count($img); $i++) { ?> <div class="section-lot-slider"> <a class="fancybox" rel="images<?php echo $numeroarticle; ?>" href="<?php echo wp_get_attachment_url($img[$i]->ID, 'large'); ?>"> <img src="<?php echo wp_get_attachment_thumb_url($img[$i]->ID); ?>" /> </a> </div> <?php } } ?> </div>