WordPress.org

1. Matthew
   Member
   Posted 1 year ago #

   I'm working on a theme with a side scrolling image slideshow. I'm trying to set the container width dynamically. I'm trying to grab the image widths of all the images in the post/page and add them up with their padding.

   I'm able to get the original attachment width with:

   $attachment_width = wp_get_attachment_metadata($attachment_id);
   echo $attachment_width['width'];

   But wp_get_attachment_metadata does not seem to return the width for the medium size of the images.

   I tried also to use the php function getimagesize to get the image widths, but I get errors with this code:

   $attachment_width = wp_get_attachment_image_src($attachment_id, $size='medium');
   list($width, $height, $type, $attr) = getimagesize($attachment_width);
   echo $width;

   For clarity, here is the full code I'm using for scrolling image slideshow from the functions.php:

   // Add lightbox rel
   function wp_get_attachment_link_canoe($id = 0, $size = 'thumbnail', $permalink = false, $icon = false) {
   	$_post = & get_post( intval($id) );
   	if ( ('attachment' != $_post->post_type) || !$url = wp_get_attachment_url($_post->ID) )
   		return __('Missing Attachment');
   	if ( $permalink )
   		$url = get_attachment_link($_post->ID);
   	$post_title = attribute_escape($_post->post_title);
   	$link_text = wp_get_attachment_image($id, $size, $icon);
   	if ( !$link_text )
   		$link_text = $_post->post_title;
   	return "<a rel='lightbox[$_post->post_parent]' href='$url' title='$post_title'>$link_text</a>";
   }
   
   // Scroll shortcode
   function scroll(){
   echo '<div class="scroll">';
   $attachments = get_children( array('post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'ASC', 'order_by' => 'menu_order ID') );
   foreach ( $attachments as $attachment_id => $attachment ) {
   	?><?php echo wp_get_attachment_link_canoe($attachment_id,$size='medium'); ?><?php
   /*
   	$attachment_width = wp_get_attachment_metadata($attachment_id);
   	echo $attachment_width['width'];
   
   	$attachment_width = wp_get_attachment_image_src($attachment_id, $size='medium');
   	list($width, $height, $type, $attr) = getimagesize($attachment_width);
   	echo $width;
   */
   }
   echo '</div>';
   }
   add_shortcode('scroll','scroll');

   I want to set the width of the class "scroll". Temporarily I've set it statically very large. But this inhibits the usability of the side scroll.

2. Matthew
   Member
   Posted 1 year ago #

   There is a plugin for Indexhibit that I came across that works like this. In Indexhibit the image sizes are stored in the database when you upload them. The plugin Horizontal Format grabs the sizes from the db and adds them up.

   $pages = $OBJ->db->fetchArray("SELECT *
   	FROM ".PX."media, ".PX."objects_prefs
   	WHERE media_ref_id = '$rs[id]'
   	AND obj_ref_type = 'exhibit'
   	AND obj_ref_type = media_obj_type
   	ORDER BY media_order ASC, media_id ASC");

   foreach ($pages as $go)
   {
   	$title = ($go['media_title'] == '') ? '' : "<div class='title'>" . $go['media_title'] . "</div>";
   	$title .= ($go['media_caption'] == '') ? '' : "<div class='caption'>" . $go['media_caption'] . "</div>";
   
   	$temp_x = $go['media_x'] + $this->picture_block_padding_right;
   	$this->final_img_container += ($go['media_x'] + $this->picture_block_padding_right);
   
   	$a .= "<div class='picture_holder' style='width: {$temp_x}px;'>\n";
   	$a .= "<div class='picture' style='width: {$go[media_x]}px;'>\n";
   	$a .= "<img src='" . BASEURL . GIMGS . "/$go[media_file]' width='$go[media_x]' height='$go[media_y]' alt='" . BASEURL . GIMGS . "/$go[media_file]' />\n";
   	$a .= "<div class='captioning'>$title</div>\n";
   	$a .= "</div>\n";
   	$a .= "</div>\n\n";
   }
   
   $s .= "<div id='img-container'>\n";
   if ($rs['content'] != '') $s .= "<div id='text'>" . $rs['content'] . "</div>\n";
   $s .= $a;
   $s .= "<div style='clear: left;'><!-- --></div>";
   $s .= "</div>\n";
   
   return $s;
   }

   Maybe is there a way to do this with WP? I imagine that the image sizes are stored in the DB as well. This is maybe a better route than using getimagesize.

3. Matthew
   Member
   Posted 1 year ago #

   OKAY I FIGURED IT OUT.

   For those interested in this problem:
   

   // Scroll shortcode
   function scroll_shortcode(){
   	$attachments = get_children( array('post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'DESC', 'orderby' => 'menu_order') );
   	foreach ( $attachments as $attachment_id => $attachment ) {
   		$attachment_meta = wp_get_attachment_metadata($attachment_id);
   		$attachment_width = $attachment_meta['sizes']['medium']['width'] + 30;
   		$width += $attachment_width;
   	};
   	echo '<div class="scroll" style="width:'.$width.'px !important;">';
   
   foreach ( $attachments as $attachment_id => $attachment ) {
   	?><?php echo wp_get_attachment_link_canoe($attachment_id,$size='medium'); ?><?php
   }
   echo '</div>';
   }
   add_shortcode('scroll','scroll_shortcode');

4. Matthew
   Member
   Posted 1 year ago #

   Whoops, it needed a fallback if there is no medium size:

   // Scroll shortcode
   function scroll_shortcode(){
   	$attachments = get_children( array('post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'DESC', 'orderby' => 'menu_order') );
   	foreach ( $attachments as $attachment_id => $attachment ) {
   		$attachment_meta = wp_get_attachment_metadata($attachment_id);
   		if (isset($attachment_meta['sizes']['medium']['width'])) {
   			$attachment_width = $attachment_meta['sizes']['medium']['width'] + 30;
   			$scroll_width += $attachment_width;
   		} else {
   			$attachment_width = $attachment_meta['width'] + 30;
   			$scroll_width += $attachment_width;
   		}
   	};
   	echo '<div class="scroll" style="width:'.$scroll_width.'px !important;">';
   
   foreach ( $attachments as $attachment_id => $attachment ) {
   	?><?php echo wp_get_attachment_link_canoe($attachment_id,$size='medium'); ?><?php
   }
   echo '</div>';
   }
   add_shortcode('scroll','scroll_shortcode');

Topic Closed

This topic has been closed to new replies.