fixed start navigation

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

Thomaspark 5 posts 71 karma points

Feb 24, 2017 @ 20:47

Hi Guys,

I have been looking for information on who to create a fixed start navigation menu. So for example we have a page structure as follows;

Home About Product - Product1 - Product2 - Product3 Contact

I would like a second menu that only list the pages under 'Product' which will show all Products even on sub pages.

I have been looking at the Example Navigation which comes with Umbraco but can't figure it out.

I know I need to change the $currentPage but I'm not sure with.

    @inherits Umbraco.Web.Macros.PartialViewMacroPage' 

@*
    This snippet displays a list of links of the pages immediately under the top-most page in the content tree.
    This is the home page for a standard website.
    It also highlights the current active page/section in the navigation with the css class "current".
*@

@{ var selection = CurrentPage.Product().Children.Where("Visible"); }


@{ var selection = Product().Children.Where("Visible"); } - I don't have both of the lines in the live code these are the two I have tried.


<div class="menu">
    <ul>
    <li><a href="/">Home</a></li>
    @foreach (var item in selection)
    {
        <li class="@(item.IsAncestorOrSelf(CurrentPage) ? "current" : null)">
            <a href="@item.Url">@item.Name</a>
        </li>
    }
</ul>

Can anyone point out where I'm going wrong or point me in the Direction of a Guide or Page that might give some insight into what I need to do.

Kind Regards, Tom

Copy Link

Paul Wright (suedeapple) 277 posts 704 karma points

Feb 25, 2017 @ 13:07

In you "foreach" loop, you just need another loop, to check if that node has any "subpages".

You could fine grain it, so it only checks if the sub page is of a DocumentType "Product"

  var homePage = Model.Content.AncestorOrSelf(1);
// Or  var homePage =  Model.Content.Site();

var childNodes = homePage.Children().Where(x => x.IsVisible() && x.TemplateId != 0).OrderBy("sortOrder");

<nav>

    <ul>

        @foreach (var item in childNodes)
        {
            var products = item.Children().Where(x => x.IsVisible() && x.IsDocumentType("Product")).OrderBy("sortOrder");

            <li>
                <a href="@item.Url">@item.Name</a>

                @if (products.Any())
                {
                    <ul>
                        @foreach (var product in products)
                        {
                            <li>
                                <a href="@product.Url">@product.Name</a>
                            </li>
                        }
                    </ul>
                }
            </li>

        }

    </ul>

</nav>

Copy Link

is working on a reply...

Please Sign in or register to post replies