Custom Shopp Gallery

Hot off the press, here is a reformatted Shopp gallery function to overcome the current gallery function.

Firstly the code gets a larger cover image, then checks to see if there are more images and loops over to create smaller, clickable thumbnails.

Combine with FancyBox (jQuery) or your other *box script

		if(shopp('product','has-images')) {
			echo '<a class="product_gallery" rel="product_gallery" title="'.shopp('product','name','return=true').'" href="'.shopp('product','image','size=1024&property=url&return=true&fit=matte').'">'.shopp('product','coverimage','sharpen=50&return=true&size=250&class=borderimage&alt='.shopp('product','name','return=true')).'</a>';
	//		echo '<br /><div class="enlarge_notes" style="width: '.$foo.'px;"> <em>Click to enlarge</em></div>';
		<br />
		if (sizeof($Shopp->Product->images) > 1) {
			$Shopp->Product->images = array_reverse($Shopp->Product->images);
			echo '<div style="width: 256px;align;center;padding-top: 10px">';
			if(shopp('product','has-images')) {
				echo '<em>Other views...</em><br />';
				while(shopp('product','images')) {
					echo '<a class="product_gallery" rel="product_gallery" title="'.shopp('product','name','return=true').'" href="'.shopp('product','image','sharpen=100&size=1024&property=url&return=true&fit=matte').'">'.shopp('product','image','fit=crop&return=true&thumbsize=120&class=borderimage&alt='.shopp('product','name','return=true')).'</a>';
					echo ' ';
			echo '</div>';

Author: Kieran Barnes

Kieran is a PHP developer with 15 years commercial experience. Specialist in WordPress, CakePHP, CubeCart and all things PHP.

5 thoughts on “Custom Shopp Gallery”

  1. Your code is great can you please tell me when i click on image it will be open in popup. At this time when i click on image it did not open popup it simple large image open in browser. thankx

  2. Hello, that all depends on your Javascript popup script. That code was specific to FancyBox (jQuery).
    If you are using the standard Shopp ColorBox script, you’ll need to adapt the code for that.

  3. Hi,

    The code above would be excellent if linked with FancyBox, sorry to be naive, but where would I insert this code or would I create it as a new .php file and where would it be placed? Undestandibly added with the FancyBox plugin installed…

    Any help would be great.


Leave a Reply

Your email address will not be published. Required fields are marked *