Thumbnail size for Options

I am interested in the 50px product options thumbs (the ones that you click to select a product option, in my case fabric/color choose)

from what I can tell there are no settings in the admin for these thumbnails. They appear to be sized to a width of 50px, the hieght is not constrained, so I can have a taller than 50px image.

I want to be able to make these images wider than tall and to be able line them up horizontally beside the related text and radio button (i’m only using radio for these)

I realize that for allingment I will need to edit the related template file… but since the images are sized to 50px wide thumbnails and saved in ‘images/thumbnails’ the settings for the sizes must be either in the database or a config file…



Does anyone know where I can find this setting?

OK, so I have figured out how to change the product options template to allow the grouping of each option image with its related radio button in a list.



What I REALLY need to know is how I can change the size attributes for the thumbnails of the product options??

The size is set at 50px in the views/products/components product_options.tpl file. Around line 101 you’ll see - image_width=“50” - change this to whatever value you need. Greg

I’ve tried all the above and I finally got tha desired size (45 for me). But then when popup larger image opens tha thumb gallery at the bottom seems cut.!!

Any ideas about making the container of the gallery bigger(taller)?

I think I got around this by editing the css… tighten the padding and margins… etc.

O.K, i have the solution from our great CS-Cart Support Team

Please let me explain.

In order to change the image size you need to find the following part of code in the "product_images.tpl" file located in the "skins/[CUSTOMER_ACTIVE_SKIN]/customer/views/products/components" directory:

{assign var=“th_size” value=“34”}
{include file=“common_templates/previewer.tpl”}


and replace 34 with the desired value.


have fun!

Confirmed this works. But for me, this was the code in product_options.tpl

{capture name="variant_images"}
{if !$po.disabled && !$disabled}
{foreach from=$po.variants item="var"}
{if $var.image_pair.image_id}
{if $var.variant_id == $selected_variant}{assign var="_class" value="product-variant-image-selected"}{else}{assign var="_class" value="product-variant-image-unselected"}{/if}
{include file="common/image.tpl" class="$_class ty-product-options__image" images=$var.image_pair image_width="150" image_height="150" obj_id="variant_image_`$obj_prefix``$id`_`$po.option_id`_`$var.variant_id`" image_onclick="fn_set_option_value('`$obj_prefix``$id`', '`$po.option_id`', '`$var.variant_id`'); void(0);"}
{/if}
{/foreach}
{/if}
{/capture}
Also be sure to clear cache and generated thumbnails in the Administration/Storage menu.