Page 1 of 1

How to use thumbnail on category.

Posted: Wed Apr 02, 2008 2:55 am
by lasujah
Hi everyone,

In edit/add category, theres a "Thumbnail" field that allows you to select an image on Product Asset Manager. My problem is, I dont know how to use it on conlib (ex. SimpleCategoryList). I tried <%#Eval("Thumbnail")%> but returns 'CommerceBuilder.Catalog.Category' does not contain a property with the name 'Thumbnail' error. How do I use the "Thumbnail" field on Category so that I could have an image beside a category name on category listings?

Thanks.

Re: How to use thumbnail on category.

Posted: Wed Apr 02, 2008 7:56 am
by jmestep
Try ThumbnailURL.
This is a snippet from CategoryGridPage2.ascx:

Code: Select all

//OUTPUT LINKED THUMNAIL
                if (!string.IsNullOrEmpty(catalogNode.ThumbnailUrl))
                {
                    string thumbnail = string.Format("<a href=\"{0}\"><img src=\"{1}\" alt=\"{2}\" border=\"0\" class=\"Thumbnail\" /></a><br />", catalogNodeUrl, ResolveUrl(catalogNode.ThumbnailUrl), catalogNode.ThumbnailAltText);
                    itemTemplate1.Controls.Add(new LiteralControl(thumbnail));
                }

Re: How to use thumbnail on category.

Posted: Wed Apr 02, 2008 8:40 pm
by lasujah
thanks a lot! it worked.

This is my code on my ascx file.

Code: Select all

<%#ResolveClientUrl(Eval("ThumbnailUrl").ToString())%>

Re: How to use thumbnail on category.

Posted: Mon Apr 07, 2008 3:13 pm
by romac7
Hi Judy,
I've tried using the CategoryGridPage2 conlib but Categories don't appear, only Products,Links and Webpages.
Is code required for CategoryGridPage2.ascx to make categories with thumbnails show?
Regards,
Rom
jmestep wrote:Try ThumbnailURL.
This is a snippet from CategoryGridPage2.ascx:

Code: Select all

//OUTPUT LINKED THUMNAIL
                if (!string.IsNullOrEmpty(catalogNode.ThumbnailUrl))
                {
                    string thumbnail = string.Format("<a href=\"{0}\"><img src=\"{1}\" alt=\"{2}\" border=\"0\" class=\"Thumbnail\" /></a><br />", catalogNodeUrl, ResolveUrl(catalogNode.ThumbnailUrl), catalogNode.ThumbnailAltText);
                    itemTemplate1.Controls.Add(new LiteralControl(thumbnail));
                }

Re: How to use thumbnail on category.

Posted: Fri May 30, 2008 2:57 am
by creativespark
Hi Lasujah, Judy , Others.

I added the td tag in the categorygridpage2.ascx.cs file.
This below is my ascx file. Lasujah it does contain the Resolve tag you were saying but i guess i added to the wrong place as no thumbnail is coming... (and yes, there is a thumbnail for that category :-)) Please point out where exactly to put it and modifications if any.

Thanks.

Umesh Sethi
---------------------------------------------------------------------------------------------------------
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="CategoryGridPage2.ascx.cs" Inherits="ConLib_CategoryGridPage2" %>
<%--
<conlib>
<summary>A category page that displays all contents in a grid format. This page displays products, webpages, and links.</summary>
</conlib>
--%>
<%@ Register Src="~/ConLib/CategoryBreadCrumbs.ascx" TagName="CategoryBreadCrumbs" TagPrefix="uc" %>
<%@ Register Src="~/ConLib/CategorySearchSidebar.ascx" TagName="CategorySearchSidebar" TagPrefix="uc" %>
<%@ Register Src="~/ConLib/Utility/ProductPrice.ascx" TagName="ProductPrice" TagPrefix="uc" %>
<%@ Register Src="~/ConLib/AddToCartLink.ascx" TagName="AddToCartLink" TagPrefix="uc" %>
<ajax:UpdatePanel ID="SearchResultsAjaxPanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:PlaceHolder ID="CategoryHeaderPanel" runat="server" EnableViewState="false">
<uc:CategoryBreadCrumbs id="CategoryBreadCrumbs1" runat="server" HideLastNode="False" />
<div class="pageHeader">
<h1><asp:Literal ID="Caption" runat="server" EnableViewState="False"></asp:Literal></h1>
</div>

<table border="0" cellpadding="0" cellspacing="0" width="100%">

<tbody>

<tr>
<td class="linegapping"></td>
</tr>
<tr>
<td height="39" class="bg_blue"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="txt_white">New Customer&rsquo;s Special Offer >> Sign up to get an extra 10% off </td>
<td align="right" class="txt_black"><strong>* valid till 31&rsquo; May 2008&nbsp;&nbsp;</strong></td>
</tr>
</table></td>
</tr>
<tr>
<td class="linegapping"></td>

<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td><table width="707" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="238" background="Assets/CategoryImages/Main/main_box.jpg"><table width="98%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="58%"><img src="/Assets/CategoryImages/Main/cat7-womensfashion.jpg" width="370" height="218" /></td>
<td width="42%" valign="top"><p class="menu_txt_heading">Featured Fashion</p><br />
<br />

<p><span class="txt_menublack"><strong>Stylish Dress</strong></span><br /><br />

<span class="txt_menured"><strong>Stylish Partywear dress</strong></span></p>
<p><span class="txt_menublack"><strong>Dancing Feets</strong></span><br /><br />

