multiple image upload for wp-e-commerce plugin with out gold cart


Hi Guys,

I would like to explain how to upload the multiple file image  in the wp-e-commerce plugin.

1. You need to open two files.

– First one is wp-e-commerce/wpsc-admin/includes/display-items-functions.php

– Second one is wp-e-commerce/wpsc-admin/ajax-and-init.php

2. Then find the ” if(function_exists(‘gold_shpcrt_display_gallery’))” string in the two files.

3. And replace with this string ” if(!function_exists(‘gold_shpcrt_display_gallery’)) ” (Just insert ! symbol)

4. Then go back your backend plugin products edit page and upload multiple files as well.

5. Thats it.

How to display thumpnail image in products detail page.

1. Go to single_product.php file. just insert this code.

<?php

$product_data[‘id’] = wpsc_the_product_id();

$values = $wpdb->get_results(“SELECT * FROM `”.WPSC_TABLE_PRODUCT_IMAGES.”` WHERE `product_id` = ‘{$product_data[‘id’]}’ AND `image_order` != 0 ORDER BY image_order ASC”,ARRAY_A);

if($values != null) {

foreach($values as $image) {

if(function_exists(“getimagesize”)) {

if($image[‘image’] != ”) {

$num++;

$imagepath = WPSC_IMAGE_DIR . $image[‘image’];

$image_data = @getimagesize(WPSC_THUMBNAIL_DIR.$image[‘image’]);

?>

<img class=’previewimage’ onclick=”change_image(‘<?php echo WPSC_THUMBNAIL_URL.$image[‘image’]; ?>’)” alt='<?php echo __(‘Preview’, ‘wpsc’); ?>’ src='<?php echo WPSC_THUMBNAIL_URL.$image[‘image’]; ?>’ alt='<?php echo __(‘Preview’, ‘wpsc’); ?>’ title='<?php echo __(‘Preview’, ‘wpsc’); ?>’ />

<?php

}

}

}

}

?>

Finish it. Now you can see the multiple files in your product detail page.

Kindly send your feedback.

