Kriuchko
12/14/2018 - 12:33 PM
Theme options menu theme options menu drop in theme options
Shopify menu on theme options theme sections
{% if section.blocks != blank %}
<ul class="main-nav">
{% for block in section.blocks %}
{% case block.type %}
{% when 'none-drop' %}
{% if block.settings.title != blank %}
<li>
{% if block.settings.url != blank %}
<a href="{{ block.settings.url }}">{{ block.settings.title }}</a>
{% else %}<span class="no-click">{{ block.settings.title }}</span>
{% endif %}
</li>
{% endif %}
{% when 'drop-with-product' %}
<li>
{% if block.settings.url != blank %}
<a href="{{ block.settings.url }}">{{ block.settings.title }}</a>
{% else %}<span class="no-click">{{ block.settings.title }}</span>
{% endif %}
<div class="big-drop">
<div class="container">
<div class="cols">
<div class="col">
<span class="title">{{ block.settings.menu_title1 }}</span>
{% capture menu1_handle %}{{ block.settings.menu1 }}{% endcapture %}
{% if linklists[menu1_handle] and linklists[menu1_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu1_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
<div class="col">
<span class="title">{{ block.settings.menu_title2 }}</span>
{% capture menu2_handle %}{{ block.settings.menu2 }}{% endcapture %}
{% if linklists[menu2_handle] and linklists[menu2_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu2_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
<div class="col">
{% if block.settings.featured_product1 != blank %}
{%- assign product1 = all_products[block.settings.featured_product1] -%}
<div class="item">
<a href="{{ product1.url }}" class="product-image">
<img src="{{ product1.featured_image | product_img_url: 'original' }}" alt="{{ product1.featured_image.alt | escape }}" />
</a>
<h2 class="product-name"><a href="{{ product1.url }}">{{ product1.title }}</a></h2>
<h3 class="product-vendor">{{ product1.vendor }}</h3>
</div>
{% endif %}
{% if block.settings.featured_product2 != blank %}
{%- assign product2 = all_products[block.settings.featured_product2] -%}
<div class="item">
<a href="{{ product2.url }}" class="product-image">
<img src="{{ product2.featured_image | product_img_url: 'medium' }}" alt="{{ product2.featured_image.alt | escape }}" />
</a>
<h2 class="product-name"><a href="{{ product2.url }}">{{ product2.title }}</a></h2>
<h3 class="product-vendor">{{ product2.vendor }}</h3>
</div>
{% endif %}
{% if block.settings.enable_first %}
<div class="product-item">
<a href="{{ block.settings.block_url_first }}" class="holder">
<img src="{{ block.settings.block_image_first | img_url: '520x520' , crop: 'center' }}" alt="image description" width="260" height="260">
<div class="content">
<span>{{ block.settings.block_title_first }}</span>
</div>
</a>
</div>
{% endif %}
</div>
</div>
</div>
</div>
</li>
{% when 'drop-custom-block' %}
<li>
{% if block.settings.url != blank %}
<a href="{{ block.settings.url }}">{{ block.settings.title }}</a>
{% else %}<span class="no-click">{{ block.settings.title }}</span>
{% endif %}
<div class="big-drop">
<div class="container">
<div class="cols">
<div class="col">
{% capture menu1_handle %}{{ block.settings.menu1 }}{% endcapture %}
{% if linklists[menu1_handle] and linklists[menu1_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu1_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
<div class="col">
{% capture menu2_handle %}{{ block.settings.menu2 }}{% endcapture %}
{% if linklists[menu2_handle] and linklists[menu2_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu2_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
<div class="col">
{% capture menu3_handle %}{{ block.settings.menu3 }}{% endcapture %}
{% if linklists[menu3_handle] and linklists[menu3_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu3_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
<div class="col">
{% capture menu4_handle %}{{ block.settings.menu4 }}{% endcapture %}
{% if linklists[menu4_handle] and linklists[menu3_handle].links.size > 0 %}
<ul>
{% for l in linklists[menu4_handle].links %}
<li><a href="{{ l.url }}">{{ l.title }}</a></li>
{% endfor %}
</ul>
{% endif %}
</div>
{% if block.settings.enable %}
<div class="product-item">
<a href="{{ block.settings.block_url }}" class="holder">
<img src="{{ block.settings.block_image | img_url: '260x260' , crop: 'center' }}" alt="image description" width="260" height="260">
<div class="content">
<span>{{ block.settings.block_title }}</span>
</div>
</a>
</div>
{% endif %}
</div>
</div>
</div>
</li>
{% when 'logo' %}
<li>
<div class="logo mobile-hidden"><a href="{{ shop.url }}"><img src="{{ 'logo.svg' | asset_url }}" width="90" height="32" alt="{{ shop.name }}"></a></div>
</li>
{% endcase %}
{% endfor %}
{% if customer %}
{% else %}
{% comment %}<li><a href="#login-popup" class="lightbox">{{ 'layout.customer.login' | t }}</a></li>{% endcomment %}{% endif %}
</ul>
{% endif %}
{% schema %}
{
"name": "Main menu",
"blocks": [
{
"type": "logo",
"name": "Logo",
"settings": []
},
{
"type": "none-drop",
"name": "Without drop",
"settings": [
{
"type": "text",
"id": "title",
"label": "Label of link"
},
{
"type": "url",
"id": "url",
"label": "Url for this link"
}
]
},
{
"type": "drop-with-product",
"name": "Drop with product",
"settings": [
{
"type": "text",
"id": "title",
"label": "Label of link"
},
{
"type": "url",
"id": "url",
"label": "Url for this link"
},
{
"type": "text",
"id": "menu_title1",
"label": "Menu title"
},
{
"type": "link_list",
"id": "menu1",
"label": "Menu"
},
{
"type": "text",
"id": "menu_title2",
"label": "Menu title"
},
{
"type": "link_list",
"id": "menu2",
"label": "Menu"
},
{
"type": "checkbox",
"id": "enable_first",
"label": "Enable custom block"
},
{
"type": "text",
"id": "block_title_first",
"label": "Text for custom block"
},
{
"type": "url",
"id": "block_url_first",
"label": "Link for custom block"
},
{
"type": "image_picker",
"id": "block_image_first",
"label": "Image for custom block"
},
{
"type": "product",
"id": "featured_product1",
"label": "Select product"
},
{
"type": "product",
"id": "featured_product2",
"label": "Select product"
}
]
},
{
"type": "drop-custom-block",
"name": "Drop custom block",
"settings": [
{
"type": "text",
"id": "title",
"label": "Label of link"
},
{
"type": "url",
"id": "url",
"label": "Url for this link"
},
{
"type": "link_list",
"id": "menu1",
"label": "Menu"
},
{
"type": "link_list",
"id": "menu2",
"label": "Menu"
},
{
"type": "link_list",
"id": "menu3",
"label": "Menu"
},
{
"type": "link_list",
"id": "menu4",
"label": "Menu"
},
{
"type": "checkbox",
"id": "enable",
"label": "Enable custom block"
},
{
"type": "text",
"id": "block_title",
"label": "Text for custom block"
},
{
"type": "url",
"id": "block_url",
"label": "Link for custom block"
},
{
"type": "image_picker",
"id": "block_image",
"label": "Image for custom block"
}
]
}
]
}
{% endschema %}