Image gallery(thumbnails) with WordPress image cropping

What about creating a small gallery of linked thumbnails, based on images inserted in a post, with cropping thumbnails?

First, create a post on WordPress and choose a category, for example, “tour”.
Then you can insert as many images as you want, defining links as you want.
You can use a custom field, to manage the title of the galery.

Publish you post, and call it on your PHP page, using the code bellow(where you can choose the number of images of your gallery and the cropping dimensions):

<? 		
if (have_posts()) : 
 global $post;
 $myposts = get_posts('numberposts=1&category_name=tour');
 foreach($myposts as $post) :
	// # here you call a custom field on wordpress
	$tourdes = get_post_meta($post->ID, 'Descrip', true);
   setup_postdata($post);
 ?>
  <h4><?=$tourdes;?></h4>
	<div id="thumbs">            	
		<? 
		$args = array(
			'post_type' => 'attachment',
			'numberposts' => -1,
			'post_status' => null,
			'post_parent' => $post->ID
			); 
		$attachments = get_posts($args);
		if ($attachments) {
			// - $tot_img : the total number of thumbnails on the gallery
			$tot_img=8;
			// - $brk_lin : number of image on each line
			$brk_lin=4;
			foreach ($attachments as $attachment) {						
			  // # here we define the max number of images
			  if(intval($cnt_img) < $tot_img){							
				echo "<span style='padding-left:3px'>";
				$imgref = wp_get_attachment_url($attachment->ID);
				$imgsrc = wp_get_attachment_image($attachment->ID, array(40,40), $icon = false);
				echo "<a href=".$imgref.">". $imgsrc ."<a>";
				echo "</span>"."\n";							
				// # here we define the line break
				$cnt_lin=$cnt_lin+1;
				  if(intval($cnt_lin)==$brk_lin){
				 echo "<br>";	
				 $cnt_lin=0;							
				  }
			   }
			   $cnt_img=$cnt_img+1;						
			}
		}
	
		
		?>
	</div>
<? endforeach;
endif; ?>
About these ads

,

  1. #1 by andimazlan on March 21, 2011 - 4:10 pm

    Hi,
    I have a question.
    I want to show images gallery linking to recent post in sidebar of my wordpress.
    Do you know the code or plugin?
    here’s the example
    I hope you can help me.

    Thank you.

  2. #3 by Andimazlan on March 23, 2011 - 5:21 am

    Hi Alvaro,
    1. Firstly thanks for your fast reply.
    2. I’ve tried your code but it didn’t work. I know it must be my fault coz I am very bad at coding.
    3. Your Plugin (Get Post List With Thumbnails) works just fine, but not like what I wanted.
    4. I looking for plugin that shows image gallery in gridview (this is important! Gridview.) that linking to recent post permalink (no post title, just the image) ie. (Flickr Gallery alike plugin).
    5. I’ve seen other blogs have this, but I don’t know what plugin is that. Been searching for ages! Phew.. Example site use this (http://thefilmstage.com/) in its review section.
    6. Btw, thanks again Alvaro. Looking for your reply.

    • #4 by Alvaro Neto on March 23, 2011 - 8:04 pm

      Hi Andimazlan, I’m working on a new version of Get Post List With Thumbnails, it’s coming soon, maybe until friday and I guess it will do exactly waht you need

    • #5 by Alvaro Neto on March 24, 2011 - 5:43 am

      Hi Andimazlan,

      As I told you, now you can download the “Get Post List With Thumbnails” 2.0.0

      In this new version, is possible to configure the list orientation, to display only images, to display or not the date, the date format, to display or not the title and the number of register per line(if you choose horizontal orientation).

      Please check it and let me know if now you can do what you wanted.

      Best Regards

  3. #6 by andimazlan on March 24, 2011 - 6:12 pm

    Hi Alvaro,

    Thank you. I’ve downloaded it. I am going to tested it now!
    I don’t know what to say, but you’re so kind. Really helpful.

    • #7 by Alvaro Neto on March 24, 2011 - 6:45 pm

      Thank you Andimazlan! Please let me know if it works. Best regards.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: