Tableless Layouts
Posted:
Wed Jan 12, 2011 10:59 am
by posty27
I'm redesigning my website with CSS determining the layouts of everything. While researching Custom Templates, the Cookbook suggests using tables to layout products. Can this be done using CSS instead? I'm assuming I can use the Shopsite tags within my <DIV> and </DIV> but I'm not sure how the tag [-- LOOP PRODUCTS --] would be implemented. Any thoughts?
Re: Tableless Layouts
Posted:
Wed Jan 12, 2011 2:17 pm
by Jim
You can use css for the layout of the product details, however some of the ShopSite template tags automatically output table formatted information. One such tag would be [-- product.quantitypricing --] which outputs a table displaying the various quantity breaks and the prices for each as well as descriptive text.
Many of the template tags include style definitions in the output so you will want to look at the output and create the css style using those names.
The [-- LOOP Product --] tag outputs what ever is defined by the [-- DEFINE PRODUCT --] section of the product template. It loops through all the products assigned to the page and for each product it outputs what ever is in the [-- DEFINE PRODUCT --] using the information for that particular product.
Basically you would just create the look you like in CSS and then put that information into the [-- DEFINE PRODUCT --] section replacing specific elements of your CSS with the template tag that outputs that information, i.e. product name, sku, description, price. graphic etc.