Last call to make your voice heard! Our 2022 Developer Survey closes in less than a week. Take survey.
61 votes
Accepted

How to link to previous/next entries in a section?

You are probably not using this within a craft.entries loop. Position it inside a loop or set custom parameters for your prev and next elements: {# Set parameters for prev/next elements list #} {% ...
user avatar
  • 35.8k
34 votes
Accepted

How can I add a dynamic "active" CSS class to the navigation on any given page?

Tip: To keep it short and reusable I would recommend that you wrap your preferred "check-method" in a Twig macro, I like Anna's version the most: _macros.html: {% macro is_active(segment) %}{% if ...
user avatar
  • 8,316
32 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

Assuming you use a structure called pages to create your navigation and the entry variable represents the currently viewed entry, you can output your navigation and active state as follows: <ul&...
user avatar
  • 6,156
32 votes

Add home page to a structure?

This isn't documented, so it's subject to change: When you set a Single to be the homepage, its slug is automatically set to __home__. If you want your homepage to be part of a Structure, rather ...
user avatar
  • 3,390
29 votes
Accepted

How can I build a language switcher?

I am building my first multi-language site with Craft as well. This is from a thread over at Google+, so I didn't come up with this myself but it works very well: {% block locale__switch %} {# ...
user avatar
  • 490
20 votes

How to link to previous/next entries in a section?

You can set the prev.url at the top of the template, for example: {% set criteria = {section: 'blog', order: 'postDate'} %} {% set prev = entry.getPrev(criteria) %} Add a link if prev is available: ...
user avatar
19 votes
Accepted

How to write a simple navigation?

My solution is to setup a dedicated "Menu" section and use an entries field type for the links. This allows you to pull together entries from multiple sections into a single menu. My normal setup is ...
user avatar
19 votes
Accepted

How do you handle complex navigation in Craft?

If the {% nav %} tag doesn't give you enough control over the output, you can always replicate the behavior with custom loops and the getChildren() method. Just nest them as far as your navigation ...
user avatar
  • 35.8k
18 votes
Accepted

Adding active class to globally cached navigation

Yes, you can! The first thing you need to do is to add the entire cached content into a single variable: {% set navigation %} {% cache globally for 3 years %} {# YOUR CACHED CONTENT #} ...
user avatar
  • 2,824
17 votes
Accepted

How do you only show children of "active" parent in a Structure section's nav?

A recursive macro will help you get around the limitations of ifchildren (which P&T will hopefully resolve soon), as follows: {% set mainEntry = craft.entries.slug(craft.request.getSegment(1))....
user avatar
  • 6,156
15 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

craft.request is useful for setting an "active" class based on URL segments. If your URL was: domain.com/sale/products/shirts You could write conditionals like the following to target each segment: ...
user avatar
  • 2,455
15 votes
Accepted

How do I create a locale dropdown to switch between languages?

This is because you loop through all but the current locales. Remove the without filter to loop them all. {% set otherLocales = craft.i18n.getSiteLocaleIds()|without(craft.locale) %} . Add "...
user avatar
  • 35.8k
14 votes

How to write a simple navigation?

I pulled together this brain-dump of 8 different ways of doing navigation. There's probably more. With any method make sure you keep a close eye on the query count and load speed, as some of these ...
user avatar
  • 3,829
14 votes

How can I build a language switcher?

I have changed the above code a little bit because it causes an error when I have for example a website with three active locales and an entry with only one or two active locales. The error is: ...
user avatar
14 votes
Accepted

Add home page to a structure?

The "this is for the homepage" button available on single sections does two things for you, when you navigate to the home page's URL: it populates the entry variable with the single's entry model it ...
user avatar
  • 35.8k
13 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

Barrel Strength also have a URL segment based plugin called Sprout Active, with docs/examples here.
user avatar
  • 3,901
13 votes
Accepted

What is the best way to create breadcrumbs based on a structure?

Got it! {% if craft.request.segments %} <nav class="breadcrubs"> <div class="container"> <div class="row"> <ol class="breadcrumb"> <...
user avatar
12 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

Here's yet another way you can do it (in some circumstances) and it's nice and DRY: Craft 2 {% if craft.request.getPath() == entry.uri %} Craft 3 {% if craft.app.request.pathInfo == entry.uri %}
user avatar
  • 2,975
12 votes
Accepted

Would you use a Structure as navigation over multiple sections (channel entries, indexes and singles)?

Structure for "sorting-only" I haven't tried the approach that you are thinking of yet, but your concerns regarding the query count are not that unfounded. You would need to use the relatedTo() ...
user avatar
  • 35.8k
11 votes

Automatic in-page navigation plugin?

If I'm understanding you correctly, you want users when they visit your site to have a secondary menu that has links to various points in the article. That would actually be very easy to do in Craft. ...
user avatar
11 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

In your template you can set a var in twig: {% set active = 'blog' %} And then in your navigation you can run an if statement to see what the var is <nav> <a {% if active = 'homepage' %...
user avatar
10 votes

How can I build a language switcher?

Thought I would share my language switcher, as it shows languages in their native name. <nav class="nav nav--locale"> <ul> {% set locales = craft.i18n.getSiteLocales() %} ...
user avatar
  • 301
9 votes

How can I build a language switcher?

I've created a plugin which makes it incredibly easy to add language-switching links to your website... Language Link plugin for Craft CMS Standard Usage Add this to your _layout, or create a ...
user avatar
  • 23.6k
9 votes

Multi-lingual site navigation made of singles, channels and structure

I have one main structure "pages" and got rid of all single sections. I also gave each channel's index page an entry in the structure (good for URL translation). Then I added some entry types to it (...
user avatar
  • 35.8k
9 votes
Accepted

Structure - Add class if element has children

The Methods section on the EntryModel documentation page has a lot of useful things for working with navigation for Structure sections. You can use hasDescendants(): {% if entry.hasDescendants() %}...
user avatar
  • 2,975
9 votes

Custom or complex nav tag

You'll want to make use of the level property of your entry... {% if entry.level == 1 %} <!-- Top Level Links --> {% else %} <!-- Child Links --> {% endif %}
user avatar
  • 23.6k
8 votes

How to write a simple navigation?

In some cases I use a pre-defined (very simple) nav that I don't need to be driven from the CMS yet I want to share it between the header / footer. In these cases I'll set an array in my base layout ...
user avatar
  • 329
8 votes
Accepted

Dymanic 'active' class using nav tag looping through a structure

My recommendation is to match the slugs as opposed to the ids as this is much easier to debug. <ul id="slide-in"> {% nav menu in craft.entries.section('mainMenu') %} DEBUG: Entry....
user avatar
  • 769
7 votes

How to write a simple navigation?

If you have more complex menus in the future, you should take a look at the Nav-Tag. . Getting singles: There isn't an easy way to get singles (yet). But you can use the same method which is used ...
user avatar
  • 8,316
7 votes

How can I add a dynamic "active" CSS class to the navigation on any given page?

Another way to achieve this: {% for entry in entries %} {% set active = craft.request.path ~ '/' matches "|^#{entry.uri}/|" %} <a href="{{ entry.url }}" class="{{ active ? 'is-...
user avatar
  • 3,051

Only top scored, non community-wiki answers of a minimum length are eligible