umbraco site menu navigation model

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

Sidz 4 posts 94 karma points

Jul 26, 2018 @ 10:48

Hi,

I have recently started a project using Umbraco, and implemented a site menu using navigation model described in codeshare blog. The below snippet works up till level 2 navigation , however I want to extend it to level 3 navigation.

@helper RenderSubItems(List

{


    foreach (var item in listItems)
    {


        <li>
            @if (!String.IsNullOrEmpty(item.Text))
            {@item.Text}
        else if (item.Link != null)
        {

            <a href="@item.Link.URL" target="@item.Link.Target" class="dropdown-toggle " data-toggle="dropdown" data-hover="dropdown" data-delay="0" data-close-others="false">@item.Link.Text <i class="fa fa-angle-down"></i></a>
        }
            @if (item.HasSubNavigation)

            {

            <ul class="dropdown-menu">
                <li> @RenderSubItems(item.NavItems)</li>


                    </ul>
                }

} }

}

Also I want to implement in the menu, if level 2 is further expandable to level 3, level 2 should not be navigable, but just a container for level 3.

Please help in this regard.

Copy Link

Derek 17 posts 71 karma points

Jul 26, 2018 @ 15:47
0
Hi Sidz,

I notice in the codeshare example the decision on whether a sub-navigation level should be added or not is controlled by the 'HasChildren' property:
```
 public bool HasChildren { get { return Items != null && Items.Any() && Items.Count > 0;  } }
```
This would suggest that anytime there are children under a node they will be rendered regardless of level.

In your example there is a 'HasSubNavigation' property controlling this functionality - does this differ from the HasChildren of the original?
Copy Link
Sidz 4 posts 94 karma points

Jul 27, 2018 @ 02:21
100
Hi Derek,

My HasSubNavigation has the same definition
```
 public bool HasSubNavigation { get { return NavItems != null && NavItems.Any() && NavItems.Count() > 0; } }
```
How to change the snippet in my partial view to render for third level?
Copy Link
Nigel Wilson 945 posts 2077 karma points

Jul 26, 2018 @ 19:22
0
Hi Sidz

One option is using the preconfigured "site map" partial in Umbraco - this I often use for multi level navigation.

To give it a spin:
1. Go to the settings section
2. Right click on Partial Views and click "Create"
3. Then "New Partial View from Snippet"
4. Select "Site Map"
5. Enter a name and click "Save"
Line 25 controls how many levels deep your navigation goes.

The one consideration in using this if you need to add customisation for the different levels, ie CSS classes. I often amend the "traverse" helper function and pass in an additional parameter.

Cheers

Nigel
Copy Link
Sidz 4 posts 94 karma points

Jul 27, 2018 @ 08:23

0

Hi Nigel,

My requirement to extend this site menu model to multi languages having separate nodes in umbraco back office for each language

Copy Link
Nigel Wilson 945 posts 2077 karma points

Jul 27, 2018 @ 17:46

0

Hi Derek

The sitemap will work fine for this scenario as it gets the "home" node and reads from there.

Cheers

Nigel

Copy Link
is working on a reply...

Please Sign in or register to post replies