如何在Shopify网站上显示移动菜单

Question

我在Shopify中使用Timber Framework设计了一个新网站，我现在正在尝试整理响应方，以确保它能够在所有设备上正常运行。

我目前面临的问题是，当屏幕调整到768px以下时，桌面菜单会消失，这很好，但根本没有菜单显示，我不知道为什么会这样。最初，当我添加了Timber Framework时，这是有效的，我已经浏览了theme.liquid文件，但无法解决为什么会这样。

可以在以下网址查看网站本身：function called TimeToSeed

如果有人可以告诉我哪里出错了，不知道如何解决这个问题。

任何帮助或建议都将不胜感激。

我在theme.liquid中的菜单代码

<div id="NavDrawer" class="drawer drawer--left">
    <div class="drawer__header">
      <div class="drawer__title h3">{{ 'layout.drawers.browse' | t }}</div>
      <div class="drawer__close js-drawer-close">
        <button type="button" class="icon-fallback-text">
          <span class="icon icon-x" aria-hidden="true"></span>
          <span class="fallback-text">{{ 'layout.drawers.close_menu' | t }}</span>
        </button>
      </div>
    </div>
    <!-- begin mobile-nav -->
    <ul class="mobile-nav">
      <li class="mobile-nav__item mobile-nav__search">
        {% include 'search-bar' %}
      </li>
      {% for link in linklists.main-menu.links %}
        {% comment %}
          Create a dropdown menu by naming a linklist the same as a link in the parent nav

          More info on dropdowns:
            - http://docs.shopify.com/manual/your-website/navigation/create-drop-down-menu
        {% endcomment %}
        {% assign child_list_handle = link.title | handleize %}
        {% if linklists[child_list_handle].links != blank %}
          <li class="mobile-nav__item{% if link.active %} mobile-nav__item--active{% endif %}" aria-haspopup="true">
            <div class="mobile-nav__has-sublist">
              <a href="{{ link.url }}" class="mobile-nav__link">{{ link.title }}</a>
              <div class="mobile-nav__toggle">
                <button type="button" class="icon-fallback-text mobile-nav__toggle-open">
                  <span class="icon icon-plus" aria-hidden="true"></span>
                  <span class="fallback-text">See More</span>
                </button>
                <button type="button" class="icon-fallback-text mobile-nav__toggle-close">
                  <span class="icon icon-minus" aria-hidden="true"></span>
                  <span class="fallback-text">{{ 'cart.general.close_cart' | t | json }}</span>
                </button>
              </div>
            </div>
            <ul class="mobile-nav__sublist">
              {% for childlink in linklists[child_list_handle].links %}
                <li class="mobile-nav__item {% if childlink.active %} mobile-nav__item--active{% endif %}">
                  <a href="{{ childlink.url }}" class="mobile-nav__link">{{ childlink.title | escape }}</a>
                </li>
              {% endfor %}
            </ul>
          </li>
        {% else %}
          <li class="mobile-nav__item{% if link.active %} mobile-nav__item--active{% endif %}">
            <a href="{{ link.url }}" class="mobile-nav__link">{{ link.title }}</a>
          </li>
        {% endif %}
      {% endfor %}

      {% comment %}
        If customer accounts are enabled, provide login and create account links
      {% endcomment %}
      {% if shop.customer_accounts_enabled %}
        {% if customer %}
          <li class="mobile-nav__item">
            {% if customer.first_name != blank %}
              {% capture first_name %}{{ customer.first_name }}{% endcapture %}
              <a href="/account">{{ 'layout.customer.logged_in_as_html' | t: first_name: first_name }}</a>
            {% else %}
              <a href="/account">{{ 'layout.customer.account' | t }}</a>
            {% endif %}
          </li>
          <li class="mobile-nav__item">
            {{ 'layout.customer.log_out' | t | customer_logout_link }}
          </li>
        {% else %}
          <li class="mobile-nav__item">
            {{ 'layout.customer.log_in' | t | customer_login_link }}
          </li>
          <li class="mobile-nav__item">
            {{ 'layout.customer.create_account' | t | customer_register_link }}
          </li>
        {% endif %}
      {% endif %}
    </ul>
    <!-- //mobile-nav -->
  </div>