load_menus

Tag {% load_menus %}

Sintaxe: {% load_menus position: "posicao" %} Variável de output: {{ loaded_menus }} — array de objetos menu Tipo do item: objeto menu (veja atributos abaixo)

Menus são blocos de conteúdo dinâmicos que podem ser listados por posição usando a tag {% load_menus %}.

Com a tag você acessa o array de menus através da variável {{ loaded_menus }}, e visualiza os menus com a position especificada. Para percorrer o array utilizamos a tag {% for %} iterando entre os menus com a variável {{ menu }}.

<ul>
  {% load_menus position: "posicao" %}
  {% for menu in loaded_menus %}
    <li>
      <a href="{{ menu.url }}"
        {% unless menu.tooltip == blank %}class="{{ menu.tooltip }}"{% endunless %}
        {% if menu.external %}target="_blank"{% endif %}>

        {% if menu.image_url %}
          <img src="{{ menu.image_url }}" alt="{{ menu.title }}" />
        {% endif %}

        {{ menu.title }}
      </a>

      {% if menu.children %}
        <ul>

          {% for submenu in menu.children %}
            <li>
              <a href="{{ submenu.url }}"
                {% unless submenu.tooltip == blank %}class="{{ submenu.tooltip }}"{% endunless %}
                {% if submenu.external %}target="_blank"{% endif %}>
                {{ submenu.title }}
              </a>
            </li>
          {% endfor %}

        </ul>
      {% endif %}
    </li>
  {% endfor %}
</ul>

Atributos do objeto

Atributos do objeto menu (referência rápida)

Atributo	Tipo	Descrição
children	array	Lista de submenus do menu atual (itens também do tipo menu)
external	boolean	Se true, o link abre em nova aba
image_url	string (URL)	URL da imagem associada ao item (quando existir)
items_count	integer	Quantidade de submenus do menu atual
title	string	Título do item de menu
tooltip	string	Valor do campo tooltip no Admin (útil para classes/estilos)
url	string (URL)	URL do item de menu

• children: retorna um array de submenus do menu atual. Esses submenus possuem os mesmos atributos do objeto {{ menu }} e podem ser percorridos por um loop for.

{% if menu.children %}
  Esse menu possui {{ items_count }} submenus:

  <ul>
    {% for submenu in menu.children %}
      <li>
        <a href="{{ submenu.url }}">
          {{ submenu.title }}
        </a>

        {% if submenu.children %}
          <ul>
            {% for childmenu in submenu.children %}
              <!-- ... -->
            {% endfor %}
          </ul>
        {% endif %}
      </li>
    {% endfor %}
  </ul>
{% endif %}

• external: retorna true caso o gestor tenha optado por esse link abrir em uma nova janela, ou false caso o gestor não tenha marcado a opção.

• image_url: retorna a URL da imagem caso o menu atual aponte para uma tag e ela possua uma imagem.

{% if menu.image_url %}
  <a href="{{ menu.url }}">
    <img src="{{ menu.image_url }}" alt="{{ menu.title }}" />
  </a>
{% else %}
  <a href="{{ menu.url }}">
    <span>{{ menu.title }}</span>
  </a>
{% endif %}

• items_count: retorna o número de submenus que o menu atual possui.

{% if menu.items_count > 0 %}
  {% assign has_submenu = true %}
{% else %}
  {% assign has_submenu = false %}
{% endif %}

<li {% if has_submenu %}class="has-submenu"{% endif %}>
  {{ menu.title }}

  {% if has_submenu %}
    <ul>
      <!-- ... -->
    </ul>
  {% endif %}
</li>

• title: retorna o título do menu.

• tooltip: retorna o valor informado no campo tooltip na plataforma. Você pode usar esse campo para dinamizar classes ou cores de itens de submenu.

<li {% if menu.tooltip == "promo" %}style="color: red"{% endif %}>
  <!-- ... -->
</li>

• url: retorna a URL do menu.