代码之家  ›  专栏  ›  技术社区  ›  Alain O'Dea

佐敦的三级菜单是怎么做的?

  •  0
  • Alain O'Dea  · 技术社区  · 14 年前

    我想在Zotonic中显示三级菜单项。

    例如,如果我有如下层次结构中的页面:

      • 职业
        • 为什么在这里工作?

    我想要 为什么在这里工作? 可在下拉菜单中访问。

    佐敦的三级菜单是怎么做的?

    1 回复  |  直到 14 年前
        1
  •  0
  •   Alain O'Dea    14 年前

    我使用了页面连接和一个修改过的菜单模板。这需要Zotonic 0.5.0或更高版本。

    1. 创建 谓语 Menu text
    2. 编辑 /modules/mod_menu/templates/_menu.tpl :

      {% if menu %}
          <ul id="{{ id_prefix }}navigation" class="clearfix at-menu do_superfish">
          {% for mid,depth,nr,has_sub in menu %}
          {% if not mid %}
                  {% if depth > 1 %}</ul></li>{% endif %}
              {% else %}
                  {% if nr == 1 and not forloop.first %}<ul{% if mid|member:path %} class="onpath"{% endif %}>{% endif %}
                  <li id="{{ id_prefix }}nav-item-{{nr}}" class="{% if is_first %}first {% endif %}{% if is_last %}last{% endif %}">
                      <a href="{{ m.rsc[mid].page_url }}"
                         class="{{ m.rsc[mid].name }}{% if mid == id %} current{% else %}{% if mid|member:path %} onpath{% endif %}{% endif %}">{{ m.rsc[mid].short_title|default:m.rsc[mid].title }}</a>
                  {% if not has_sub %}</li>{% endif %}
              {% endif %}
          {% endfor %}
          {% if forloop.last %}{% include "_menu_extra.tpl" %}{% endif %}
          </ul>
      {% endif %}
      

      进入第三级菜单版本:

      {% if menu %}
          <ul id="{{ id_prefix }}navigation" class="clearfix at-menu do_superfish">
          {% for mid,depth,nr,has_sub in menu %}
          {% if not mid %}
                  {% if depth > 1 %}</ul></li>{% endif %}
              {% else %}
                  {% if nr == 1 and not forloop.first %}<ul{% if mid|member:path %} class="onpath"{% endif %}>{% endif %}
                  <li id="{{ id_prefix }}nav-item-{{nr}}" class="{% if is_first %}first {% endif %}{% if is_last %}last{% endif %}">
                      <a href="{{ m.rsc[mid].page_url }}"
                         class="{{ m.rsc[mid].name }}{% if mid == id %} current{% else %}{% if mid|member:path %} onpath{% endif %}{% endif %}">{{ m.rsc[mid].short_title|default:m.rsc[mid].title }}</a>
                  {% if depth == 2 %}
                      {% for submenu in m.rsc[mid].menu %}
                          {% if forloop.first %}<ul>{% endif %}
                          <li id="{{ id_prefix }}nav-item-{{nr}}" class="{% if is_first %}first {% endif %}{% if is_last %}last{% endif %}">
                              <a href="{{ m.rsc[submenu].page_url }}"
                                 class="{{ m.rsc[submenu].name }}{% if submenu == id %} current{% else %}{% if submenu|member:path %} onpath{% endif %}{% endif %}">{{ m.rsc[submenu].short_title|default:m.rsc[submenu].title }}</a></li>
                          {% if forloop.last %}</ul>{% endif %}
                      {% endfor %}
                  {% endif %}
                  {% if not has_sub %}</li>{% endif %}
              {% endif %}
          {% endfor %}
          {% if forloop.last %}{% include "_menu_extra.tpl" %}{% endif %}
          </ul>
      {% endif %}
      

      通过为二级项目的菜单页连接添加特殊情况:

                {% if depth == 2 %}
                    {% for submenu in m.rsc[mid].menu %}
                        {% if forloop.first %}<ul>{% endif %}
                        <li id="{{ id_prefix }}nav-item-{{nr}}" class="{% if is_first %}first {% endif %}{% if is_last %}last{% endif %}">
                            <a href="{{ m.rsc[submenu].page_url }}"
                               class="{{ m.rsc[submenu].name }}{% if submenu == id %} current{% else %}{% if submenu|member:path %} onpath{% endif %}{% endif %}">{{ m.rsc[submenu].short_title|default:m.rsc[submenu].title }}</a></li>
                        {% if forloop.last %}</ul>{% endif %}
                    {% endfor %}
                {% endif %}
      
    3. 添加* 菜单 *指向需要菜单中第三级项的每个页面

    推荐文章