X-Cart forums

[Cello123]

Hello, i have been trying to figure out how to move the description and product variants UNDER the main product image and detail thumbnail images on the product detail page. I have tried some of the things stated on the forum that did not work.
I have V4.4.2 and im using the * vivid dreams chromo skin
I would like the Product Detail Page to show like this (everything under the main product image)
MAIN PRODUCT IMAGE
PRODUCT THUMBNAILS
PRODUCT VARIANTS/OPTIONS
PRICE, CART
DESCRIPTION
....AND OTHERS BELOW

Please if someone can tell me how to do this.

[cflsystems]

There are 2 templates - product.tpl and product_details.tpl - that you have to edit. You need to know html and css in order to make just one column instead of the 2 right now.

[Cello123]

Hello,
thanks for the reply cflsystems
yes i have already try to edit the product.tpl and product_details.tpl from a post on the forum here http://forum.x-cart.com/showthread.php?t=51819 , but it did not work, it made half of the main image show and product details were on the right still. Maybe i did not do it correct? maybe does not work correct for v4.4.2 chromo?
i know how to edit basic html and css, please if i can get your help or anyone else i would appreciate it.

[cflsystems]

Look at the divs and classes applied - some of them are float. Basically you have to take all the info and put it in one container

[Cello123]

Im going crazy on this !
Can someone please help me with code and or css & instructions for this in V4.4.2 chromo skin

[Cello123]

now i think the best way for the shop im doing would be order like:
DESCRIPTION (first)
MAIN PRODUCT IMAGE
PRODUCT THUMBNAILS
PRODUCT VARIANTS/OPTIONS
PRICE, CART
....AND OTHERS BELOW

* also is there a way to add a mandatory checkbox, in the product option area, so that the customer has to check i agree to the terms, and it will show in the payment invoice that they have checked i agree to the terms.

[Cello123]

any help ??

[davidswanson1]

Its very easy. I just did it to my store. Here are the steps

On /skin/customer/main/product.tpl
Make these changes

Change

<div class="details"{if $max_image_width gt 0} style="margin-left: {math equation="x+14" x=$max_image_width}px;"{/if}>

to
<div style="float:right">

You can see a sample on my store at:
http://shop.ccfdis.com/First-Data-FD-50Ti-Credit-Card-Terminal.html