New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Server-side Templates

Asia
- Afghanistan
- China
- Iran
- Maldives
- Thailand
- Bangladesh
- India
- Iraq
- Philippines
- Yemen
Africa
- Algeria
- Ethiopia
- Kenya
- Mozambique
- Uganda
- Angola
- Gabon
- Madagascar
- Tanzania
- Zambia
- Cameroon
- Guinea
- Morocco
- Togo
- Zimbabwe
North America
- Barbados
- Costa Rica
- Guatemala
- Mexico
- Saint Lucia
- Belize
- Cuba
- Haiti
- Nicaragua
- The Bahamas
- Canada
- Grenada
- Honduras
- Panama
- United States
South America
- Argentina
- Chile
- Guyana
- Suriname
- Venezuela
- Bolivia
- Colombia
- Paraguay
- Uruguay
Europe
- Austria
- Denmark
- Germany
- Italy
- Russia
- Belgium
- England
- Greece
- Netherlands
- Spain
- Bulgaria
- France
- Hungary
- Romania
- Sweden
Australia
- South Australia
- Western Australia

About this demo
C#
VB
Download demo code files
Isolate this demo as a stand-alone application

RadMenu fully supports templates. You can embed any content inside a RadMenu template:

HTML markup
ASP.NET server controls
Third-party controls (other Telerik controls as well)

You can define two types of RadMenu templates:

1. Global Templates - template that is automatically applied to all items:

      <telerik:RadMenu ID="RadMenu1" runat="server">


             <ItemTemplate>


                   ... 


             </ItemTemplate>


   
      </telerik:RadMenu>

2. Per-item Template - template that overrides the global template on a item basis.

     <telerik:RadMenu ID="RadMenu1" runat="server">


        <telerik:RadMenuItem Text="Node">


            <ItemTemplate>


                   ...


            <ItemTemplate>


        </telerik:RadMenuItem>


     </telerik:RadMenu>

3. ContentTemplate - template that overrides the global template on a item basis and serves as a container for the child items of an item.

     <telerik:RadMenu ID="RadMenu1" runat="server">


        <telerik:RadMenuItem Text="Node">


            <ContentTemplate>


                   ...


            <ContentTemplate>


        </telerik:RadMenuItem>


     </telerik:RadMenu>

This example shows the usage of per-item templates - ContentTemplate and ItemTemplate.

<%@ Page Language="vb" AutoEventWireup="false" CodeFile="DefaultVB.aspx.vb" Inherits="Menu_Examples_Functionality_Templates_DefaultVB" %>
 
 
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
 
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
 
    <div class="demo-container">
        <telerik:RadMenu RenderMode="Lightweight" runat="server" ID="RadMenu1" Skin="Glow">
            <DefaultGroupSettings Height="270px" />
            <Items>
                <telerik:RadMenuItem Text="Asia">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap1" Skin="Glow" CssClass="itemContent asia">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="Afghanistan"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Bangladesh"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Cambodia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="China"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="India"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Indonesia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Iran"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Iraq"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Japan"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Maldives"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Philippines"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Saudi Arabia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Thailand"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Yemen"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="United Arab Emirates"></telerik:RadSiteMapNode>
 
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Africa">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap2" Skin="Glow" CssClass="itemContent africa">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="Algeria "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Angola "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Cameroon "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Ethiopia "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Gabon "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Guinea "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Kenya "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Madagascar "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Morocco "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Mozambique "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Tanzania "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Togo "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Uganda "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Zambia "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Zimbabwe"></telerik:RadSiteMapNode>
 
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="North America">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap3" Skin="Glow" CssClass="itemContent northAmerica">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="Barbados "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Belize "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Canada"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Costa Rica"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Cuba"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Grenada "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Guatemala "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Haiti "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Honduras "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Mexico"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Nicaragua "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Panama "></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Saint Lucia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="The Bahamas"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="United States"></telerik:RadSiteMapNode>
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="South America">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap4" Skin="Glow" CssClass="itemContent southAmerica">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="Argentina"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Bolivia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Brazil"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Chile"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Colombia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Ecuador"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Guyana"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Paraguay"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Peru"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Suriname"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Uruguay"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Trinidad and Tobago"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Venezuela"></telerik:RadSiteMapNode>
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Europe">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap5" Skin="Glow" CssClass="itemContent europe">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="Austria"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Belgium"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Bulgaria"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Denmark"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="England"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="France"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Germany"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Greece"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Hungary"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Italy"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Netherlands"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Romania"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Russia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Spain"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Sweden"></telerik:RadSiteMapNode>
 
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Australia">
                    <ContentTemplate>
                        <telerik:RadSiteMap runat="server" ID="RadSiteMap6" Skin="Glow" CssClass="itemContent australia" Height="170">
                            <DefaultLevelSettings ListLayout-RepeatColumns="3"></DefaultLevelSettings>
                            <Nodes>
                                <telerik:RadSiteMapNode Text="New South Wales"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Queensland"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="South Australia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Tasmania"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Victoria"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Western Australia"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Northern Territory"></telerik:RadSiteMapNode>
                                <telerik:RadSiteMapNode Text="Australian Capital Territory"></telerik:RadSiteMapNode>
                            </Nodes>
                        </telerik:RadSiteMap>
                    </ContentTemplate>
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenu>
    </div>
 
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Submit a support ticket if you have an active license or trial
Post in the forum if you don't have access to support

Server-side Templates

Related Resources

Support & Learning Resources

Find Assistance