• Hi all,

    Does anyone now how to add descriptions so they display under the thumbnail gallery photos? I’ve been trying to figure out how to do this for ages to know avail and after much searching. I want to try and get it to display similar to https://www.humansofnewyork.com as I will be using long descriptions like that. Any help much appreciated; code to add, a plugin, explanation, anything!!

    Thanks

Viewing 2 replies - 1 through 2 (of 2 total)
  • trizonia

    (@trizonia)

    Hey flyinjam,
    I was having a similar problem, and after a lot of searching (I’m not a php expert), this might be a solution (most parts have been copied from https://wpsites.org/change-gallery-output-wordpress-10510/:

    function hoy_gallery($output, $attr) {
    	global $post;
    	if (isset($attr['orderby'])) {
    		$attr['orderby'] = sanitize_sql_orderby($attr['orderby']);
    		if (!$attr['orderby'])
    			unset($attr['orderby']);
    	}
    	extract(shortcode_atts(array(
    		'order' => 'ASC',
    		'orderby' => 'menu_order ID',
    		'id' => $post->ID,
    		'itemtag' => 'dl',
    		'icontag' => 'dt',
    		'captiontag' => 'dd',
    		'columns' => 3,
    		'size' => 'thumbnail',
    		'include' => '',
    		'exclude' => ''
    	), $attr));
    
    	$id = intval($id);
    	if ('RAND' == $order) $orderby = 'none';
    	if (!empty($include)) {
    		$include = preg_replace('/[^0-9,]+/', '', $include);
    		$_attachments = get_posts(array('include' => $include, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby));
    
    		$attachments = array();
    		foreach ($_attachments as $key => $val) {
    			$attachments[$val->ID] = $_attachments[$key];
    		}
    	}
    	if (empty($attachments)) return '';
    
    	// Here's your actual output, you may customize it to your need
    	$output = "<div class=\"gallery-size-thumbnail gallery-columns-3 gallery\">\n";
    	// Now you loop through each attachment
    	foreach ($attachments as $id => $attachment) {
    		// Fetch all data related to attachment
    		$img = wp_prepare_attachment_for_js($id);
    
    		// If you want a different size change 'large' to eg. 'medium'
    		$url_link = $img['sizes']['full']['url'];
    		$url = $img['sizes']['thumbnail']['url'];
    		$height = $img['sizes']['thumbnail']['height'];
    		$width = $img['sizes']['thumbnail']['width'];
    		$alt = $img['alt'];
    
    		// Store the caption
    		$caption = $img['caption'];
    		$fdescritpion = $attachment->post_content;
    
    		$output .= "<dl class=\"gallery-item\"><dt class=\"gallery-icon portrait\">\n";
    		$output .= "<a class=\"attachment-thumbnail\" href=\"$url_link\" alt=\"{$alt}\" >\n";
    		$output .= "<img class=\"attachment-thumbnail\" src=\"{$url}\" width=\"{$width}\" height=\"{$height}\" alt=\"{$alt}\" /></a>\n";
    
    		// Output the caption if it exists
    		if ($caption) {
    			$output .= "<div class=\"wp-caption-text gallery-caption\">{$caption}</div>\n";
    		}
     		// Output the description if it exists
    			if ($fdescritpion) {
    			$output .= "<div class=\"descr\">{$fdescritpion}</div>\n";
    		}
    		$output .= "</dt></dl>\n";
    	}
    	$output .= "</div>\n";
    	return $output;
    }
    
    add_filter('post_gallery', 'hoy_gallery', 10, 2);

    You add all this to your functions.php file.
    What the above basically does is replace the normal gallery with a custom one, so you could change that to something that suits your needs.
    To get the description, you use:
    $fdescritpion = $attachment->post_content;
    It could definitely use improvements and the way it’s built your image thumbnails will only link to the larger images (there is no slideshow), but it could be a starting point.

    trizonia

    (@trizonia)

    Ok, small mistake there, but I found out I could edit my post :).

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Description under thumbnail gallery pictures’ is closed to new replies.