Wholesale Login
{%- unless section.settings.logo == blank -%}
{%- assign logo_max_height = section.settings.logo_max_width | divided_by: section.settings.logo.aspect_ratio -%}
{% if logo_max_height > 600 %}
{%- assign logo_max_width = 600 | times: section.settings.logo.aspect_ratio -%}
{% else %}
{%- assign logo_max_width = section.settings.logo_max_width -%}
{% endif %}
{%- endunless -%}
<style>
{% if logo_max_width %}
.site-header__logo {
width: {{ logo_max_width | escape | default: '150' | remove: 'px' | append: 'px' }};
}
#HeaderLogoWrapper {
max-width: {{ logo_max_width | escape | default: '150' | remove: 'px' | append: 'px' }} !important;
}
{% endif %}
/* === WHOLESALE LINKS (Sami Wholesale) === */
.wholesale-links {
white-space: nowrap;
}
/* Make the whole phrase clickable, not only the first word */
.wholesale-links a {
font-size: inherit;
font-family: inherit;
text-decoration: none;
display: inline-block;
padding: 0; /* keep tight like other links */
margin: 0;
white-space: nowrap; /* prevent breaking into two lines */
}
/* optional spacing between the two wholesale links */
.wholesale-links a + a {
margin-left: 18px; /* gap instead of "|" */
}
</style>
{% if section.settings.show_announcement and section.settings.home_page_only == false or request.page_type == 'index' %}
{% if section.settings.announcement_link == blank %}
<div class="announcement-bar">
{% else %}
<a href="{{ section.settings.announcement_link }}" class="announcement-bar announcement-bar--link">
{% endif %}
<p class="announcement-bar__message site-wrapper">
{{ section.settings.announcement_text | escape }}
</p>
{% if section.settings.announcement_link == blank %}
</div>
{% else %}
</a>
{% endif %}
{% endif %}
<div class="site-wrapper">
<div class="top-bar grid">
<!-- SEARCH -->
<div class="grid__item medium-up--one-fifth small--one-half">
<div class="top-bar__search">
<a href="{{ routes.search_url }}" class="medium-up--hide">
{% include 'icon-search' %}
</a>
<form action="{{ routes.search_url }}" method="get" class="search-bar small--hide" role="search">
<button type="submit" class="search-bar__submit">
{% include 'icon-search' %}
</button>
<input
type="search"
name="q"
class="search-bar__input"
placeholder="{{ 'general.search.placeholder' | t }}">
</form>
</div>
</div>
<!-- RETAIL CUSTOMER LOGIN / SIGN UP -->
{% if shop.customer_accounts_enabled %}
<div class="grid__item medium-up--two-fifths small--hide">
<span class="customer-links">
{% if customer %}
<a href="{{ routes.account_url }}">
{{ customer.first_name | default: 'Account' }}
</a>
<span class="vertical-divider"></span>
{{ 'layout.customer.log_out' | t | customer_logout_link }}
{% else %}
{{ 'layout.customer.log_in' | t | customer_login_link }}
<span class="vertical-divider"></span>
{{ 'layout.customer.create_account' | t | customer_register_link }}
{% endif %}
</span>
</div>
{% endif %}
<!-- WHOLESALE LINKS (Sami Wholesale) -->
{% unless customer %}
<div class="grid__item medium-up--one-fifth small--hide text-right">
<span class="customer-links wholesale-links">
<a href="/account/login">Wholesale Login</a>
<a href="/pages/wholesale-sign-up">Wholesale Sign Up</a>
</span>
</div>
{% endunless %}
<!-- CART -->
<div class="grid__item medium-up--one-fifth small--one-half text-right">
<a href="{{ routes.cart_url }}" class="site-header__cart">
{% include 'icon-cart' %}
<span class="small--hide">
{{ 'layout.cart.title' | t }}
(<span id="CartCount">{{ cart.item_count }}</span>)
</span>
</a>
</div>
</div>
<hr class="small--hide hr--border">
<!-- LOGO -->
<header class="site-header grid medium-up--grid--table" role="banner">
<div class="grid__item small--text-center">
{% if section.settings.logo %}
<div id="HeaderLogoWrapper">
<a href="{{ routes.root_url }}">
<img
class="site-header__logo"
src="{{ section.settings.logo | img_url: '300x' }}"
alt="{{ shop.name }}">
</a>
</div>
{% else %}
<h1 class="site-header__site-name">
<a href="{{ routes.root_url }}">{{ shop.name }}</a>
</h1>
{% endif %}
</div>
{% unless section.settings.tagline == blank %}
<div class="grid__item medium-up--text-right small--text-center">
<div class="rte tagline">
{{ section.settings.tagline }}
</div>
</div>
{% endunless %}
</header>
</div>
{% schema %}
{
"name": "Header",
"settings": [
{
"type": "image_picker",
"id": "logo",
"label": "Logo image"
},
{
"type": "text",
"id": "logo_max_width",
"label": "Logo width",
"default": "150"
},
{
"type": "checkbox",
"id": "show_announcement",
"label": "Show announcement",
"default": false
},
{
"type": "checkbox",
"id": "home_page_only",
"label": "Home page only",
"default": true
},
{
"type": "text",
"id": "announcement_text",
"label": "Announcement text"
},
{
"type": "url",
"id": "announcement_link",
"label": "Announcement link"
},
{
"type": "richtext",
"id": "tagline",
"label": "Tagline"
}
]
}
{% endschema %}