1-888-365-2779
+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / SiteMenu/SiteTabstrip/SotePanelbar

SiteMenu/SiteTabstrip/SotePanelbar

11 posts, 0 answered
  1. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post

    I am trying to create a very specific type of menu on my web page. This is what i want it to look like:

    Home            PageA            PageB

    HomeSub1    PageASub1     PageBSub1    
    HomeSub2    PageASub2     PageBSub2    
    HomeSub3    PageASub3     PageBSub3    

    However I want this to be displayed just like this, I don’t want to have anything collapse or no flowing dropdowns. I actually want to see all the links at the same time.

    Is there a way I can get that using one of the 3 provided navigation controls?

  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    18 Jun 2009
    Link to this post
    Hi Andrew,

    Below is an sample that will set all items as opened on Page_Load and all items will remain opened as shown in your post. The sample is prepared for RadMenu control. You can follow the same logic for the other controls you have.

    <script type="text/javascript"
        function OnClientLoad()  
        { 
            var menu = $find("<%= RadMenu1.ClientID %>"); 
            for (var i = 0; i < menu.get_allItems().length; i++) 
            { 
                menu.get_allItems()[i].open(); 
            } 
        } 
        function SkipClose(menu, args)  
        { 
            args.set_cancel(true); 
        } 
    </script> 
     
     
    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" /> 
    <telerik:RadMenu ID="RadMenu1" OnClientItemClosing"SkipClose" OnClientLoad="OnClientLoad" runat="server" DataSourceID="SitemapDataSource1" OnItemDataBound="RadMenu1_ItemDataBound"
    </telerik:RadMenu> 
     

    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post
    Hi Ivan,

    Thanks for that. It's almost porfect.
    Any way to prevent the menu from doing the unfold animation when page reloading?

    If i can get it to apear on all the time, that would be really perfect.

    Thanks Again.

    A
  4. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post

    Correction:

    I have changed the collapse and expand animation to ‘none’.

    Now it looks better, it still expands but quicker. I will probably leave it like that unless there is some way not to have it expand at all. Perhaps some code behind rather than javascript?

    Thanks

    A

  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    18 Jun 2009
    Link to this post
    Hi Andrew,

    The 1 second during the items expanding cannot be skipped. Another option is creating of hardcoded links in the html, but your menu will not be populated through SiteMapDataSource,

    Regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post
    Thanks.

    With regards to the indentation of the sub menu items.
    Is there a way to get rid of it. So that i can have the sub menu items directly under the menu items?

    Perhaps this can be changed in the css.

    Although i have changed the setting: EnableEmbeddedSkins to false. Whereby removing the style. (i think) however the indentation is still there.
  7. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    18 Jun 2009
    Link to this post
    Hello Andrew,

    You should create a custom skin. Take a look at RadMenu for ASP.NET AJAX.

    All the best,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post

    Thanks Ivan,

    I have created a new skin and changed the width of the items to be the same, now it looks nice and consistent. With the correct colours etc.

    However, i don't know how to get rid of the indentation. It appears that if i move the top level menu to the centre, the lower level menus shift to the right also. I simply don't know what i can do here to have sub menus aligned with the top menus.

  9. Andrew
    Andrew avatar
    202 posts
    Registered:
    05 Jun 2009
    18 Jun 2009
    Link to this post

    Ok, this is what i have done to solve the problem:
    I set the offsetX to "-20" by going to:

    edit template
    edit SiteMenu control
    misc
    menu edit button
    layout
    DefaultGroupSettings edit button
    offsetX = -20


    I am not sure if this was the correct way to do this, but it appears to align the menu correctly.

    Thanks for all your help Ivan.

    Regards

    Andrew

  10. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    02 Jul 2009
    Link to this post
    Ivan,

    I have a quick question with this. 

    How do I configure a SiteMenu control to only reveal its child pages when clicked. Now it reveals them when hovered upon. I do not want that. Also is there a easier way of changing the font and colours and all that. I try different things through the editor but some work some don't. Like the font - I change it in the Editor and makes no difference.

    Thanks

    Andrei
  11. Georgi
    Georgi avatar
    3583 posts
    Registered:
    28 Oct 2016
    08 Jul 2009
    Link to this post
    Hello Andrei,

    You should use the RadMenu Client Side API in order to achieve your first inquiry. The RadMenu is utilized by the SiteMenu control. Here are the basic steps you should take:
    1. Disable the expand
    2. Create an OnClick event, and take the item from the command arguments
    3. Use Item.Open method to open the selected item.

    As for your second inquiry, I am not sure which font colors you want to change. If you want to tweak the menu, then you can create a custom skin for that.

    Greetings,
    Georgi
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Register for webinar
11 posts, 0 answered