Images - Themespress https://themespress.ca Plugins, tutoriels et ressources WordPress Mon, 17 Jan 2022 20:35:15 +0000 fr-FR hourly 1 https://wordpress.org/?v=7.1 https://themespress.ca/wp-content/uploads/2020/10/cropped-Favicon-Themepress.ca_-32x32.png Images - Themespress https://themespress.ca 32 32 Afficher les images attachées Post ID WordPress https://themespress.ca/afficher-images-attachees-post-id-wordpress/ https://themespress.ca/afficher-images-attachees-post-id-wordpress/#respond Sat, 28 Jan 2017 16:53:26 +0000 https://themespress.ca/?p=1476

Afficher les images attachées Post ID WordPress : Nous allons dans ce tutoriel se construire une fonction requête qui va permettre d’afficher les images attachées au Post ID.

Imaginons par un formulaire, vous insérez un article et que vous téléchargez plusieurs images, ces images téléchargées deviennent en objet get_attachment_image.

Et c’est dans cette fonction que nous allons effectuer la requête allant chercher les get_attachment_image du POST ID. Nous souhaitons aussi dans notre requête afficher les images en format $size = ‘medium’;

Voici les tailles images WordPress par défaut : ‘thumbnail’, ‘medium’, ‘large’, ‘full’. Ou utiliser des thumbnails images que vous avez personnalisées.

On dit aussi dans notre fonction que s’il n’y a pas d’images attachées au POST ID, n’affiche rien. Donc on prépare nos arguments et on n’affiche rien si vide.

Ensuite nous bouclons nos résultats en foreach avec comme vous le constatez du html personnalisé qui pourra être changé par le vôtre.

function via_get_images_attachees() {
	global $post;
    $thumb_id = get_post_thumbnail_id($post->ID);
	$id = intval( $post->ID );
	$size = 'medium';
	$attachments = get_children( array(
			'post_parent'     => $id,
			'post_status'     => 'inherit',
			'post_type'       => 'attachment',
			'post_mime_type'  => 'image',
			'order'           => 'ASC',
			'orderby'         => 'menu_order',
            'post__not_in'    => array( $thumb_id )
		) );
	if ( empty( $attachments ) )
	return '';
	$output = "\n";
	$output .= '<div id="grid">'; 
    
	/*** Loop through each attachment ***/ 
	foreach ( $attachments as $id => $attachment ) : $img_cap = $attachment->post_excerpt; 
		// New line to get the caption 
		$img_alt = get_post_meta($attachment_id, '_wp_attachment_image_alt', true); 
		//alt 
		if ($img_alt == '') : 
		$img_alt = $attachment-&gt;post_title; endif; $title = esc_html( $attachment-&gt;post_title, 1 ); 
		$img = wp_get_attachment_image_src( $id, $size ); 
		$output .= '<div class="box">'; 
		$output .= '<div data-thumbnail="' . esc_url( wp_get_attachment_url( $id ) ) . '"></div>'; 
		$output .= '<div data-image="' . esc_url( wp_get_attachment_url( $id ) ) . '"></div>'; 
		$output .= '<div class="thumbnail-caption">'; 
		$output .= '<h3>'. $img_alt .'</h3>'; 
		$output .= '</div>'; 
		$output .= '<div class="lightbox-text">'; 
		$output .= '" '. $img_alt .' " '; 
		$output .= '</div>'; 
		$output .= '</div>'; 
	endforeach; 
	$output .= '</div>'; 
	
	return $output; 
}

Remarquez aussi que dans la boucle nous voulons comme texte le alt de l’image qui est stocké dans une variable $img_alt. Bonne ou mauvaise idée, à vous de juger !

Maintenant prenons l’occasion d’afficher les résultats dans un template :

<?php echo via_get_images_attachees(); ?>

On sait pertinemment que le Post Thumbnail va être considéré comme une image attachée. Donc le Post Thumbnail va se retrouver dans la liste d’images. On peut dans nos arguments, mettre une exclusion du Post Thumbnail dans une variable $thumb_id.

Voici un exemple d’exclusion du Post Thumbnail : Donnons l’argument suivant après le global $post;

$thumb_id = get_post_thumbnail_id($post->ID);

Ensuite, vous ajouter l’argument exclusion dans la variable $attachments en déclarant un post__not_in de la variable $thumb_id.

$attachments = get_children( array(
	'post_parent'    => $id,
	'post_status'    => 'inherit',
	'post_type'      => 'attachment',
	'post_mime_type' => 'image',
	'order'          => 'ASC',
	'orderby'        => 'menu_order',
	'post__not_in'   => array( $thumb_id )
) );

Le code final pour afficher les images attachées Post ID WordPress en excluant le Post Thumbnail

function via_get_images_attachees() {
	global $post;
    $thumb_id = get_post_thumbnail_id($post->ID);
	$id = intval( $post->ID );
	$size = 'medium';
	$attachments = get_children( array(
			'post_parent'     => $id,
			'post_status'     => 'inherit',
			'post_type'       => 'attachment',
			'post_mime_type'  => 'image',
			'order'           => 'ASC',
			'orderby'         => 'menu_order',
            'post__not_in'    => array( $thumb_id )
		) );
	if ( empty( $attachments ) )
	return '';
	$output = "\n";
	$output .= '<div id="grid">'; 
    
	/*** Loop through each attachment ***/ 
	foreach ( $attachments as $id => $attachment ) : $img_cap = $attachment->post_excerpt; 
		// New line to get the caption 
		$img_alt = get_post_meta($attachment_id, '_wp_attachment_image_alt', true); 
		//alt 
		if ($img_alt == '') : 
		$img_alt = $attachment-&gt;post_title; endif; $title = esc_html( $attachment-&gt;post_title, 1 ); 
		$img = wp_get_attachment_image_src( $id, $size ); 
		$output .= '<div class="box">'; 
		$output .= '<div data-thumbnail="' . esc_url( wp_get_attachment_url( $id ) ) . '"></div>'; 
		$output .= '<div data-image="' . esc_url( wp_get_attachment_url( $id ) ) . '"></div>'; 
		$output .= '<div class="thumbnail-caption">'; 
		$output .= '<h3>'. $img_alt .'</h3>'; 
		$output .= '</div>'; 
		$output .= '<div class="lightbox-text">'; 
		$output .= '" '. $img_alt .' " '; 
		$output .= '</div>'; 
		$output .= '</div>'; 
	endforeach; 
	$output .= '</div>'; 
	
	return $output; 
}

The post Afficher les images attachées Post ID WordPress first appeared on Themespress.

]]> https://themespress.ca/afficher-images-attachees-post-id-wordpress/feed/ 0