How to create a variable to display in the Product Description?


We operate a clothing store and dozens of groups of our products use specific sizing charts.

i.e. a chart for mini dresses, and chart for blouses etc.

Instead of repeating these identical charts (html tables and text) in each product description of 100s of products, we would like to use a variable instead.

Something along the lines of this:


So $sizechart-minidress would be replaced by HTML - from a simple text statement, to a more complex table showing body sizes and measurements etc.

Does anyone have any pointers to how this is achieved? Where would the variables be declared and created so they can be simply displayed in any desired product_description field?


Unfortunately you cannot use variables in the product description. I think the only way would be to use Product Tabs, unfortunately it’s not fully impemented yet, and apparently will be available properly in a future update.

There is however a workaround thanks to SnoRocket, it’s a bit long winded but might get you out of trouble, [url][/url]

Outside of a custom tab solution, the only thing I can think of is setting a variable in the element to identify specific product IDs and then using CSS to specify a background image based upon the product ID.

This is more long winded and clunky but will work.

For example

will show something like this if viewing a product page:

Then using CSS and background images, a specific image can be called based on the product being viewed.

#prod120 {
backgorund:url(../images/minidress.gif) 0 0 no-repeat;

Of course an HTML element will need to be added to the product details template and then specified in the CSS.

In the views/products/view.tpl file inside your customer skin, you can add a DIV to serve as the container for your background image.

maybe below the product image block add something like:

Then in your CSS file make the rulesets specific:

#size-chart {
/* specify the width and height of the size chart images and other CSS styles and positioning rules here */

#prod120 #size-chart {
backgorund:url(../images/minidress.gif) 0 0 no-repeat;

#prod125 #size-chart,
#prod300 #size-chart {
backgorund:url(../images/blouses.gif) 0 0 no-repeat;

tedious work if you have many images, but doable.