2

How to create menus from admin panel of Craft 3 so I can render into frontend header and footer?

4
  • The same way like you do it with craft 2. You pull all your entries and render them in your preferred way. You would usually create an entry type pages and pull them. This is a recursive macro that creates an n-dimensional menu pastebin.com/Jm3ujhD7 Nov 6 '17 at 12:59
  • Note: the link is about craft 2, for craft 3 you have to replace .first() with .one() and find() with .all() other than that it's the same Nov 6 '17 at 13:07
  • Actually I am new in craftcms, and I have created Single type entry for the home page and I have also created channels for entries, but basically I want specific menu pages on frontend. Is there any other suggestion to render menu? Nov 6 '17 at 13:22
  • 1
    You can add a field (eg checkbox) into these entries like showInMenu then you would search for all entries that are checked {% set menuEntries = craft.entries.section('your-handle').showInMenu('1').all() %} menuEntries is now an array of these models. You can loop through it and render all entries Nov 6 '17 at 13:30
3

For Craft 2, a number of plugins exist that assist with building navigational structures. None of those has been made available for Craft 3 (yet), but one plugin-less option (thanks to Ben Parizek, who let me in on this) would be, to create a 'navigation' section (structure), in which you can create navigation entries (= navigation items) that you can than drag and drop to get the right navigational structure.

Each entry in this section has, for example:

  • A field that connects it to another entry
  • A field that let's the user add a url to navigate to
  • Any other field that would let the user alter the navigation's behaviour (color, open in new window, etc)

After that, it would be up to you to translate this structure to a navigation in your template(s).

1

A super simple process would be to just use a single Structure called "Pages", similar to what Paul said, (or whatever you want). Just attach a lightswitch field to it like the following:

enter image description here

Then in your markup you could do something like this:

<ul>
{# Get top-level entries in pages structure (exclude home page)  #}
{% set pages = craft.entries.section( 'pages' ).id( 'not 1' ).level( 1 ).hideFromNavigation( 'not 1' ).includeInTopNavigation( 1 ) %}
    {# Loop through top-level entries #}
    {% for page in pages %}
        <li>
            <a href="{{ page.getUrl }}">
                {{ page.title }}
            </a>
        </li>
    {% endfor %}
</ul>

The screenshot/code is from Craft 2 but the same concept applies to 3 as well.

2
  • 1
    Yes, But I have created globals for the same. Mar 8 '18 at 5:47
  • That works too. A global Entry field could essential do the same thing! Mar 16 '18 at 23:56
1

CraftCMS doesn't come with such functionality by default. In Craft 2, we had some nice plugins but not available in Craft 3 so far.

You can achieve this by Categories with "Category Tree" plugin which adds drag n drop to categories with full control from admin and its very easy to pull your category group at front-end.

{% set categories = craft.categorytree.getTree() %}
{% for category in categories %}
  <ul>
     <li>{{ category.model.slug }}</li>
     {% if category.children is defined %}
       <ul>
         {% for category in category.children %}
           <li>{{ category.model.slug }}</li>
         {% endfor %}
      </ul>
    {% endif %}
 </ul>
{% endfor %}

Reference Link: https://github.com/pdaleramirez/category-tree

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.