How to make additional images look more presentable in product info page?

[keemeng]

Hi everyone,

I have added additional images in my product info page so that users can see different views of my product but when adding additional images it does not look very nice.

Is there a way to make the look of the additional images a lot more presentable?

Either by having a smaller thumbnail below or next to the main image that they can click or something that looks a lot smarter and more professional?

The bwlow image is how it looks now after adding an additional image. It looks like it is stuck inside a box.



Thanks!

[haredo]

Yes you can move the placement by following this tutorial:

https://www.zen-cart.com/tutorials/index.php?article=5

you will want to move the block of code additional images show below here:

<!--bof Additional Product Images -->
<?php
/**
 * display the products additional images
 */
  require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?>
<!--eof Additional Product Images -->

[keemeng]

Thanks for the quick reply Haredo. Following your instructions I manage to move the additional image around. But it is also moving that big box with it and all the white excess space around the addional image.

Is there a way I can remove the box and just move the additional image itself?

Thanks in advance.

[haredo]

I need a link to be more specific but i will try..

Look in your stylesheet.css for this:

.additionalImages {border: 1px solid #000000;}

post a link here without the http://www.
Or just PM me the link...

[haredo]

Ok , i finally found a site with additional images...

Look here in your stylesheet.css

#productAdditionalImages {
}

[keemeng]

Sorry for being a noob Haredo. I found it in the stylesheet_main.css file. After playing around with it I manage to remove the border!

Thanks for your help and guidance again. It took me down the right path.