Multiple Product Images

4 posts from 2 voices

• Started 6 months ago by debtheweb
• Latest reply from Nick
• This topic is not a support question

Tags:

• product images

1. 

   debtheweb
   Member

   Hope you can help me resolve an issue with multiple product images. My website is http://www.inspiredchoice.biz.

   Firstly, I am trying to create multiple images on the product pages, similar to this theme:
   http://themeforest.net/item/wordpress-sold-responsiveecommerce-theme/full_screen_preview/3059355

   What I've managed to do is this:
   http://www.inspiredchoice.biz/shop/orchid-essence-beauty-moisturiser/

   I only want one large image on the page but have smaller thumbnail images below it that people can click on to change the main image. Like in the example above.

   I have one main image in the Featured Image box and added the other images to the Product Short Description area.

   Can you please tell me what I'm doing wrong. Or do I need an extra plugin for this sort of feature?

   Thanks,

   Debra

   Posted 6 months ago #
2. 

   Nick
   Moderator

   Hi,

   So you basically have two sets of thumbnail images and want one of them removed? Something like this -> http://i.imgur.com/aTv7q.jpg ?

   Thanks,

   Nick

   Posted 6 months ago #
3. 

   debtheweb
   Member

   Hi Nick,

   Yes that's correct. Is this possible?

   thanks,

   Debra

   Posted 6 months ago #
4. 

   Nick
   Moderator

   Hi,

   Yes, before we rip it out though, in the code there are directions saying that its a shortcode and you should look for it in the content of the page when you edit it. Here is what it says:
   

   This is a gallery, created with the default
   <a href="http://codex.wordpress.org/Gallery_Shortcode">WordPress Gallery Option</a>.
   The Image size of gallery pics is set automatically when the theme is activated,
   all you have to do then is to insert a gallery with a max of 7 columns to make
   it look like the one in the demo. Since this Page is a subpage, nested to the
   Templates page, a sidebar with all siblings appears by default.
   
   Shortcode:
   
   [gallery link="some-name" columns="some-number"]

   Do you see anything like the above shortcode when you edit that page.. it would be in the big content text area?

   If you don't see anything then please add this to the Quick CSS file in the admin backend > Abundance > Theme Options > Styling on the bottom of the page or to the custom.css file
   The css below will switch off the gallery.
   

   #top .summary .gallery{
   display: none !important;
   }

   The form with the item count and button is tricky, since there are many of them and grabbing the entire page worth of code and finding it a new home will require you to re-do the move each time the plugin will get updated.

   However the css below should work, though I can't be certain until you start adding different product types, then it will have to be tweaked a little. Also please add this to Quick CSS
   

   #top form.cart {
   position: absolute;
   left: 194px; /* lower the number, the higher it goes */
   top: 290px; /*lower the number , to left it goes*/
   }

   The words 'In Stock' can also be moved, however when something is out of stock, or any of the various messages WooCommerce displays it will be in its original position. Prior to using the code below see if its current location is to your liking. The code below will move those 2 words somewhere by the new location of the button we just moved in the earlier step:
   

   #top div .stock {
   color: hsl(80, 37%, 44%);
   position: absolute;
   top: 270px; /* lower the number, the higher it goes */
   left: 194px; /*lower the number , to left it goes*/
   }

   Thanks,

   Nick

   Posted 6 months ago #

RSS feed for this topic

Reply

You must log in to post.