<strong class="txt_menured">Shoes fit for a dancing queen</strong></p>
<p><span class="txt_menublack"><strong>Exquisite Jewelry </strong></span><br /><br />

<span class="txt_menured"><strong>Exquisite Jewelry </strong></span></p></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>


</tr>
</tbody>
</table>

<asp:PlaceHolder ID="SubCategoryPanel" runat="server" EnableViewState="false">
<div class="section">
<div class="content">
<asp:Repeater ID="SubCategoryRepeater" runat="server" EnableViewState="false">
<SeparatorTemplate>, </SeparatorTemplate>
<ItemTemplate><asp:HyperLink ID="SubCategoryLink" runat="server" Text='<%#String.Format("{0} ({1})", Eval("Name"), Eval("ProductCount"))%>' NavigateUrl='<%#Eval("NavigateUrl")%>'> <%#ResolveClientUrl(Eval("ThumbnailUrl").ToString())%></asp:HyperLink></ItemTemplate>
</asp:Repeater><br /><br />
</div>
</div>
</asp:PlaceHolder>
</asp:PlaceHolder>
<asp:PlaceHolder ID="phCategoryContents" runat="server">
<div class="searchSortHeader">
<table width="100%" cellpadding="3" cellspacing="0" border="0">
<tr>
<td align="left">
<asp:Localize ID="ResultIndexMessage" runat="server" Text="Displaying items {0} - {1} of {2}" EnableViewState="false"></asp:Localize>
</td>
<td align="right">
<asp:Label ID="SortResultsLabel" runat="server" Text="Sort:" SkinID="FieldHeader" EnableViewState="false" AssociatedControlID="SortResults"></asp:Label>&nbsp;
<asp:DropDownList ID="SortResults" runat="server" AutoPostBack="true" CssClass="sorting" EnableViewState="false">
<asp:ListItem Text="By Name (A -> Z)" Value="Name ASC"></asp:ListItem>
<asp:ListItem Text="By Name (Z -> A)" Value="Name DESC"></asp:ListItem>
<asp:ListItem Text="Featured" Value="IsFeatured DESC, Name ASC"></asp:ListItem>
<asp:ListItem Text="By Price (Low to High)" Value="Price ASC"></asp:ListItem>
<asp:ListItem Text="By Price (High to Low)" Value="Price DESC"></asp:ListItem>
<asp:ListItem Text="By Brand (A -> Z)" Value="Manufacturer ASC"></asp:ListItem>
<asp:ListItem Text="By Brand (Z -> A)" Value="Manufacturer DESC"></asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</div>
<!-- Top Bar -->
<div class="catalogWrapper">
<asp:DataList ID="CatalogNodeList" runat="server" RepeatColumns="3" RepeatDirection="Horizontal" Width="100%"
OnItemDataBound="CatalogNodeList_ItemDataBound" DataKeyField="CatalogNodeId" CssClass="catalog" EnableViewState="false" HorizontalAlign="Left">
<ItemStyle HorizontalAlign="center" VerticalAlign="bottom" Width="33%" CssClass="tableNode" />
<ItemTemplate>
<asp:PlaceHolder ID="phItemTemplate1" runat="server"></asp:PlaceHolder>
<uc:ProductPrice ID="Price" runat="server" Product='<%#Container.DataItem%>' />
<asp:PlaceHolder ID="phItemTemplate2" runat="server"></asp:PlaceHolder>
<div style="margin-top:10px;margin-bottom:20px" id="Add2CartLinkDiv" runat="server" visible='<%#((CatalogNodeType)Eval("CatalogNodeType")) == CatalogNodeType.Product %>'><uc:AddToCartLink ID="Add2Cart" runat="server" ProductId='<%#Eval("CatalogNodeId")%>' visible='<%#((CatalogNodeType)Eval("CatalogNodeType")) == CatalogNodeType.Product %>' /></div>
</ItemTemplate>
<SeparatorTemplate>&nbsp;</SeparatorTemplate>
<SeparatorStyle CssClass="separator" Width="1" />
</asp:DataList><br clear="all" />
<asp:PlaceHolder ID="PagerPanel" runat="server">
<div class="paging">
<asp:Repeater ID="PagerControls" runat="server" OnItemCommand="PagerControls_ItemCommand" EnableViewState="true">
<ItemTemplate>
<asp:LinkButton ID="PageLink" runat="server" Text='<%#Eval("Text")%>' CommandName="Page" CommandArgument='<%#Eval("PageIndex")%>' Enabled='<%#Eval("Enabled")%>'></asp:LinkButton>
</ItemTemplate>
</asp:Repeater>
</div>
</asp:PlaceHolder>
</div>
<asp:HiddenField ID="HiddenPageIndex" runat="server" Value="0" />
</asp:PlaceHolder>
<asp:PlaceHolder ID="phEmptyCategory" runat="server" Visible="false" EnableViewState="false">
<div align="center">
<asp:Localize ID="EmptyCategoryMessage" runat="server" Text="This category is empty." EnableViewState="false"></asp:Localize>
</div>
</asp:PlaceHolder>
</ContentTemplate>
</ajax:UpdatePanel>

Re: How to use thumbnail on category.

Posted: Fri May 30, 2008 7:01 am
by jmestep
It looks like categorygrid2 isn't coded to display categories:
<summary>A category page that displays all contents in a grid format. This page displays products, webpages, and links.</summary>
You would need to select a different display page or customized that one.

Re: How to use thumbnail on category.

Posted: Tue Jun 10, 2008 6:23 pm
by AbleMods
Use CategoryGrid3 or 4.

I use CategoryGrid4 for my site since I have multiple sub-categories under each root category.