Page 1 of 1

Customizing More Info page - Wrapping text

PostPosted: Sun Aug 01, 2010 9:29 am
by juniormintz
Hi -

I would like the more info page to have the text wrap around the graphic but I don't want the text to wrap around images in the regular product listings.

I'm confused after much research how to do this on the more info page. I see that [-- PAGE.Graphic REMOVE_HTML --] is supposed to allow you to customize, but I don't get what's next. I just want to do some margins and wrap text around the image.

My product template is the defaultcustomproducttemplate (partial below). Also, do I add html edits into this product template? Or do I create MoreInfoTemplate since I can't seem to find it. The changes I've done so far have been through the CSS and GUI but since all images for shopsite are hard coded img, the rules can't apply there.

Thanks in advance for your help!

http://transfernation.com/shopsite_sc/s ... shirt.html

#############################
[-- DEFINE MORE_INFO_PAGE --]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
#############################
[-- VAR.MoreInfo "yes" --]

[-- IF VAR.MoreInfoTemplate --]
[-- INCLUDE VAR.MoreInfoTemplate PROCESS --]
[-- ELSE --]
[-- INCLUDE Classic-MoreInfoPage PROCESS --]
[-- END_IF --]


[-- VAR.MoreInfo "" --]
[-- END_DEFINE MORE_INFO_PAGE --]

PostPosted: Mon Aug 02, 2010 10:40 am
by ShopSite Lauren
The template that you will want to modify is the Congruence-MoreInfoPage.sst template. You can find this template by going to Merchandising > Custom Templates > Includes > Copy ShopSite Include, and make a copy of the Congruence-MoreInfoPage.sst template. Next, make a copy of YOUR copy and name it the EXACT same name as the original so that it overrides the original.

Next, find the section of code in that template which looks similar to the following (note it might look slightly different because it looks like your store is a version 10 store, and this code is from a version 10 service pack 2 store).
<tr>
[-- IF PRODUCT.ImageAlignment "left" --]
[-- IF PRODUCT.MoreInformationGraphic --]
<td align="[-- PRODUCT.ImageAlignment --]">[-- MoreInfoImageRow --]</td>
[-- END_IF --]
[-- END_IF --]
[-- IF PRODUCT.ImageAlignment "center" --]
[-- IF PRODUCT.MoreInformationGraphic --]
<td align="[-- PRODUCT.ImageAlignment --]">[-- MoreInfoImageRow --]</td>
</tr>
<tr>
[-- END_IF --]
[-- END_IF --]
<td align="left" width="100%">
<span class="ProductDescription">[-- PRODUCT.MoreInformationText --]</span>
[-- IF WishList --][-- WishList --][-- END_IF --]
</td>
[-- IF PRODUCT.ImageAlignment "right" --]
[-- IF PRODUCT.MoreInformationGraphic --]
<td align="[-- PRODUCT.ImageAlignment --]">[-- MoreInfoImageRow --]</td>
[-- END_IF --]
[-- END_IF --]
</tr>

You will want to change the code so that instead of having 2 HTML cells, it instead has one cell where the image is aligned left with whatever spacing you would like. For example:

<tr>
<td align="[-- PRODUCT.ImageAlignment --]">
[-- IF PRODUCT.MoreInformationGraphic --]<img [-- PRODUCT.MoreInformationGraphic REMOVE_HTML --] align="left" style="padding: 0px 10px 10px 0px;">
[-- END_IF --]
<span class="ProductDescription">[-- PRODUCT.MoreInformationText --]</span>
[-- IF WishList --][-- WishList --][-- END_IF --]
</td>
</tr>

Re: Customizing More Info page - Wrapping text

PostPosted: Sat Aug 07, 2010 2:38 pm
by juniormintz
Thanks for your help. That totally worked.