WEM ModelerWEM ReferenceTutorialsMyWEM

Navigation

The Navigation template part is used to render the specific menu defined in the WEM project.

Syntax

<% Navigation container-name %>

<% Navigation container = container-name %>

<% Navigation container = container-name, right = menu-right %>

<% Navigation container = container-name, renderer = renderer-type %>

Menu Containers

The WEM runtime supports three fixed visible menu containers, along with one invisible container that cannot be rendered.

container-name

main

user

footer

Renderer

The renderer parameter accepts only one argument. Depending on whether the renderer parameter is set to legacy, the menu will be rendered in either a legacy format or a Bootstrap structure.

renderer

legacy

Right-Handed Menu

The menu-right parameter can be set to true or false, which determines whether the menu is rendered on the right side.

Note that this parameter is ignored when the renderer is set to legacy.

menu-right

true

false

Example

<body>
    <div class="top-menu">
        <% Navigation container = main %>
        <% Navigation container = user, right = true %>
    </div>
    <!-- Body content -->
    <% Navigation container = footer, renderer = legacy %>
</body>

Generated Output

<ul class="nav navbar-nav">
    <li class="active mode-cross-link">
        <a href="/">Home</a>
    </li>
    <li class="mode-cross-link">
        <a href="/forum">Forum</a>
    </li>
    <li class="dropdown">
        <a id="navitem8" href="#" class="dropdown-toggle" data-toggle="dropdown">Resources<i class="wem-icon-postfix fa fa-caret-down"></i></a>
        <ul class="dropdown-menu" role="menu">
            <li class="mode-cross-link">
                <a href="/resources/documentation">Documentation</a>
            </li>
            <li class="mode-cross-link">
                <a href="/resources/training">Training</a>
            </li>
        </ul>
    </li>
    <li class="mode-cross-link">
        <a href="/status">Status</a>
    </li>
</ul>
PreviousLanguage SelectNextNode ID

Last updated

Was this helpful?