I needed a way of displaying multiple images in a WP e-commerce installation. In order to do this I hacked the wpsc-single_product.php file that was being used in my theme (the one copied across to the theme folder)
I replaced the following code form line 32 onwards
32 33 34 35 36 37 38 | <a rel="<?php echo wpsc_the_product_title(); ?>" class="<?php echo wpsc_the_product_image_link_classes(); ?>" href="<?php echo wpsc_the_product_image(); ?>"> <img class="product_image" id="product_image_<?php echo wpsc_the_product_id(); ?>" alt="<?php echo wpsc_the_product_title(); ?>" title="<?php echo wpsc_the_product_title(); ?>" src="<?php echo wpsc_the_product_thumbnail(get_option('product_image_width'),get_option('product_image_height'),'','single'); ?>"/> </a> <?php if ( function_exists( 'gold_shpcrt_display_gallery' ) ) echo gold_shpcrt_display_gallery( wpsc_the_product_id() ); ?> |
with
sb_get_images_for_product(wpsc_the_product_id());//...then display all of the images
sb_get_images_for_product($id) is a function that I wrote into the themes functions.php file as follows
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | function sb_get_images_for_product($id){
global $wpdb;
$attachments = $wpdb->get_results($wpdb->prepare("SELECT * FROM $wpdb->posts WHERE post_parent = $id AND post_type = 'attachment' ORDER BY menu_order ASC"));
$count=0;
foreach ($attachments as $attachment){
$count++;
if ($count==1){//set up first image
echo "<table><tr><td>";
$image_attributes = wp_get_attachment_image_src($attachment->ID,'thumbnail');?>
<a rel="<?php echo wpsc_the_product_title(); ?>" href="<?php echo $attachment->guid; ?>" class="<?php echo wpsc_the_product_image_link_classes(); ?>">
<img src="<?php echo $image_attributes[0]; ?>" alt="<?php echo wpsc_the_product_title(); ?>"/>
</a></td></tr><tr><td>
<?php
}
else{
$image_attributes = wp_get_attachment_image_src($attachment->ID,'thumbnail');?>
<a rel="<?php echo wpsc_the_product_title(); ?>" href="<?php echo $attachment->guid; ?>" class="<?php echo wpsc_the_product_image_link_classes(); ?>">
<img class="resize" src="<?php echo $image_attributes[0]; ?>" alt="<?php echo wpsc_the_product_title(); ?>"/>
</a>
<?php
}
}
echo "</td></tr></table>";
} |
to tidy up the images I also added a little bit of css to the single_product.php as follows
<style> .resize { width: 35px; height : auto; } .resize { width: auto; height : 35px; } #TB_additional_images { margin-left:8px; } </style>