Skip to content
rogerlos edited this page Jun 16, 2017 · 5 revisions

Flexwalker is a plugin which provides a flexible walker allowing for more complex WordPress menu structures. (I built it for a project using Bootstrap 4, and was frustrated by the fairly limited options for what WordPress would return using a standard walker.)

How It Works

On WordPress load, a call is made to load Flexwalker into a global variable $FLEX, and it parses the JSON configuration, preferentially from the /flexwalker directory within the current theme's root.

It will also enqueue the Javascript file, if called for by the configuration. The JS file has the WordPress handle flexwalker.

When Flexwalker's menu method is called, either directly:

global $FLEX;
echo $FLEX->menu( [ /* argument array */ ] );

Or indirectly via the helper function:

if ( function_exists('flexwalker') ) {
    echo flexwalker( [ /* argument array */ ] );
}

Flexwalker does the following:

  • Passed arguments are recursively merged with the initial configuration (note Flexwalker does not throw out "alien" keys, so it's possible to pass in data with your own keys and use tokens to reference them, see tokens page)
  • Walker_Nav_Menu is passed, via filter:
    • The template defined within templates.json and identified with the template argument
    • The tags defined within tags.json
  • HTML is built from the template
    • When the special 'walker' placeholder is found Flexwalker_Walker is called with arguments walker.json
  • The HTML string is returned

There are several filters available during the process, see the filters page.

Arguments

Any value configured via JSON can be overwritten via the passed arguments array. The JSON arguments are stored with a key matching their filename, minus their extension:

$args = [
    'display'   => [],  // contains parsed JSON
    'tags'      => [],
    'templates' => [],
    'walker'    => [],
];

Note that these two arguments are required:

$args = [
    'template' => '',   // the `id` given to the template within `templates.json`
    'location' => '',   // WordPress menu slug
];

Javascript

See the javascript page to learn what flexwalker can help with post-document load. Note that there may be functionality here which is helpful even if you don't use the menu.

Clone this wiki locally