Featured Product image size

[meperez]

www.thekitchentool.com
store id =30751

Hi Stefan/Eric, I'd like to increase the size of the product images on the store's front page. I tried changing the Product List text "[product.image tag='1']" to "<img src="[product.image tag='0']" width="200" />" in the overall text below, but that messed up the whole page. Can you help?

<div class="pl">
[product.each]
<div class="t1 col3">
<div class="bdr">
<h2><a href="[product.link]" title="[product.name]" style="text-decoration:none">[product.name]</a></h2>
<div class="thmb"><a href="[product.link]" title="[product.name]">[product.image tag='1'][</a></div>
<?php if ($product->saleprice > 0 && $product->saleprice < $product->price) { ?>
<div class="prc">
<medium>
Was: <span style="text-decoration: line-through;">[product.currency mode='sign'][product.price]</span><br />
Now: <span style="font-weight: bold; color:red;">[product.currency mode='sign'][product.saleprice]</span>
</medium>

[Eric]

Try adding this code your custom CSS ( The Factory > Your Store > Store menu > Custom CSS):

#view .pl .col3 .thmb {
    height: 210px;
    width: 200px;
}

#view .pl .col3 .thmb img {
    max-height: 200px;
    max-width: 200px;
}

[meperez]

Perfecto! Thanks!!

[brentmitchell]

how do you center the images in the boxes? i tried this, but no luck...

#view .pl .col3 .thmb {
    height: 210px;
    width: 200px;
<p style="text-align: center;">
}

#view .pl .col3 .thmb img {
    max-height: 200px;
    max-width: 200px;
  <p style="text-align: center;">
}

should i decrease the size of the images or will centering prevent it from going over the lines?

http://www.customplants.com/store/si...3901775747369/

[Eric]

Hi,

Your images are already centered but they are just too wide for the space they are in. Try reducing the width to something narrower like this:

#view .pl .col3 .thmb {
    height: 170px;
    width: 160px;
}

#view .pl .col3 .thmb img {
    max-height: 160px;
    max-width: 160px;
}

Eric