48 thoughts on “multiple image upload for wp-e-commerce plugin with out gold cart

  1. Hi, I can upload multiple images now..

    The problem is I can’t see the images in the product detail page..
    Seems like the code didn’t work.
    In what part of single_product.php file did you insert that code?
    Thanks

  2. It does uploading the images into the back-end, but the single_product.php doesn’t help showing the images..

  3. Hey, I can get the multiple upload working in the backend but am struggling to call the iamges onto the product page.

    When I paste your code I get this php error:
    Parse error: syntax error, unexpected '`' in C:\xampplite\htdocs\serge\wp-content\plugins\wp-e-commerce\themes\default\single_product.php on line 47

    Any help appreciated.

    • OK I rustled up my own code to call the images. I’m not that php-experienced so open to suggestions for improvement. I used raw SQL queries rather than wordpress built-in functions which probably would have been better.
      You may need to adjust the code a bit to suit your setup.

      <?php //Start Extra images
      $query = "SELECT * FROM `wp_wpsc_product_images` WHERE `product_id`=" . wpsc_the_product_id();
      $result = mysql_query($query);

      while($row = mysql_fetch_array($result))
      {
      $thumb_url[]=$row['image'];
      }

      $i=0;
      while ($i
      <a href="" >
      <img src="" width="35" height="35" />

      This code will call the images, resize them to 35×35 and link them to the full-size version. You may need to play around with css to get it looking how you want.

      • sorry it seems to have un-coded my comment
        correction:

        <?php //Start Extra images
        $query = "SELECT * FROM `wp_wpsc_product_images` WHERE `product_id`=" . wpsc_the_product_id();
        $result = mysql_query($query);
        
        while($row = mysql_fetch_array($result))
        {
        $thumb_url[]=$row['image'];
        }
        
        $i=0;
        while ($i 
        	<a href="" rel="lightbox[]">
        	<img src="" width="35" height="35" />
        	
        	
        
    • After struggling a long time, one simple solution is just to use the native gallery option in wordpress, which retrieves all images attached to a post/page. Just add “”
      into your wpsc-single_product.php page and it will display all the images uploaded to that product. I use it together with galleria plugin to have a nice thumbviewer gallery.
      Have fun!

  4. If you have managed to get the multi-image upload working in the back end here is a link to the code I wrote to call those images.

    It queries the database directly and calls the additional images and displays them as small images in a div with class “minis”.

    http://pastebin.com/XwAx27K8

    the code (with is in the pastebin) should go just after the first endif statement at around line 40 in single_product.php.

    Then style the thumbnails with css and apply a image viewer is desired (I used lightbox, and have included the rel attribute in my script).

  5. For those of you who have upgraded to version 3.8+ the whole working of wp e-commerce has changed. It now uses custom post types and post attachments for the products.
    This is a good step forward but it also means all the code mentioned above no longer works.

    Good news is you don’t need to change any core files to get multi-image upload to work – you can upload multiple images by default. Without gold cart however it will only load the image set as the product thumbnail.

    As such I have written a new script to call the remaining images. It goes in wpsc-single_product.php.

    http://pastebin.com/0dJaE5aY

    • A note on the above post.

      In the script there is a function called `makethumburl()`.

      As explained it modifies the image url to include “-38×38” which means the rest of the code will call the image with size 38x38px for thumbnail use, instead of the full size which will cause v slow page loads.

      If you want to use a different thumbnail size you can change the string in the function to the size you want. Except this will only work if an image with such a size exists.

      WordPress automatically makes a bunch of different sizes when you upload an image and you can see which ones by browsing your wp-content/uploads folder and seeing the different sizes.

      If you want a size that is not there you can add it by using the add_image_size() function in your functions.php.

      • Hey Harry,

        Thanks for the tip! I have another question and hope you’ll advise.

        When I edit the product and add a new image by clicking ‘manage product images’ I select the image to add to the product gallery but then have to click “Use as product thumbnail’ which replaces the main picture as the new product picture.

        I can still click the thumbnail on the product page but how do I add new images without knocking the first one out?

        Thanks

    • Hello Harry, I want to show in my single_product all my product imagen when i clic the principal, but just show one image, y have more than one, you know why?
      Thanks

      • I also have the same problem😦
        Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in /home/a6217522/public_html/wordpress/wp-content/plugins/wp-e-commerce/wpsc-theme/wpsc-single_product.php on line 248

  6. Thanks again to Harry for the great hack.

    i will have a try soon .

    By the way , do u have any idea for Grid View for WP e-commerce 3.8 ?

  7. Does the replacing wpsc-products_page.php with wpsc-grid_view.php actually work?
    also does anyone know how to hide the description from the product page? (I show it on the single page)

  8. Hey Mani,
    Thanks for the nice article.
    @Harry — Thank you for the amazing multiple image upload script. It’s the one i have been searching for so long!!

  9. At first: Hi and sorry for my english🙂

    There is another way to add multiple images – without messing with the code.

    First step: when you are creating a new product, add first image with option “upload image”. This image will be used as product thumbnail.

    Next step: add another image with that option, and copy it’s URL. Then simply create link in HTML mode (in product description)… example:


    important is this: <a class="thickbox preview_link" rel="title" href="…

    It's only usefull when you have just few products with multiple images.

    Cheers!

    • I forgot that I can’t post code🙂

      #a class=”thickbox preview_link” rel=”title” href=”http://www.yoursite.com/wp-content/uploads/2011/07/image.jpg” target=”_blank”>
      #img src=”http://www.yoursite.com/wp-content/uploads/2011/07/image-148×148.jpg” alt=”red” />

  10. Pingback: WP e-Commerce

  11. Thanks for the function to display multiple images. Where would we be calling the function and where would we be pasting the code to?

  12. Hy,

    first thank you for the code, but it helped me just upload multiple images. They can be seen on single product page, but the lightbox is still showing just one picture. The other pictures are shown but they are openning in the same window when i click on them. Have you any solution how to get the rest of the pictures in lightbox?

    P.S. I used Harry G-s code.

  13. Hello Guys,

    I got the solutions for displaying thumbnail gallery on product details page.

    First of all make sure that you have installed gold cart plugin and in that you have enabled show thumbnail gallery.

    Upload multiple images to products and then for displaying image gallery you can use the below function.

    Thanks
    Guru Technolabs

  14. Hello There. I found your blog using msn.
    This is a really well written article. I’ll be sure to bookmark it and come back to read more of your useful information. Thanks for the post. I will certainly return.

  15. My partner and I stumbled over here different web address and thought I might check things out.
    I like what I see so now i am following you.
    Look forward to exploring your web page for a
    second time.

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