Recent products: Table showing HTML on page.

[SPS]

Hello,

On all our pages the new feature 'Recent Products' we have a table showing HTML above the recent products.

CSS issue?

Have tried using this post:-
http://community.actinic.com/showthread.php?t=47459

http://www.smartpackagingstore.co.uk/index.html
code that is showing:-

**sRecentPrefix** <!-- Prefix to Horizontal recent item list HTML -->

<br/><br/>
<div class="recenththeader">
<input class="recenthtbuttonright" id="scrollbackrecent" type="button" value=" Next >>" onclick="ScrollBackRecent();">
<input class="recenthtbuttonleft" id="scrollforwardrecent" type="button" value="<< Previous" onclick="ScrollForwardRecent();">
<div style="text-align:center">Recently Viewed</div>
</div>
<br clear="all"/>
<table cellspacing="0" id="recenthtitem">

**sRecentImageRowPrefix** <!-- Prefix to image row -->

<tr><td class="recenthtitemspacer" rowspan=4>&nbsp;</td>

**sRecentImageItem** <!-- Image item -->

<td class="recenthtitemimage">
<a _HREF_="_SSURL_?PRODREF=_PID_&NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&SHOP=<actinic:variable name="ShopID" /></actinic:block>" >
<img border="0" width="75" src="_THUMB_" alt="_NAME_" />
</a>
</td>
<td class="recenthtitemspacer" rowspan=4>&nbsp;</td>

**sRecentImageRowSuffix** <!-- Suffix to image row -->

</tr>

**sRecentDescRowPrefix** <!-- Prefix to Description row -->

<tr>

**sRecentDescItem** <!-- Description item -->

<td class="recenthtitemdesc"><a _HREF_="_SSURL_?PRODREF=_PID_&NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&SHOP=<actinic:variable name="ShopID" /></actinic:block>" >_NAME_</a></td>

**sRecentDescRowSuffix** <!-- Suffix to Description row -->

**sRecentPriceRowPrefix** <!-- Prefix to Price row -->

<actinic:block if="%3cactinic%3avariable%20name%3d%22RecentlyViewedListShowFullRetailPrice%22%20%2f%3e" ><tr></actinic:block>

**sRecentPriceItem** <!-- Price item -->

<actinic:block if="%3cactinic%3avariable%20name%3d%22RecentlyViewedListShowFullRetailPrice%22%20%2f%3e" ><td class="recenthtitemprice">_PRICE_</td></actinic:block>

**sRecentPriceRowSuffix** <!-- Suffix to Price row -->

<actinic:block if="%3cactinic%3avariable%20name%3d%22RecentlyViewedListShowFullRetailPrice%22%20%2f%3e" ></tr></actinic:block>

**sRecentDeleteRowPrefix** <!-- Prefix to Delete row -->

<tr>

**sRecentDeleteItem** <!-- Delete button -->

<td class="recenthtitemdelete">
<a href="javascripteleteRecent('_PID_', true);">
<img src="xit.jpg" border="0" />
</a>
</td>

**sRecentDeleteRowSuffix** <!-- Suffix to Delete row -->

</tr>

**sRecentSuffix** <!-- Suffix to Horizontal recent item list HTML -->

</table>

**sRecentEmptyList** <!-- Code for empty list -->

[leehack]

I suspect that on upgrade your css has not been updated to include the recent product css, it's probably all missing, add this into your stylesheet and see if that fixes it:

/* Recently Viewed Products List Style ------------------------------------ */
<actinic:block if="%3cactinic%3avariable%20name%3d%22RecentlyViewedListIsEnabled%22%20%2f%3e%20%3d%3d%20True">
#rphtml {
	display: none; 
	visibility:hidden;
} /* Used internally - do not delete */
#recenthtlist {
	width: 500px;
	text-align:left;
}
#recenthtitem {
	border-spacing: 0px;
}
#recenthtitem td {
	width: 110px;
	padding: 4px;
	text-align: center;
	border-left: 1px solid <actinic:variable name="Palette3" />;
	border-right:1px solid <actinic:variable name="Palette3" />;
}
.recenthtitemimage {
	border-top: 1px solid <actinic:variable name="Palette3" />;
}
.recenthtitemdelete {
	border-bottom: 1px solid <actinic:variable name="Palette3" />;
}
.recenthtitemspacer {
	width:2px !important; 
	border:0 !important;
	padding: 0px !important;
}
.recenththeader {
	padding: 3px; font-size: <actinic:variable name="LargeFontSize" />;
	font-weight: 900; margin: 0px; color: <actinic:variable name="Palette2" />;
	width: 496px; border-top: 1px solid <actinic:variable name="Palette3" />;
	border-bottom: 1px solid <actinic:variable name="Palette3" />;
}
.recenthtbuttonleft {
	float: left;
	cursor: pointer;
	width: 100px;
	border: 0;
	background-color: <actinic:variable name="BGColor"/>;
}
.recenthtbuttonright {
	float: right;
	cursor: pointer;
	width: 100px;
	border: 0;
	background-color: <actinic:variable name="BGColor"/>;
	}
</actinic:block>
/************************************************************************************/

In your overall layout you then just want:

<actinic:block if="%3cactinic%3avariable%20name%3d%22RecentlyViewedListIsEnabled%22%20%2f%3e%20%3d%3d%20True" ><actinic:variable name="RecentProducts" /></actinic:block>

after INNERLAYOUT in the code.

I'm not sure what all that code is you have provided, suffice to say doing just the above will get it all working for you and you can forget that lot.

[SPS]

Thank you, this has sorted the issue.

[SPS]

Just a quick one, I have now 2x tables of recently added products after following the above instruction, they are on top of each other.

Would this of been the code I added to the CSS.

[leehack]

Nope that will be the duplication of the layout you've added, remove one of them ie undo step two.