JSON: templates

This file contains an array of template objects.

'struct'

The 'struct' part of the template object is either a string (for the bits surrounding the menu) or a keyed-array of similar strings within one of the lvl objects.

This string simply tells Flexwalker when to open and to close tags, using the id of a tag within tags.json. There is one reserved word, 'walker', which inserts the wp_nav_menu return when used in the top struct. Otherwise, the string is a nesting key, with '/' used to close the last opened tag. In pseudo code, using the id as the tag, this struct:

nav toggle toggleicon / / walker /

Turns into this code

<nav>
    <toggle>
        <toggleicon></toggleicon>
    </toggle>
    <!-- returned menu from Flexwalker_Walker -->
</nav>

Note that within the lvl objects, there are opening and close structs for 'lvl' and 'el'. See below for an explanation of how they work.

Template Object

A template object looks like this:

{
    "id": "yourid",
    "depth": 1,
    "struct": "nav toggle toggleicon / / walker /",
    "lvl": []
}

• id is what you use to get this template when calling flexwalker()
• depth is the menu depth and will override other walker depth arguments
• struct describes the structure around the nav menu and its position within it
• lvl is an array containing 'lvl objects', described below

struct at this level allows you to put all menu-specific HTML here, which gives you more flexibility when coding your actual templates. If you need to go back to conventional menus instead of a deeply layered Bootstrap menu, for example, you can simply change which template you're using without having to modify the code in your theme header.

lvl Object

The lvl array tells Flexwalker what to build as it steps through your navigation menu via lvl objects. These objects have the following structure:

{
    "check": {
        "depth": 0,
        "children": false,
        "final": false
    },
    "struct": {
        "lvlo": "",
        "lvlc": "",
        "open": "",
        "close": "",
        "item": "item",
        "link": "a"
    }
}

• check is a set of rules for Flexwalker to check to see if it should apply the struct array. Flexwalker will stop checking when depth and children both evaluate to true:
  • depth is the current menu depth
  • children is whether this item has children
  • final when set to true tells Flexwalker whether to evaluate depth as === (false) or >= (true)