Option Images

If you use images (swatches) to select product options e.g. colors or sizes you possibly noticed that if number of variants is greater than 6 or 7 then the line with swatches will break in quick viewer. See attached image “before.tiff”

[attachment=8264:before.tiff]



A small modification will solve this problem. See attached image “after.tiff”

[attachment=8265:after.tiff]



In template file design/themes/basic/templates/views/products/components/product_options.tpl

(or design/themes/responsive/templates/views/products/components/product_options.tpl for the latest cs-cart) find this code:



{foreach name="product_options" from=$product_options item="po"}




and add these lines after it



{assign var="var_count" value="`$po.variants|@count`"}
{if $var_count gt 6}{assign var="swatch_size" value="40"}
{else}{assign var="swatch_size" value="50"}
{/if}




Then find this code:


image_width="50" image_height="50"




and replace it with:


image_width="{$swatch_size}" image_height="{$swatch_size}"




Clear cache and enjoy

before.tiff

after.tiff