Position on Add To Cart

[ald0413]

Hello,

I am having trouble positioning ADD TO CART where my client would like it. If you look at this example page
http://shop. judiths tiles designs.com/index.php?main_page=product_info&cPath=4&products_id=23

the Add to Cart starts after the text ends. My client would like it directly under the photo, which happens only on pages that don't have enough text.

I have searched for a solution, but I'm having trouble with it. I'd appreciate any assistance.

Thank you.

[fw541c]

Most of your text never exceeds the height of the photograph. In my opinion the "add to Cart" should be floated "right". To make more sense, on the products were you have attributes, it is a little weird to pick the things you want then go back left to add to cart. You read left to right, and thats how your website should be setup. Plus i would assume that most of those items will be getting attributes soon, i think its in your best interest to place the add to cart to the right.

[badarac]

Move the div for add to cart just before the closing of the productMainImage div.

<div id="productMainImage" class="centeredContent back">
<script language="javascript" type="text/javascript">&amp;lt;!--
document.write('&amp;lt;a href="javascript:popupWindow(\'http://shop.judithstilesdesigns.com/index.php?main_page=popup_image&amp;amp;amp;pID=23\')"&amp;gt;&amp;lt;img src="images/OKLchelseapersimmon.jpg" alt="Persimmon Table Lamp" title=" Persimmon Table Lamp " width="304" height="600" /&amp;gt;&amp;lt;br /&amp;gt;&amp;lt;span class="imgLink"&amp;gt;view larger image&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;');
//--&amp;gt;</script><a href="javascript:popupWindow('http://shop.judithstilesdesigns.com/index.php?main_page=popup_image&amp;pID=23')"><img height="600" width="304" src="images/OKLchelseapersimmon.jpg" alt="Persimmon Table Lamp" title=" Persimmon Table Lamp "><br><span class="imgLink">view larger image</span></a>
<noscript>
&amp;lt;a href="http://shop.judithstilesdesigns.com/index.php?main_page=popup_image&amp;amp;amp;pID=23" target="_blank"&amp;gt;&amp;lt;img src="images/OKLchelseapersimmon.jpg" alt="Persimmon Table Lamp" title=" Persimmon Table Lamp " width="304" height="600" /&amp;gt;&amp;lt;br /&amp;gt;&amp;lt;span class="imgLink"&amp;gt;view larger image&amp;lt;/span&amp;gt;&amp;lt;/a&amp;gt;</noscript><div id="cartAdd">
    Add to Cart: <input type="text" name="cart_quantity" value="1" maxlength="6" size="4"><br><br><input type="hidden" name="products_id" value="23"><input type="image" src="includes/templates/freetemplate1/buttons/english/button_in_cart.gif" alt="Add to Cart" title=" Add to Cart ">          </div>
</div>

[ald0413]

Hello, Thank you very much for your response. I'm glad this is possible. I'm just having trouble figuring out what file I should be in.

I just looked at tpl_modules_productslisting
and tpl_product_info_display which I came to via the Developers tools and I didn't feel like I was in the right place as they only had addCart and not ProductMainImage ( which I can't seem to find in any .php files.

Thanks again.

[CoolCarPartsOnline]

Obviously you have done changes to the page. But your problem is your Add to Cart is floating behind the product description so since some images are larger than your description it takes it's place after the text.


You have to rearrange the product_info_display only. product_listing has nothing to do with this.

Your images div is above the title but that has nothing to do with it.

I suggest you add a <br class="clearBoth" /> behind the description div and edit your css to float the Add to Cart left.

[badarac]

Hello, Thank you very much for your response. I'm glad this is possible. I'm just having trouble figuring out what file I should be in.

I just looked at tpl_modules_productslisting
and tpl_product_info_display which I came to via the Developers tools and I didn't feel like I was in the right place as they only had addCart and not ProductMainImage ( which I can't seem to find in any .php files.

Thanks again.

You'll find this in tpl_product_info_display.php. Both sections are wrapped by begin and end comments. Look for <!--bof Add to Cart Box --> and <!--bof Main Product Image -->.

[ald0413]

Thank you very much for all this help, I've learning quite a lot about how to rearrange the product page by moving around segments of the code on this file.

Thanks everyone!