Modifying the layout of product.tpl
 

Hello i'm trying to change the layout of product.tpl so that i can show a large image of the product but not shunt the whole page off the screen to the right.

So maybe have the image above the "Detailed description" like this :-

http://www.bespoke-dance-shoes.co.uk/xcart/images/producttemplate.jpg

sorry it's a bit long, i'm also thinking about how to allow the customers to read the shoe ranges text (there's so much of it !) but allow them to customize their selected shoe model quickly.

i've tried copying and pasteing the code in product.tpl into the positions i want but i just get errors.8O

any help appreciated.

Re: Modifying the layout of product.tpl
 

product.tpl has a lot of {if} statements that can easily break if you aren't careful. It is a tough page to edit, you just need to keep trying. I'd suggest using Dreamweaver to help you see the table layouts, that is a least a start!

Re: Modifying the layout of product.tpl
 

thanks I was using dreamweaver, but like you say it's a bit fiddly to edit that .tpl

Re: Modifying the layout of product.tpl
 

I'm currently setting up our page and modifying its contents. I've found a best practice is to comment out bits of code or duplicate the page entirely. That way the original code stays intact, should you seriously FUBAR something.

That being said, and balinor correct me if I'm wrong, but product.tpl handles how each product's page will be laid out, whereas products.tpl determines the layout of product listings on the main page.

(I recently wasted an hour wanting to update products.tpl, but working in product.tpl instead and pulling my hair out!)

Re: Modifying the layout of product.tpl
 

When in doubt, use webmaster mode or reference this thread:

http://forum.x-cart.com/showthread.php?t=21529

Re: Modifying the layout of product.tpl
 

Is there a program we can use from our desktop to edit the tpl files? decides dreamweaver. One that we can see what the layout looks like while still being able to edit the code?

Re: Modifying the layout of product.tpl
 

No, if you want to see the table layout, DW is your best bet. But you really should edit the code in a code editor like UltraEdit.

Re: Modifying the layout of product.tpl
 

There is also a firefox addon that allows you to outline tables and/or table cells. It is called Web Developer. Using that in combination with Firebug makes it easier to see the numberous embedded tables & table cells.

Re: Modifying the layout of product.tpl
 

How does one remove the CSS styling to the detailed description area? want to add my own html product layout so that all text appears exactly as it was made in dreamweaver! if i copy the html code straight into detailed description at the moment it just reverts to x-carts font size, width, font colour etc!

any suggestions appreciated,