Copied to clipboard

Flag this post as spam?

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


  • Saied 349 posts 674 karma points
    May 13, 2016 @ 17:29
    Saied
    0

    Showing parent nodes in Umbraco snippet

    Hi,

    I got the following snippet from the backoffice for creating a sitemap:

    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
    
    @{
    
    var selection = CurrentPage.Site();
    }
    <div class="sitemap">
     @Traverse(selection)
    </div>
    
    
    @helper Traverse(dynamic node)
    {
    @* Update the level to reflect how deep you want the sitemap to go *@
    var maxLevelForSitemap = 4;
    
    @* Select visible children *@
    var selection = node.Children.Where("Visible").Where("Level <= " + maxLevelForSitemap);
    
    @* If any items are returned, render a list *@
    if (selection.Any())
    {
        <ul>
    
            @foreach (var item in selection)
            {
    
                var hideFromSiteMap = item.hideFromSitemap;
    
                if (hideFromSiteMap != true)
                {
    
                    <li class="[email protected]">
                        <a href="@item.Url">@item.Name</a>
                        @* Run the traverse helper again for any child pages *@
                        @Traverse(item)
                    </li>
                }
            }
    
        </ul>
      }
    }
    

    I would like to show the root node. It doesn't look like this snippet does. I also would like to list the parent node for the selection once. I know it does list the parent node, but I only want to list it once and apply a class to it so it looks indented, so if there is a way to find the parent node of a selection of children, that would help to, but what is the best way to do this?

    Something like this is what I am looking for:

    • Home
      • Products
        • Product A
        • Product B
    • Support
      • FAQ

    Thanks Saied

  • Marc Goodson 2157 posts 14434 karma points MVP 9x c-trib
    May 15, 2016 @ 09:29
    Marc Goodson
    0

    Hi Saied

    var selection = CurrentPage.Site();
    

    is shorthand (when you using the dynamic approach) for the root page of the site the current page is in.

    So to add the root into this snippet, update the first bit to be:

    <div class="sitemap">
    <ul><li class="@selection.Level">
     @Traverse(selection)
    </li></ul>
    </div>
    

    Every node in Umbraco has a property called 'Level', that defines how deep inside the Umbraco Tree the element is positioned relative to the root of the site.

    So you can apply custom indentation based on this class:

    eg elements that are 2 deep will have

    <li class="level-2">

    and 3 deep

    <li class="level-3">

    and so on

    so you can target how far deeply these elements should be indented and style accordingly...

    if that makes sense...

  • Saied 349 posts 674 karma points
    May 17, 2016 @ 16:06
    Saied
    0

    marc, I think I got this, but it is not putting out the root (home) node. I was wondering if I could just hard code it at the top. It renders the parent nodes of other nodes, but I am talking about the root of the site (www.abc.com for example)

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies