Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Kate 267 posts 610 karma points
    May 11, 2014 @ 10:54
    Kate
    0

    Another menu problem

    Hi

    I need some help with a menu.
    I created a Umbraco 6.1.6

    You can view a html dummie of what I am looking for here: http://wasteofspace.dk/version4/
    The menu will function as follows:
    - The menu consists of max 4 levels (ex. Categories -> Css is a fix ... -> Css Item 14)
    - Menu item should only be clickable if there is no underneath menu-item
    - The last menu item should of course be clickable

    Hope you can help me ☺

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    May 11, 2014 @ 11:21
    Dennis Aaen
    100

    Hi Kate,

    I have taking a look on your HTML dummy and I think that I have some code that maybe could help you.

    As I remember you usually use the old dynmaic razor node, is it also the case here,if not let me know then. You could try something like this;

    @inherits umbraco.MacroEngines.DynamicNodeContext
    @{
       
    @*Get the root of the website *@
       
    var root =Model.AncestorOrSelf(1);
       
    var naviLevel =Model.Level();
    }
    <nav id="menu-wrap">
       
    <ul id="menu"class="level-@naviLevel">
           
    @foreach(var childPage in root.Children.Where("Visible"))
           
    {
               
    <li>
                   
    <img alt="menu navn" src="images/ikon1.png">
                       
    <a href="@childPage.Url">
                       
                           
    <h2>@childPage.Name</h2>
                            <span>Menu text</
    span>
                       
                       
    </a>
                        @* if the current page has any children, where the property umbracoNaviHide is not True *@
                        @if (childPage.Children.Where("Visible").Any())
                        {                    
                            @* Call our helper to display the children *@
                            @childPages(childPage.Children)
                        }
                </
    li>
           
    }
       
    </ul>
    </
    nav>

    @helper childPages(dynamic pages)
       
    {
       
    @*Ensure that we have a collection of pages *@
       
    if(pages.Any())
       
    {
           
    @*Get the first page in pages andget the level *@
           
    var naviLevel = pages.First().Level;
           
    @*Addin level for a CSS hook *@
           
           
    <ul class="level-@naviLevel">
               
    <li class="columHeadline">overskrift 1.1</li>
                @foreach (var page in pages.Where("Visible"))
                {
                    <li>
                        <a href="@page.Url">@page.Name</
    a>
                       
                       
    @*if the current page has any children,where the property umbracoNaviHide isnotTrue*@
                       
    @if(page.Children.Where("Visible").Any())
                       
    {                        
                           
    @*Callour helper to display the children *@
                           
    @childPages(page.Children)
                       
    }
                   
    </li>
                }
            </
    ul>
       
    }
    }

    And depending on the content structure, you will ned to make some small changes. I my case I start at level 1. But if you for instance have an multi language site, and the first node are the languages you need to change it to var root = Model.AncestorOrSelf(2).

    Hope this helps,

    /Dennis

  • Kate 267 posts 610 karma points
    May 11, 2014 @ 11:45
    Kate
    1

    Hi Dennis

    It works perfectly.
    As you mentioned I have to change the Model.AncesterOrSelft and I have added a few classes. But it works.

    Thanks for your help :-)

    /Kate

Please Sign in or register to post replies

Write your reply to:

Draft