product image tag

[baxter]

I ask shopsite if I could put an image to a subproduct and this is what they said
I don't have a clue about the code.
Would someone know how to code this



edit the
subproduct code within the product template directly so that the product
image is displayed.
I am not a designer, so I cannot give you the
exact code but I can tell you that you will be adding a product image tag to
the subproduct code.

Thanks
Jeff

[Jim]

What product template is being used for the products? You can tell by looking on Products > Edit product Layout. Or tell us what theme you are using. Preferences > Themes.

[baxter]

I am using the Default Product Template

[Jim]

The "Default Product Template" is a C based template that is build into the code and cannot be changed. Try using the "DefaultCustomProductTemplate" which is similar to the C based template but uses the custom template language so it could be edited. You will want to make sure that all of your products use this template.
Here is the code that is in the DefaultCustomProductTemplate for the Subproduct

Code: Select all

[-- DEFINE SUBPRODUCT --]
        [-- IF VAR.MoreInfoTemplate --]
               <div class="Subproduct"><form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method="post"
                [-- IF ANALYTICS_MULTI_DOMAIN --] onSubmit="javascript:__utmLinkPost(this)"
                [-- END_IF --]
               >
        [-- END_IF --]
        [-- INCLUDE Subproduct-Name PROCESS --]
        [-- INCLUDE Product-Price PROCESS --
        [-- IF PRODUCT.DisplayAddtoCart NE "Not Displayed" --]
              [-- INCLUDE Subproduct-AddToCartButton PROCESS --]
        [-- END_IF --]
        [-- IF VAR.MoreInfoTemplate --]
              </div>
        [-- END_IF --]
[-- END_DEFINE SUBPRODUCT --]

To add the product image to the code you would add this tag [-- Product.graphic --]. Depending on if you want the image above or below the product name you could place it before or after the line [-- INCLUDE Subproduct-Name PROCESS --] in the above section of code.

To make the change you need to go to Merchandising > Custom Templates > Page / Products and in the Products section click the Copy ShopSite Product Template.
Select the DefaultCustomProductTemplate from the list of templates and in the File Name of the new copy field enter "DefaultCustomProductTemplate1" note the 1 at the end of the name, don't include the quote marks. and click the Copy button.

Select the DefaultCustomProductTemplate1 from the list and click the Edit Product Template button. In the edit box find the tag [-- INCLUDE Subproduct-Name PROCESS --] which in my browser is at the start of the third line down. Add the tag [-- Product.graphic --] right before or just after the [-- INCLUDE Subproduct-Name PROCESS --] tag and click Save Changes.

Select the DefaultCustomProductTemplate1 from the list again and click the Copy Product Template button. This time give it the file name DefaultCustomProductTemplate (note the 1 is removed) and click Copy. By giving the file the same name as the original template file your edited version will be used instead of the ShopSite provided version.

Go to Utilities >Publish and click the Regenerate button which will publish your store using your version of the template instead of the ShopSite version. Your subproducts should now have the image by them. You might need to add a <br> or <p> tag before or after the template tag for the image to make the layout look a little nicer.