This is a migrated thread and some comments may be shown as answers.

Creating master page for navigation

3 Answers 95 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Joe Contreras
Top achievements
Rank 1
Joe Contreras asked on 16 Oct 2013, 05:42 PM
Hi,

I'm having problems creating a master page for site navigation and want to use the Telerik controls.  Can anyone assist on how I can do this?

This is what I have so far but it's getting confusing and need assistance:

<form id="form1" runat="server">
       <asp:ScriptManager ID="ScriptManager1" runat="server" />
       <!-- HEADER -->
       <header>
           <telerik:RadSearchBox ID="OMSearch" runat="server" Width="500" DropDownSettings-Height="200px" Skin="Windows7"></telerik:RadSearchBox>
           <br />
           <telerik:RadMenu ID="RadMenu1" runat="server" Skin="Windows7" Width="100%" Height="60" EnableShadows="true" style="top: 3px; left: 5px">
               <Items>
                   <telerik:RadMenuItem runat="server" NavigateUrl="~/Default.aspx" Text="Home" />
                   <telerik:RadMenuItem runat="server" Text="Wish List" />
                   <telerik:RadMenuItem runat="server" Text="Login" />
                   <telerik:RadMenuItem runat="server" Text="Shopping Cart" />                 
               </Items>
           </telerik:RadMenu>     
       </header>
       <!-- LEFT NAV -->
       <aside>
           <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Windows7" Width="150px">
               <Items>
                   <telerik:RadPanelItem Text="Products" Expanded="True">
                    <Items>
                           <telerik:RadPanelItem Text="Order From History" />
                           <telerik:RadPanelItem Text="Quick Entry" />
                           <telerik:RadPanelItem Text="Formularies" />
                           <telerik:RadPanelItem Text="My Mail" />
                           <telerik:RadPanelItem Text="Product Lookups" />                           
                       </Items>
                   </telerik:RadPanelItem>
                   <telerik:RadPanelItem Text="Specialties" Expanded="false">
                       <Items>
                           <telerik:RadPanelItem Text="Sales & Promotions" />
                           <telerik:RadPanelItem Text="Preferred Brands" />
                           <telerik:RadPanelItem Text="Catalog Request" />                         
                       </Items>
                   </telerik:RadPanelItem>
                   <telerik:RadPanelItem Text="Manufacturers">
                       <Items>
                           <telerik:RadPanelItem Text="My Contacts" />
                           <telerik:RadPanelItem Text="Address Cards" />
                           <telerik:RadPanelItem Text="Phone List" />
                           <telerik:RadPanelItem Text="Shared Contacts" />
                       </Items>
                   </telerik:RadPanelItem>
                   <telerik:RadPanelItem Text="Resource Center">
                       <Items>
                           <telerik:RadPanelItem Text="My Contacts" />
                           <telerik:RadPanelItem Text="Address Cards" />
                           <telerik:RadPanelItem Text="Phone List" />
                           <telerik:RadPanelItem Text="Shared Contacts" />
                       </Items>
                   </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="Specialty Sites">
                       <Items>
                           <telerik:RadPanelItem Text="My Contacts" />
                           <telerik:RadPanelItem Text="Address Cards" />
                           <telerik:RadPanelItem Text="Phone List" />
                           <telerik:RadPanelItem Text="Shared Contacts" />
                       </Items>
                   </telerik:RadPanelItem>
                    <telerik:RadPanelItem Text="My Account">                       
                   </telerik:RadPanelItem>
               </Items>
           </telerik:RadPanelBar>
       </aside>       
       <!-- CONTENT -->
       <section id="main">
           <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
           </asp:ContentPlaceHolder>
       </section>      
       <!-- FOOTER -->
       <div id="footerWrap">
           WebSite Footer Goes Here
       </div>
   </form>

3 Answers, 1 is accepted

Sort by
0
Kate
Telerik team
answered on 21 Oct 2013, 01:03 PM
Hello Joe,

Can you please clarify what is the specific issue that you are currently getting with the RadControls? Do you get any exception or a styling issue?

Regards,
Kate
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Joe Contreras
Top achievements
Rank 1
answered on 21 Oct 2013, 01:39 PM
Hi,

I need guidance on setting up or aligning menus with the search box as an example.  I'm trying to build an e-commerce site however your sample site does not work.

Regards,
0
Kate
Telerik team
answered on 24 Oct 2013, 12:15 PM
Hi Joe,

One approach that you can use is to place the different controls in div elements and position them as desired. For example you can set the desired styles as float or width and get the needed look. Here is some basic example that can help you get started.
<div style="float:left; width:500px">
         <telerik:RadSearchBox ID="OMSearch" runat="server" Width="500" DropDownSettings-Height="200px" Skin="Windows7" ></telerik:RadSearchBox>
        </div>
      <div style="float:left;width:700px">
         <telerik:RadMenu ID="RadMenu1" runat="server" Skin="Windows7" Width="100%" Height="60" EnableShadows="true" style="top: 3px; left: 5px">
             <Items>
                 <telerik:RadMenuItem runat="server" NavigateUrl="~/Default.aspx" Text="Home" />
                 <telerik:RadMenuItem runat="server" Text="Wish List" />
                 <telerik:RadMenuItem runat="server" Text="Login" />
                 <telerik:RadMenuItem runat="server" Text="Shopping Cart" />                
             </Items>
         </telerik:RadMenu>    
   </div>


Regards,
Kate
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
General Discussions
Asked by
Joe Contreras
Top achievements
Rank 1
Answers by
Kate
Telerik team
Joe Contreras
Top achievements
Rank 1
Share this question
or