gallery pictures

[sukiya]

hi everybody,

my question concerns the picture size in the product gallery.
now the sizes for the product gallery pictures are very small.
is it possible to change the sizes and also the quantity of the pictures?
now its possible to place 6 pictures in the gallery.
I would like to have only 3 or 4 – and the sizes should be bigger.

so please take a look at my page. I am talking about the 4 pictures under the main product picture.
http://www.eshop.sukiya.ch/?product=cocon-lamp-2

thanks a lot!

best wishes, Lisa

[Kyle – SUPPORT]

Hi

You will need to open functions.js in the js folder and go to line 733:

jQuery('#product-img-nav').flexslider({
				animation: "slide",
				directionNav: false,
				controlNav: false,
				animationLoop: false,
				slideshow: false,
				itemWidth: 70,
				itemMargin: 30,
				asNavFor: '#product-img-slider'
			});

You can change the item width and height

– Kyle

[sukiya]

hi kyle,

so I did.
I changed the itemWidth and itemMargin but in was on line 705 and 706.
so I think I did it wrong; now this is what happened:
http://www.eshop.sukiya.ch/?product_cat=light

I tried to go a step back and changed the itemWidth and itemMargin again to 70 and 30.
but nothing changed…..

I don’t know what is the mistake?

thanks a lot!
Lisa

[Kyle – SUPPORT]

Not sure what’s happened there. Please can you upload a fresh copy of the functions.js file?

– Kyle

[sukiya]

hi kyle,

thats what I tried, but nothing changed….

Lisa

[sukiya]

ok. now it worked.

but I did not manage to change the sizes of the gallery images.
maybe there was a mistake in step 1.

attached is the function.js:
so I changed line 705 and 706; – I think this was wrong.

in line 733 I find: “zoomWindowFadeOut:750”

So I am not sure where I should change the item width and high as you said before.

best wishes,
Lisa

[Kyle – SUPPORT]

If you just change the width value, something like 90 instead of 70, what happens then?

– Kyle

[sukiya]

I tried it. but now its the same like before- take a look….

http://www.eshop.sukiya.ch/?product_cat=light

Lisa

[Kyle – SUPPORT]

Ok then try css instead:

#product-img-nav li {
  width: 100px!important;
}

– Kyle

[sukiya]

thank you!
now it worked!!!

I also asked for the resolution of the product image (which is very low) – but for this question I already opened another topic…

best wishes,
Lisa

[Kyle – SUPPORT]

The resolution just depends on the size of images you upload

– Kyle

[sukiya]

hi kyle,

all my images have nearly the same resolution.

if you look at the attachments you can see what I mean.
on the product page the resolution is very low – but if I click on the image, the resolution of the image which pops up is very good.

so I don’t know why there is a difference although its the same image.

thanks a lot,
Lisa

[Kyle – SUPPORT]

Hi

The image is resized to 562px wide, if you want to change it then open up product-image.php in woocommerce/single-product and find this line:

$image = sf_aq_resize( $image_link, 562, NULL, true, false);

For me it is on line 103

Change the 562 value

– Kyle

[sukiya]

thank you kyle.
it works!

what do you think is the optimal image size for a webshop with this theme.

I am asking because although I don’t have so many images in the shop until now – the web site is a bit slow.

and also if I open it I can see for a short second the process of loading all the images in the background.
so this is a bit strange because it seems to stock a bit in the beginning.

and also now (if you look at the attachment) I have those lines in the middle of the image since I changed the image resize of the gallery images.

thanks a lot,
Lisa

[Kyle – SUPPORT]

Hi

As long as your images are bigger than 562px wide you will be fine 🙂

And I’m not seeing those lines

– Kyle