an ASP.NET Open Source CMS & eCommerce platform
Skip Navigation LinksHome > DotShoppingCart Blog > Customization > Create Telerik alike menu in DotShoppingCart
Create Telerik alike menu in DotShoppingCart
I had one person asking how to implement Telerik alike menu in DotShoppingCart. In this post I will describe how you can use the dynamic image creating feature in DotShoppingCart along with some basic CSS tricks to archieve this.
1. Start off the Legacy Theme
2. Change Accent colors.
3. Update the menu CSS and add search box CSS in the Legacy Theme "App_Data\Themes\Themes_Template\Legacy\Default.css"
div.mainmenu a:link, div.mainmenu a:visited {
      background: url('/dyimage.axd?type=boxHeader&width=120&height=30&cornersize=0') no-repeat;
      float: left;
      margin-right: 1px;
      width: 120px;
      height: 30px;
      color: %Accent Fore Color%;
      font-weight: bold;
      text-decoration: none;
      text-align: center;
div.mainmenu a:active, div.mainmenu a.selected{
      background: url('/dyimage.axd?type=boxHeader&subtype=highlight&width=120&height=30&cornersize=0&gradient=False') no-repeat;
      color: %Accent Highlight Fore Color%;
div.mainmenu a:hover {
      background: url('/dyimage.axd?type=boxHeader&subtype=highlight&width=120&height=30&cornersize=0') no-repeat;
      color: %Accent Highlight Fore Color%;
td.searchBar {
    background: url('/dyimage.axd?type=boxHeader&width=1&height=30&cornersize=0') repeat;
    vertical-align: middle;
    border-right: solid 1px %Border Color%;
.searchShell {
    background:transparent url('/web/images/searchBoxBg.gif') no-repeat scroll 0;
.searchInputBox {
    border:0 none;
.searchButton {
    background:transparent none repeat scroll 0 0;
    border:0 none;
4. Update the search user control "Controls\Blocks\Search.ascx" to use the new search CSS.
<asp:Panel id="pnlBlockContent" runat="server">
    <div class="searchShell">
        <input type="text" class="searchInputBox" name="txtSearch" onkeydown="return GoSearch(event)" />
        <asp:Button id="btnDoSearch" runat="server" cssclass="searchButton" />
And finally you will get this.
Recent Comments
danny jones said ...
Hi... I am inexperiance to build up ECommenrce type sites.I have a little bits knowladge ...
molakaj said ...
What a great approach to the subject, I was looking for. Thanks for these tips http://www ...
jane said ...
Thank you for this useful information.
furnace parts said ...
Congrats on V4.0.....It is so easy to use  
Travis said ...
I just bought DSC Suite V4.5 and it is more solid then ever. I hope I am #1 buyer of this ...