FROM CACHE - en_header
Shopify Design
Shopify themes, liquid, logos, and UX
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
What's your biggest current challenge? Have your say in Community Polls along the right column.
- Shopify Community
- :
- Shopify Discussion
- :
- Shopify Design
- :
- View cart button not clickable on mobile view
Options
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Mute
- Printer Friendly Page
View cart button not clickable on mobile view
Solved
View cart button not clickable on mobile view
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
09:59 AM
Can someone please help me. The 'view cart' button on the mobile version of the website is not clickable.
www.naturalcutenest.com
Solved! Go to the solution
Labels:
- Labels:
-
Cart Page
-
CSS
-
HTML
-
Liquid
-
Troubleshooting
Accepted Solution (1)
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:55 AM
This is an accepted solution.
Hi @BlackenWillow,
Please change all code:
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="all" onload="this.media='all'">
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{%- liquid
assign background = section.settings.background
assign style_function_group = section.settings.style_function_group
assign show_header_transparent_mobile = section.settings.show_header_transparent_mobile
if show_header_transparent_mobile
assign color_modify = section.settings.color_modify | times: 0.01
assign color_modify_2 = section.settings.color_modify_2 | times: 0.01
assign color_modify_1_text = section.settings.color_modify_1_text
assign color_modify_1_icon = section.settings.color_modify_1_icon
assign color_modify_2_text = section.settings.color_modify_2_text
assign color_modify_2_icon = section.settings.color_modify_2_icon
endif
if style_function_group == '4' or style_function_group == '6'
assign icon_account = '3'
assign icon_cart = '4'
elsif style_function_group == '5'
assign icon_account = '3'
assign icon_cart = '9'
elsif style_function_group == '7'
assign icon_account = '5'
assign icon_cart = '5'
elsif style_function_group == '8'
assign icon_account = '2'
assign icon_cart = '1'
elsif style_function_group == '9'
assign icon_account = '3'
assign icon_cart = '2'
elsif style_function_group == '10'
assign icon_account = '4'
assign icon_cart = '3'
elsif style_function_group == '11'
assign icon_account = '1'
assign icon_cart = '6'
else
assign icon_account = '1'
assign icon_cart = '1'
endif
assign block_search = section.blocks | where: "type", "search"
for block in block_search
assign header_search_style = block.settings.header_search_style
endfor
-%}
<{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile data-sticky-type="{{ section.settings.sticky_header_type }}"{% else %}div{% endif %} id="shopify-section__header-mobile" class="header-wrapper header-group"
style="--header-mobile-bg: {% if section.settings.gradient != blank %}{{ section.settings.gradient }}{% else %}{{ background }}{% endif %};
{% if show_header_transparent_mobile %}
--color-modify: {{ background | color_modify: 'alpha', color_modify }};
--color-modify-2: {{ background | color_modify: 'alpha', color_modify_2 }};
--color-modify-1-text: {{ color_modify_1_text }};
--color-modify-1-icon: {{ color_modify_1_icon }};
--color-modify-2-text: {{ color_modify_2_text }};
--color-modify-2-icon: {{ color_modify_2_icon }};
{% endif %}">
<header class="header-mobile{% if show_header_transparent_mobile %} header-transparent{% endif %} header-mobile-style-{{ header_search_style }} element-spacing" style="--spacing-top-mobile: {{ section.settings.padding_top | times: 0.5 | round: 0 | append: 'px' }};--spacing-bottom-mobile: {{ section.settings.padding_bottom | times: 0.5 | round: 0 | append: 'px' }};">
<div class="container">
<div class="header-mobile--wrapper">
{%- for block in section.blocks -%}
<div class="header-mobile__item--{{ block.type }}">
{%- case block.type -%}
{%- when 'menu' -%}
<div class="header-mobile--icon item__mobile--hamburger" style="--icon-color: {{ block.settings.icon_color }};">
<a class="mobileMenu-toggle" href="/" data-mobile-menu aria-label="menu">
<span class="mobileMenu-toggle__Icon"></span>
</a>
</div>
{%- when 'search' -%}
{%- if header_search_style != 'full' -%}
<side-drawer-opener class="header-mobile--icon" data-side-drawer="#Drawer-Search" style="--icon-color: {{ block.settings.icon_color }};">
<button class="header__iconItem header__search t-button link focus-inset" type="button" aria-haspopup="dialog">
<details>
<summary class="header__icon header__icon--search header__icon--summary link focus-inset modal__toggle" aria-haspopup="dialog" aria-label="{{ 'general.search.search' | t }}" data-search-mobile role="button" tabindex="0">
<span>
{% render 'icon-search',
icon_search: icon_search,
class: 'modal__toggle-open icon icon-search'
%}
{% render 'icon-close',
icon_search: icon_search,
class: 'modal__toggle-close icon icon-close'
%}
</span>
</summary>
</details>
</button>
</side-drawer-opener>
{%- endif -%}
{%- when 'logo' -%}
<div class="header-mobile--icon">
{%- if menu_tab.size > 0 -%}
<{% if request.page_type == 'index' %}h1{% else %}div{% endif %} class="header__heading header__heading--item item-{{ count }}" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo test" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
</{% if request.page_type == 'index' %}h1{% else %}div{% endif %}>
{%- else -%}
<div class="header__heading" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
</div>
{%- endif -%}
</div>
{%- when 'customer' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};">
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}" class="header__icon header__icon--account link focus-inset" {% if routes.account_login_url == '/account/login' %}{% if settings.customer_login_type=='popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}{% endif %} role="button">
{% render 'icon-account',
icon_account: icon_account
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
</div>
{%- when 'cart' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};--cart-count-background: {{ block.settings.cart_count_background }};--cart-count-color: {{ block.settings.cart_count_color }};">
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble-mobile" role="button">
{%- if style_function_group == '2' -%}
{% render 'icon-cart-special' %}
{%- else -%}
{% render 'icon-cart',
icon_cart: icon_cart
%}
{%- endif -%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
</div>
{%- endcase -%}
</div>
{%- endfor -%}
</div>
</div>
{%- if header_search_style == 'full' -%}
<div class="header-mobile-search">
<div class="header__search--mobile">
<a href="#" class="halo-sidebar-close" data-search-close>
{% render 'icon-close' %}
</a>
</div>
</div>
{%- endif -%}
</header>
</{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile{% else %}div{% endif %}>
{% javascript %}
class StickyHeaderMobile extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.querySelector('.shopify-section__header-mobile');
this.header_2 = document.querySelector('.shopify-section__header-mobile .header-mobile');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.stickyHeaderType = this.getAttribute('data-sticky-type');
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
this.setHeaderHeight();
window.matchMedia('(max-width: 1024px)').addEventListener('change', this.setHeaderHeight.bind(this));
this.backgroundTransparent();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
setHeaderHeight() {
if(document.querySelector('.section-header-single-line')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
if(document.querySelector('.header-mobile-style-full')) {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `calc(${this.header_2.offsetHeight}px + 40px)`);
} else {
this.header.style.setProperty('--header-height', `calc(${this.header.offsetHeight}px + 40px)`);
}
} else {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
this.header.style.setProperty('--header-height', `${this.header.offsetHeight}px`);
}
}
}
}
backgroundTransparent() {
if (document.querySelector('.header-mobile.header-transparent')) {
this.header.classList.add('enable-bg-transparent');
}
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky');
document.body.classList.add('scroll-up');
return
}
}
this.closeMenuDisclosure();
this.closeDropdownPopup();
}
reveal() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.add('scroll-up');
return
}
}
}
reset() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-up');
return
}
}
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header-mobile', StickyHeaderMobile);
{% endjavascript %}
{% schema %}
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"limit": 1,
"class": "shopify-section__header-mobile",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "color",
"id": "background",
"label": "t:sections.general.settings.color.label__1",
"default": "#ffffff"
},
{
"type": "color_background",
"id": "gradient",
"label": "t:sections.general.settings.color.label__20"
},
{
"type": "select",
"id": "style_function_group",
"label": "t:sections.header.settings.header-2.label__1",
"default": "1",
"options": [
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
},
{
"value": "6",
"label": "6"
},
{
"value": "7",
"label": "7"
},
{
"value": "8",
"label": "8"
},
{
"value": "9",
"label": "9"
},
{
"value": "10",
"label": "10"
},
{
"value": "11",
"label": "11"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__23.content"
},
{
"type": "select",
"id": "sticky_header_type",
"label": "t:sections.header.settings.general.label__6",
"default": "up",
"options": [
{
"value": "none",
"label": "t:sections.header.settings.general.options__3"
},
{
"value": "up",
"label": "t:sections.header.settings.general.options__1"
},
{
"value": "down",
"label": "t:sections.header.settings.general.options__2"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__21.content"
},
{
"type": "checkbox",
"id": "show_header_transparent_mobile",
"label": "t:sections.header.settings.transparent-header.label__2",
"info":"t:sections.header.settings.transparent-header.info__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__1.content"
},
{
"type": "range",
"id": "color_modify",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 20
},
{
"type": "color",
"id": "color_modify_1_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_1_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__2.content"
},
{
"type": "range",
"id": "color_modify_2",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 100
},
{
"type": "color",
"id": "color_modify_2_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_2_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.general.settings.padding.name"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__1",
"default": 0
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__2",
"default": 0
}
],
"blocks": [
{
"type": "menu",
"name": "Menu",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "search",
"name": "t:sections.header.settings.header_search.name",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "icon",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "icon-2",
"label": "t:sections.header.settings.header_search.options__9"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
}
]
},
{
"type": "logo",
"name": "t:sections.header.settings.header__6.content",
"limit": 1,
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3"
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 65
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.general.settings.style.name"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
]
},
{
"type": "customer",
"name": "Customer",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "cart",
"name": "Cart",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
}
],
"presets": [
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"settings": {
"background": "#ffffff",
"gradient": "",
"style_function_group": "1",
"sticky_header_type": "up",
"show_header_transparent_mobile": false,
"color_modify": 20,
"color_modify_1_text": "#ffffff",
"color_modify_1_icon": "#ffffff",
"color_modify_2": 100,
"color_modify_2_text": "#ffffff",
"color_modify_2_icon": "#ffffff",
"padding_top": 0,
"padding_bottom": 0
},
"blocks": [
{
"type": "menu",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "search",
"settings": {
"icon_color": "#232323",
"header_search_style": "icon"
}
},
{
"type": "logo",
"settings": {
"logo_type": "image",
"logo_mobile": "shopify:\/\/shop_images\/Halo-logo.png",
"logo_width_mobile": 100,
"logo_text": "",
"logo_icon": "",
"logo_icon_width_mobile": 100,
"logo_icon_height_mobile": 50,
"logo_font_size": 15,
"logo_font_weight": "900",
"logo_text_transform": "uppercase",
"logo_color": "#232323"
}
},
{
"type": "customer",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "cart",
"settings": {
"cart_count_background": "#bc1b3b",
"cart_count_color": "#ffffff",
"icon_color": "#232323"
}
}
]
}
],
"enabled_on": {
"groups": ["header" ]
}
}
{% endschema %}
☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Replies 10 (10)
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:09 AM
Hi @BlackenWillow,
Please send me the code of header.liquid file, I will check it for you
☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:23 AM
Thank you!
{{ 'section-header.css' | asset_url | stylesheet_tag }}
{{ 'rtl-section-header.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-search.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-menu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- if section.settings.show_megamenu -%}
<link rel="stylesheet" href="{{ 'component-megamenu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- endif -%}
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="print" onload="this.media='all'">
<noscript>{{ 'component-search.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-menu.css' | asset_url | stylesheet_tag }}</noscript>
{%- if section.settings.show_megamenu -%}
<noscript>{{ 'component-megamenu.css' | asset_url | stylesheet_tag }}</noscript>
{%- endif -%}
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{% render 'header-style' %}
<{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %} class="header-wrapper{% if section.settings.show_line_separator %} header-wrapper--border-bottom{% endif %}">
{%- liquid
if section.blocks.size > 0
assign menu_tab = section.blocks | where: "type", "tab"
assign page_handle = page.handle
endif
-%}
<header class="header header-1{% if section.settings.menu != blank %} header--has-menu{% endif %}">
<div class="header-top">
<div class="container">
<div class="header-top--wrapper{% unless menu_tab.size > 0 and section.settings.show_menu_tab %} header-top--wrapper-2{% endunless %}">
<div class="header-top-left text-left clearfix{% if section.settings.show_menu_tab and menu_tab.size > 0 %} header__multi-page header-menu-tab{% endif %}" >
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% render 'halo-menu-tab-header',
menu_tab: menu_tab,
page_handle: page_handle
%}
{%- endif -%}
</div>
<div class="header-top-center header__logo text-center">
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% assign page_handle = page.handle %}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading header__heading--item">
{%- else -%}
<div class="header__heading header__heading--item">
{%- endif -%}
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if section.settings.logo_type == 'image' -%}
{%- if block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if block.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ block.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- else -%}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading">
{%- else -%}
<div class="header__heading">
{%- endif -%}
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if section.settings.logo_type == 'image' -%}
{%- if section.settings.logo != blank -%}
{%- liquid
assign image = section.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if section.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ section.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if section.settings.logo_icon != blank -%}
{{ section.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- endif -%}
</div>
<div class="header-top-right header__icons text-right clearfix">
{%- if section.settings.show_search -%}
{%- liquid
assign header_search_style = section.settings.header_search_style
-%}
{%- if header_search_style == 'full' -%}
<details-modal class="header__iconItem header__search show-full">
{%- if settings.show_predictive_search -%}
<predictive-search data-loading-text="{{ 'accessibility.loading' | t }}" data-product-to-show="{{ settings.quick_search_to_show }}" class="header__seach--details predictive-search-form">
{%- endif -%}
<details class="header__seach--details">
{% render 'halo-search-layout-full',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</details>
{%- if settings.show_predictive_search -%}
</predictive-search>
{%- endif -%}
</details-modal>
{%- else -%}
<div class="header__iconItem header__search show-icon">
<div class="header__seach--details">
{% render 'halo-search-layout-icon',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</div>
</div>
{%- endif -%}
{%- endif -%}
<div class="header__iconItem header__group">
{%- if shop.customer_accounts_enabled and section.settings.show_customer -%}
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}"
class="header__icon header__icon--account link focus-inset"
{% if routes.account_login_url == '/account/login' %}
{% if settings.customer_login_type == 'popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}
{% endif %}
>
{% render 'icon-account',
icon_account: '1'
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
{%- endif -%}
{%- if settings.show_wishlist and section.settings.show_wishlist -%}
<a href="{{ pages['wish-list'].url }}" class="header__icon header__icon--wishlist link focus-inset">
{% render 'icon-heart',
icon_heart: '1'
%}
<span class="visually-hidden">
{{ 'wishlist.general.title' | t }}
</span>
<div class="wishlist-count-bubble">
<span class="text" aria-hidden="true" data-wishlist-count>0</span>
</div>
</a>
{%- endif -%}
{%- if section.settings.show_cart -%}
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button">
{% render 'icon-cart',
icon_cart: '1'
%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
{%- endif -%}
</div>
</div>
</div>
</div>
</div>
<div class="header-bottom">
<div class="container">
<div class="header-bottom--wrapper">
{%- if section.settings.customer_service and section.settings.customer_service_text != blank -%}
{%- liquid
assign customer_service_icon = section.settings.customer_service_icon
assign customer_service_text = section.settings.customer_service_text
-%}
<div class="header__inline-customer_service header-bottom-left">
<div class="customer-service top-customer-service">
{%- if customer_service_icon != blank -%}
<div class="customer-service--icon">
{{ customer_service_icon }}
</div>
{%- endif -%}
<div class="customer-service--text">
{{ customer_service_text }}
</div>
</div>
</div>
{%- endif -%}
{%- if section.settings.menu != blank -%}
<div class="header-bottom-center{% if section.settings.show_resize_menu %} has-resize-menu{% endif %}" id="HeaderNavigation">
<nav class="header__inline-menu{% unless section.settings.customer_service %} customer-service--hide{% endunless %}{% unless settings.enable_multilang_shopify and settings.enable_currencies %} language-currency--hide{% endunless %}" data-navigation role="navigation" aria-label="{{ 'general.navigation.title' | t }}">
{%- liquid
assign page_type = request.page_type | replace: 'customers/', ''
assign load = false
if page_type == 'search'
assign load = true
endif
-%}
{% render 'halo-navigation-list',
listClass: 'list-menu list-menu--inline',
load: load
%}
</nav>
</div>
{%- endif -%}
{%- if settings.enable_multilang_shopify or settings.enable_currencies -%}
<div class="header__inline-language_currency wrapper_language_currency header-bottom-right text-right">
<language-currency class="language-currency--wrapper position-right">
<div class="toggle-language-currency" data-language-currency-toggle>
<div class="top-language-currency justify-end">
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-top-language' %}
{%- if settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endif -%}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-top-currency' %}
{%- endif -%}
{%- unless settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endunless -%}
</div>
</div>
<div class="dropdown-language-currency custom-scrollbar" data-language-currency-dropdown>
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-language' %}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-currency' %}
{%- endif -%}
</div>
</language-currency>
</div>
{%- endif -%}
</div>
</div>
</div>
{% render 'header-mobile',
menu_tab: menu_tab,
page_handle: page_handle,
icon_account: '1',
icon_cart: '1'
%}
</header>
</{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %}>
{%- if menu_tab.size > 3 -%}
<script src="{{ 'details-disclosure.js' | asset_url }}" defer="defer"></script>
{%- endif -%}
{%- unless section.settings.show_search -%}
<script type="text/javascript">
window.hidden_search_header = true;
</script>
<script src="{{ 'halo-quick-search.js' | asset_url }}" defer="defer"></script>
{%- endunless -%}
{% javascript %}
class StickyHeader extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.getElementById('shopify-section-header');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
this.closeMenuDisclosure();
this.closeDropdownPopup();
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
}
reveal() {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
}
reset() {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header', StickyHeader);
{% endjavascript %}
{% render 'header-script' %}
{% schema %}
{
"name": "t:sections.header.name",
"class": "shopify-section-header",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "checkbox",
"id": "show_line_separator",
"label": "t:sections.header.settings.general.label__1",
"default": false
},
{
"type": "checkbox",
"id": "show_sticky_header",
"label": "t:sections.header.settings.general.label__2",
"info": "t:sections.header.settings.general.info",
"default": true
},
{
"type": "checkbox",
"id": "show_wishlist",
"label": "t:sections.header.settings.general.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_customer",
"label": "t:sections.header.settings.general.label__4",
"default": true
},
{
"type": "checkbox",
"id": "show_cart",
"label": "t:sections.header.settings.general.label__5",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__19.content"
},
{
"type": "link_list",
"id": "menu",
"label": "t:sections.header.settings.menu.label__1",
"default": "main-menu"
},
{
"type": "checkbox",
"id": "show_menu_tab",
"label": "t:sections.header.settings.menu.label__2",
"default": true
},
{
"type": "checkbox",
"id": "show_megamenu",
"label": "t:sections.header.settings.menu.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_resize_menu",
"label": "t:sections.header.settings.menu.label__4",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__2.content"
},
{
"type": "color_background",
"id": "header_top_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "header_top_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__3.content"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#808080"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color_background",
"id": "text_bg_active",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type": "color",
"id": "text_color_active",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__4.content"
},
{
"type": "color_background",
"id": "header_bottom_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__5.content"
},
{
"type": "color_background",
"id": "header_mobile_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "header_mobile_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__6.content"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.settings.logo.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__4",
"default": 145
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 120
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 30
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__8",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_icon_width",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__9",
"default": 145
},
{
"type": "range",
"id": "logo_icon_height",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__10",
"default": 145
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.header.settings.header__7.content"
},
{
"type": "checkbox",
"id": "show_search",
"label": "t:sections.header.settings.header_search.label__1",
"default": true
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "full",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.header_search.paragraph.content"
},
{
"type": "color_background",
"id": "search_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type":"color",
"id": "search_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type":"color",
"id": "search_icon_color",
"label": "t:sections.general.settings.color.label__4",
"default": "#808080"
},
{
"type": "header",
"content": "t:sections.header.settings.header__8.content"
},
{
"type": "select",
"id": "lv_1_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_1_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "lv_1_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "700",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_1_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color",
"id": "lv_1_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_1_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_1_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__9.content"
},
{
"type": "select",
"id": "lv_2_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 16
},
{
"type": "select",
"id": "lv_2_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_lv_2.paragraph__1.content"
},
{
"type": "select",
"id": "lv_2_mega_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_mega_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 18
},
{
"type": "select",
"id": "lv_2_mega_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_mega_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "lv_2_bg",
"label": "t:sections.general.settings.color.label__10",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "lv_2_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_2_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_2_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__10.content"
},
{
"type": "textarea",
"id": "sale_item_1",
"label": "t:sections.header.settings.sale_item.label__1"
},
{
"type": "textarea",
"id": "sale_item_2",
"label": "t:sections.header.settings.sale_item.label__2"
},
{
"type": "textarea",
"id": "sale_item_3",
"label": "t:sections.header.settings.sale_item.label__3"
},
{
"type": "color",
"id": "sale_item_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#D12442"
},
{
"type": "header",
"content": "t:sections.header.settings.header__11.content"
},
{
"type": "checkbox",
"id": "show_label",
"label": "t:sections.header.settings.menu_label.label__1",
"default": true
},
{
"type": "checkbox",
"id": "show_label_blink",
"label": "t:sections.header.settings.menu_label.label__5",
"info": "t:sections.header.settings.menu_label.info",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__1.content"
},
{
"type": "textarea",
"id": "new_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "new_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "new_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "new_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#BAE4ED"
},
{
"type": "color",
"id": "new_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__2.content"
},
{
"type": "textarea",
"id": "sale_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "sale_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "sale_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "sale_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#D12442"
},
{
"type": "color",
"id": "sale_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__3.content"
},
{
"type": "textarea",
"id": "hot_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "hot_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "hot_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "hot_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFF993"
},
{
"type": "color",
"id": "hot_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__12.content"
},
{
"type": "checkbox",
"id": "customer_service",
"label": "t:sections.header.settings.customer_service.label__1",
"default": true
},
{
"type": "textarea",
"id": "customer_service_icon",
"label": "t:sections.header.settings.customer_service.label__2"
},
{
"type": "textarea",
"id": "customer_service_text",
"label": "t:sections.header.settings.customer_service.label__3",
"default": "Call us <a href=\"tel:(018)%20900-6690/\">(018) 900-6690</a> or <a href=\"#\"><strong>Live Chat</strong></a>"
},
{
"type": "header",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color_background",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
],
"blocks": [
{
"type": "tab",
"name": "t:sections.header.blocks.tab.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__1.content"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.blocks.tab.settings.logo.label__1"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.blocks.tab.settings.logo.label__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.header.blocks.tab.settings.logo.label__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.header.blocks.tab.settings.logo.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__2.content"
},
{
"type": "text",
"id": "menu",
"label": "t:sections.header.blocks.tab.settings.menu.label__1"
},
{
"type": "page",
"id": "link",
"label": "t:sections.header.blocks.tab.settings.menu.label__2"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2"
}
]
},
{
"type": "megamenu",
"name": "t:sections.header.blocks.mega.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__1.content"
},
{
"type": "text",
"id": "item",
"label": "t:sections.header.blocks.mega.settings.general.label__1",
"default": "Catalog"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__2.content"
},
{
"type": "range",
"id": "column",
"label": "t:sections.header.blocks.mega.settings.column.label__1",
"min": 2,
"max": 6,
"step": 1,
"default": 5
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__3.content"
},
{
"type": "checkbox",
"id": "show_custom_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__1",
"default": true
},
{
"type": "text",
"id": "custom_text_title",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__2",
"default": "Offers"
},
{
"type": "textarea",
"id": "custom_text_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__3"
},
{
"type": "text",
"id": "custom_text_link_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__4",
"default": "See more offers"
},
{
"type": "url",
"id": "custom_text_url",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__5"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__4.content"
},
{
"type": "checkbox",
"id": "show_banner",
"label": "t:sections.header.blocks.mega.settings.banner.label__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__1.content"
},
{
"type": "text",
"id": "banner_width",
"label": "t:sections.header.blocks.mega.settings.banner.label__2",
"info": "t:sections.header.blocks.mega.settings.banner.info"
},
{
"type": "checkbox",
"id": "show_banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__2.content"
},
{
"type": "checkbox",
"id": "show_banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__3.content"
},
{
"type": "checkbox",
"id": "show_banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__4.content"
},
{
"type": "checkbox",
"id": "show_banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__1.content"
},
{
"type": "select",
"id": "heading_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "heading_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "heading_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "heading_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "heading_color",
"type": "color",
"label": "t:sections.general.settings.color.label__7",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__2.content"
},
{
"type": "select",
"id": "link_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "link_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "link_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "link_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "link_color",
"type": "color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__5.content"
},
{
"type": "checkbox",
"id": "show_az_brand",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__1",
"default": false
},
{
"type": "text",
"id": "az_brand_title",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__2",
"default" : "All Brands A-Z"
},
{
"type": "text",
"id": "az_brand_link_text",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__3",
"default" : "See All Brands"
},
{
"type": "url",
"id": "az_brand_url",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__6.content"
},
{
"type": "checkbox",
"id": "show_product",
"label": "t:sections.header.blocks.mega.settings.product_block.label__1",
"default": false
},
{
"type": "text",
"id": "product_title",
"label": "t:sections.header.blocks.mega.settings.product_block.label__2",
"default" : "On Sale Products"
},
{
"type": "collection",
"id": "product_collection",
"label": "t:sections.header.blocks.mega.settings.product_block.label__3"
},
{
"type": "range",
"id": "product_limit",
"label": "t:sections.header.blocks.mega.settings.product_block.label__4",
"min": 3,
"max": 10,
"step": 1,
"default": 6
},
{
"type": "select",
"id": "product_per_row",
"label": "t:sections.header.blocks.mega.settings.product_block.label__5",
"options": [
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}],
"default": "5"
}
]
}
]
}
{% endschema %}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:33 AM
Thank you!
{{ 'section-header.css' | asset_url | stylesheet_tag }}
{{ 'rtl-section-header.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-search.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-menu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- if section.settings.show_megamenu -%}
<link rel="stylesheet" href="{{ 'component-megamenu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- endif -%}
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="print" onload="this.media='all'">
<noscript>{{ 'component-search.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-menu.css' | asset_url | stylesheet_tag }}</noscript>
{%- if section.settings.show_megamenu -%}
<noscript>{{ 'component-megamenu.css' | asset_url | stylesheet_tag }}</noscript>
{%- endif -%}
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{% render 'header-style' %}
<{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %} class="header-wrapper{% if section.settings.show_line_separator %} header-wrapper--border-bottom{% endif %}">
{%- liquid
if section.blocks.size > 0
assign menu_tab = section.blocks | where: "type", "tab"
assign page_handle = page.handle
endif
-%}
<header class="header header-1{% if section.settings.menu != blank %} header--has-menu{% endif %}">
<div class="header-top">
<div class="container">
<div class="header-top--wrapper{% unless menu_tab.size > 0 and section.settings.show_menu_tab %} header-top--wrapper-2{% endunless %}">
<div class="header-top-left text-left clearfix{% if section.settings.show_menu_tab and menu_tab.size > 0 %} header__multi-page header-menu-tab{% endif %}" >
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% render 'halo-menu-tab-header',
menu_tab: menu_tab,
page_handle: page_handle
%}
{%- endif -%}
</div>
<div class="header-top-center header__logo text-center">
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% assign page_handle = page.handle %}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading header__heading--item">
{%- else -%}
<div class="header__heading header__heading--item">
{%- endif -%}
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if section.settings.logo_type == 'image' -%}
{%- if block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if block.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ block.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- else -%}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading">
{%- else -%}
<div class="header__heading">
{%- endif -%}
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if section.settings.logo_type == 'image' -%}
{%- if section.settings.logo != blank -%}
{%- liquid
assign image = section.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if section.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ section.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if section.settings.logo_icon != blank -%}
{{ section.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- endif -%}
</div>
<div class="header-top-right header__icons text-right clearfix">
{%- if section.settings.show_search -%}
{%- liquid
assign header_search_style = section.settings.header_search_style
-%}
{%- if header_search_style == 'full' -%}
<details-modal class="header__iconItem header__search show-full">
{%- if settings.show_predictive_search -%}
<predictive-search data-loading-text="{{ 'accessibility.loading' | t }}" data-product-to-show="{{ settings.quick_search_to_show }}" class="header__seach--details predictive-search-form">
{%- endif -%}
<details class="header__seach--details">
{% render 'halo-search-layout-full',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</details>
{%- if settings.show_predictive_search -%}
</predictive-search>
{%- endif -%}
</details-modal>
{%- else -%}
<div class="header__iconItem header__search show-icon">
<div class="header__seach--details">
{% render 'halo-search-layout-icon',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</div>
</div>
{%- endif -%}
{%- endif -%}
<div class="header__iconItem header__group">
{%- if shop.customer_accounts_enabled and section.settings.show_customer -%}
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}"
class="header__icon header__icon--account link focus-inset"
{% if routes.account_login_url == '/account/login' %}
{% if settings.customer_login_type == 'popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}
{% endif %}
>
{% render 'icon-account',
icon_account: '1'
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
{%- endif -%}
{%- if settings.show_wishlist and section.settings.show_wishlist -%}
<a href="{{ pages['wish-list'].url }}" class="header__icon header__icon--wishlist link focus-inset">
{% render 'icon-heart',
icon_heart: '1'
%}
<span class="visually-hidden">
{{ 'wishlist.general.title' | t }}
</span>
<div class="wishlist-count-bubble">
<span class="text" aria-hidden="true" data-wishlist-count>0</span>
</div>
</a>
{%- endif -%}
{%- if section.settings.show_cart -%}
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button">
{% render 'icon-cart',
icon_cart: '1'
%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
{%- endif -%}
</div>
</div>
</div>
</div>
</div>
<div class="header-bottom">
<div class="container">
<div class="header-bottom--wrapper">
{%- if section.settings.customer_service and section.settings.customer_service_text != blank -%}
{%- liquid
assign customer_service_icon = section.settings.customer_service_icon
assign customer_service_text = section.settings.customer_service_text
-%}
<div class="header__inline-customer_service header-bottom-left">
<div class="customer-service top-customer-service">
{%- if customer_service_icon != blank -%}
<div class="customer-service--icon">
{{ customer_service_icon }}
</div>
{%- endif -%}
<div class="customer-service--text">
{{ customer_service_text }}
</div>
</div>
</div>
{%- endif -%}
{%- if section.settings.menu != blank -%}
<div class="header-bottom-center{% if section.settings.show_resize_menu %} has-resize-menu{% endif %}" id="HeaderNavigation">
<nav class="header__inline-menu{% unless section.settings.customer_service %} customer-service--hide{% endunless %}{% unless settings.enable_multilang_shopify and settings.enable_currencies %} language-currency--hide{% endunless %}" data-navigation role="navigation" aria-label="{{ 'general.navigation.title' | t }}">
{%- liquid
assign page_type = request.page_type | replace: 'customers/', ''
assign load = false
if page_type == 'search'
assign load = true
endif
-%}
{% render 'halo-navigation-list',
listClass: 'list-menu list-menu--inline',
load: load
%}
</nav>
</div>
{%- endif -%}
{%- if settings.enable_multilang_shopify or settings.enable_currencies -%}
<div class="header__inline-language_currency wrapper_language_currency header-bottom-right text-right">
<language-currency class="language-currency--wrapper position-right">
<div class="toggle-language-currency" data-language-currency-toggle>
<div class="top-language-currency justify-end">
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-top-language' %}
{%- if settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endif -%}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-top-currency' %}
{%- endif -%}
{%- unless settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endunless -%}
</div>
</div>
<div class="dropdown-language-currency custom-scrollbar" data-language-currency-dropdown>
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-language' %}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-currency' %}
{%- endif -%}
</div>
</language-currency>
</div>
{%- endif -%}
</div>
</div>
</div>
{% render 'header-mobile',
menu_tab: menu_tab,
page_handle: page_handle,
icon_account: '1',
icon_cart: '1'
%}
</header>
</{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %}>
{%- if menu_tab.size > 3 -%}
<script src="{{ 'details-disclosure.js' | asset_url }}" defer="defer"></script>
{%- endif -%}
{%- unless section.settings.show_search -%}
<script type="text/javascript">
window.hidden_search_header = true;
</script>
<script src="{{ 'halo-quick-search.js' | asset_url }}" defer="defer"></script>
{%- endunless -%}
{% javascript %}
class StickyHeader extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.getElementById('shopify-section-header');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
this.closeMenuDisclosure();
this.closeDropdownPopup();
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
}
reveal() {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
}
reset() {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header', StickyHeader);
{% endjavascript %}
{% render 'header-script' %}
{% schema %}
{
"name": "t:sections.header.name",
"class": "shopify-section-header",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "checkbox",
"id": "show_line_separator",
"label": "t:sections.header.settings.general.label__1",
"default": false
},
{
"type": "checkbox",
"id": "show_sticky_header",
"label": "t:sections.header.settings.general.label__2",
"info": "t:sections.header.settings.general.info",
"default": true
},
{
"type": "checkbox",
"id": "show_wishlist",
"label": "t:sections.header.settings.general.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_customer",
"label": "t:sections.header.settings.general.label__4",
"default": true
},
{
"type": "checkbox",
"id": "show_cart",
"label": "t:sections.header.settings.general.label__5",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__19.content"
},
{
"type": "link_list",
"id": "menu",
"label": "t:sections.header.settings.menu.label__1",
"default": "main-menu"
},
{
"type": "checkbox",
"id": "show_menu_tab",
"label": "t:sections.header.settings.menu.label__2",
"default": true
},
{
"type": "checkbox",
"id": "show_megamenu",
"label": "t:sections.header.settings.menu.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_resize_menu",
"label": "t:sections.header.settings.menu.label__4",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__2.content"
},
{
"type": "color_background",
"id": "header_top_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "header_top_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__3.content"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#808080"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color_background",
"id": "text_bg_active",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type": "color",
"id": "text_color_active",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__4.content"
},
{
"type": "color_background",
"id": "header_bottom_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__5.content"
},
{
"type": "color_background",
"id": "header_mobile_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "header_mobile_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__6.content"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.settings.logo.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__4",
"default": 145
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 120
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 30
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__8",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_icon_width",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__9",
"default": 145
},
{
"type": "range",
"id": "logo_icon_height",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__10",
"default": 145
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.header.settings.header__7.content"
},
{
"type": "checkbox",
"id": "show_search",
"label": "t:sections.header.settings.header_search.label__1",
"default": true
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "full",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.header_search.paragraph.content"
},
{
"type": "color_background",
"id": "search_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type":"color",
"id": "search_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type":"color",
"id": "search_icon_color",
"label": "t:sections.general.settings.color.label__4",
"default": "#808080"
},
{
"type": "header",
"content": "t:sections.header.settings.header__8.content"
},
{
"type": "select",
"id": "lv_1_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_1_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "lv_1_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "700",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_1_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color",
"id": "lv_1_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_1_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_1_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__9.content"
},
{
"type": "select",
"id": "lv_2_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 16
},
{
"type": "select",
"id": "lv_2_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_lv_2.paragraph__1.content"
},
{
"type": "select",
"id": "lv_2_mega_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_mega_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 18
},
{
"type": "select",
"id": "lv_2_mega_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_mega_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "lv_2_bg",
"label": "t:sections.general.settings.color.label__10",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "lv_2_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_2_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_2_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__10.content"
},
{
"type": "textarea",
"id": "sale_item_1",
"label": "t:sections.header.settings.sale_item.label__1"
},
{
"type": "textarea",
"id": "sale_item_2",
"label": "t:sections.header.settings.sale_item.label__2"
},
{
"type": "textarea",
"id": "sale_item_3",
"label": "t:sections.header.settings.sale_item.label__3"
},
{
"type": "color",
"id": "sale_item_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#D12442"
},
{
"type": "header",
"content": "t:sections.header.settings.header__11.content"
},
{
"type": "checkbox",
"id": "show_label",
"label": "t:sections.header.settings.menu_label.label__1",
"default": true
},
{
"type": "checkbox",
"id": "show_label_blink",
"label": "t:sections.header.settings.menu_label.label__5",
"info": "t:sections.header.settings.menu_label.info",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__1.content"
},
{
"type": "textarea",
"id": "new_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "new_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "new_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "new_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#BAE4ED"
},
{
"type": "color",
"id": "new_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__2.content"
},
{
"type": "textarea",
"id": "sale_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "sale_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "sale_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "sale_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#D12442"
},
{
"type": "color",
"id": "sale_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__3.content"
},
{
"type": "textarea",
"id": "hot_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "hot_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "hot_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "hot_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFF993"
},
{
"type": "color",
"id": "hot_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__12.content"
},
{
"type": "checkbox",
"id": "customer_service",
"label": "t:sections.header.settings.customer_service.label__1",
"default": true
},
{
"type": "textarea",
"id": "customer_service_icon",
"label": "t:sections.header.settings.customer_service.label__2"
},
{
"type": "textarea",
"id": "customer_service_text",
"label": "t:sections.header.settings.customer_service.label__3",
"default": "Call us <a href=\"tel:(018)%20900-6690/\">(018) 900-6690</a> or <a href=\"#\"><strong>Live Chat</strong></a>"
},
{
"type": "header",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color_background",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
],
"blocks": [
{
"type": "tab",
"name": "t:sections.header.blocks.tab.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__1.content"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.blocks.tab.settings.logo.label__1"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.blocks.tab.settings.logo.label__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.header.blocks.tab.settings.logo.label__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.header.blocks.tab.settings.logo.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__2.content"
},
{
"type": "text",
"id": "menu",
"label": "t:sections.header.blocks.tab.settings.menu.label__1"
},
{
"type": "page",
"id": "link",
"label": "t:sections.header.blocks.tab.settings.menu.label__2"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2"
}
]
},
{
"type": "megamenu",
"name": "t:sections.header.blocks.mega.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__1.content"
},
{
"type": "text",
"id": "item",
"label": "t:sections.header.blocks.mega.settings.general.label__1",
"default": "Catalog"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__2.content"
},
{
"type": "range",
"id": "column",
"label": "t:sections.header.blocks.mega.settings.column.label__1",
"min": 2,
"max": 6,
"step": 1,
"default": 5
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__3.content"
},
{
"type": "checkbox",
"id": "show_custom_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__1",
"default": true
},
{
"type": "text",
"id": "custom_text_title",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__2",
"default": "Offers"
},
{
"type": "textarea",
"id": "custom_text_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__3"
},
{
"type": "text",
"id": "custom_text_link_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__4",
"default": "See more offers"
},
{
"type": "url",
"id": "custom_text_url",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__5"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__4.content"
},
{
"type": "checkbox",
"id": "show_banner",
"label": "t:sections.header.blocks.mega.settings.banner.label__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__1.content"
},
{
"type": "text",
"id": "banner_width",
"label": "t:sections.header.blocks.mega.settings.banner.label__2",
"info": "t:sections.header.blocks.mega.settings.banner.info"
},
{
"type": "checkbox",
"id": "show_banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__2.content"
},
{
"type": "checkbox",
"id": "show_banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__3.content"
},
{
"type": "checkbox",
"id": "show_banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__4.content"
},
{
"type": "checkbox",
"id": "show_banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__1.content"
},
{
"type": "select",
"id": "heading_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "heading_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "heading_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "heading_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "heading_color",
"type": "color",
"label": "t:sections.general.settings.color.label__7",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__2.content"
},
{
"type": "select",
"id": "link_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "link_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "link_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "link_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "link_color",
"type": "color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__5.content"
},
{
"type": "checkbox",
"id": "show_az_brand",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__1",
"default": false
},
{
"type": "text",
"id": "az_brand_title",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__2",
"default" : "All Brands A-Z"
},
{
"type": "text",
"id": "az_brand_link_text",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__3",
"default" : "See All Brands"
},
{
"type": "url",
"id": "az_brand_url",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__6.content"
},
{
"type": "checkbox",
"id": "show_product",
"label": "t:sections.header.blocks.mega.settings.product_block.label__1",
"default": false
},
{
"type": "text",
"id": "product_title",
"label": "t:sections.header.blocks.mega.settings.product_block.label__2",
"default" : "On Sale Products"
},
{
"type": "collection",
"id": "product_collection",
"label": "t:sections.header.blocks.mega.settings.product_block.label__3"
},
{
"type": "range",
"id": "product_limit",
"label": "t:sections.header.blocks.mega.settings.product_block.label__4",
"min": 3,
"max": 10,
"step": 1,
"default": 6
},
{
"type": "select",
"id": "product_per_row",
"label": "t:sections.header.blocks.mega.settings.product_block.label__5",
"options": [
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}],
"default": "5"
}
]
}
]
}
{% endschema %}- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:34 AM
Thank you!
{{ 'section-header.css' | asset_url | stylesheet_tag }}
{{ 'rtl-section-header.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-search.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-menu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- if section.settings.show_megamenu -%}
<link rel="stylesheet" href="{{ 'component-megamenu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- endif -%}
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="print" onload="this.media='all'">
<noscript>{{ 'component-search.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-menu.css' | asset_url | stylesheet_tag }}</noscript>
{%- if section.settings.show_megamenu -%}
<noscript>{{ 'component-megamenu.css' | asset_url | stylesheet_tag }}</noscript>
{%- endif -%}
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{% render 'header-style' %}
<{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %} class="header-wrapper{% if section.settings.show_line_separator %} header-wrapper--border-bottom{% endif %}">
{%- liquid
if section.blocks.size > 0
assign menu_tab = section.blocks | where: "type", "tab"
assign page_handle = page.handle
endif
-%}
<header class="header header-1{% if section.settings.menu != blank %} header--has-menu{% endif %}">
<div class="header-top">
<div class="container">
<div class="header-top--wrapper{% unless menu_tab.size > 0 and section.settings.show_menu_tab %} header-top--wrapper-2{% endunless %}">
<div class="header-top-left text-left clearfix{% if section.settings.show_menu_tab and menu_tab.size > 0 %} header__multi-page header-menu-tab{% endif %}" >
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% render 'halo-menu-tab-header',
menu_tab: menu_tab,
page_handle: page_handle
%}
{%- endif -%}
</div>
<div class="header-top-center header__logo text-center">
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% assign page_handle = page.handle %}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading header__heading--item">
{%- else -%}
<div class="header__heading header__heading--item">
{%- endif -%}
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if section.settings.logo_type == 'image' -%}
{%- if block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if block.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ block.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- else -%}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading">
{%- else -%}
<div class="header__heading">
{%- endif -%}
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if section.settings.logo_type == 'image' -%}
{%- if section.settings.logo != blank -%}
{%- liquid
assign image = section.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if section.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ section.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if section.settings.logo_icon != blank -%}
{{ section.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- endif -%}
</div>
<div class="header-top-right header__icons text-right clearfix">
{%- if section.settings.show_search -%}
{%- liquid
assign header_search_style = section.settings.header_search_style
-%}
{%- if header_search_style == 'full' -%}
<details-modal class="header__iconItem header__search show-full">
{%- if settings.show_predictive_search -%}
<predictive-search data-loading-text="{{ 'accessibility.loading' | t }}" data-product-to-show="{{ settings.quick_search_to_show }}" class="header__seach--details predictive-search-form">
{%- endif -%}
<details class="header__seach--details">
{% render 'halo-search-layout-full',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</details>
{%- if settings.show_predictive_search -%}
</predictive-search>
{%- endif -%}
</details-modal>
{%- else -%}
<div class="header__iconItem header__search show-icon">
<div class="header__seach--details">
{% render 'halo-search-layout-icon',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</div>
</div>
{%- endif -%}
{%- endif -%}
<div class="header__iconItem header__group">
{%- if shop.customer_accounts_enabled and section.settings.show_customer -%}
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}"
class="header__icon header__icon--account link focus-inset"
{% if routes.account_login_url == '/account/login' %}
{% if settings.customer_login_type == 'popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}
{% endif %}
>
{% render 'icon-account',
icon_account: '1'
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
{%- endif -%}
{%- if settings.show_wishlist and section.settings.show_wishlist -%}
<a href="{{ pages['wish-list'].url }}" class="header__icon header__icon--wishlist link focus-inset">
{% render 'icon-heart',
icon_heart: '1'
%}
<span class="visually-hidden">
{{ 'wishlist.general.title' | t }}
</span>
<div class="wishlist-count-bubble">
<span class="text" aria-hidden="true" data-wishlist-count>0</span>
</div>
</a>
{%- endif -%}
{%- if section.settings.show_cart -%}
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button">
{% render 'icon-cart',
icon_cart: '1'
%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
{%- endif -%}
</div>
</div>
</div>
</div>
</div>
<div class="header-bottom">
<div class="container">
<div class="header-bottom--wrapper">
{%- if section.settings.customer_service and section.settings.customer_service_text != blank -%}
{%- liquid
assign customer_service_icon = section.settings.customer_service_icon
assign customer_service_text = section.settings.customer_service_text
-%}
<div class="header__inline-customer_service header-bottom-left">
<div class="customer-service top-customer-service">
{%- if customer_service_icon != blank -%}
<div class="customer-service--icon">
{{ customer_service_icon }}
</div>
{%- endif -%}
<div class="customer-service--text">
{{ customer_service_text }}
</div>
</div>
</div>
{%- endif -%}
{%- if section.settings.menu != blank -%}
<div class="header-bottom-center{% if section.settings.show_resize_menu %} has-resize-menu{% endif %}" id="HeaderNavigation">
<nav class="header__inline-menu{% unless section.settings.customer_service %} customer-service--hide{% endunless %}{% unless settings.enable_multilang_shopify and settings.enable_currencies %} language-currency--hide{% endunless %}" data-navigation role="navigation" aria-label="{{ 'general.navigation.title' | t }}">
{%- liquid
assign page_type = request.page_type | replace: 'customers/', ''
assign load = false
if page_type == 'search'
assign load = true
endif
-%}
{% render 'halo-navigation-list',
listClass: 'list-menu list-menu--inline',
load: load
%}
</nav>
</div>
{%- endif -%}
{%- if settings.enable_multilang_shopify or settings.enable_currencies -%}
<div class="header__inline-language_currency wrapper_language_currency header-bottom-right text-right">
<language-currency class="language-currency--wrapper position-right">
<div class="toggle-language-currency" data-language-currency-toggle>
<div class="top-language-currency justify-end">
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-top-language' %}
{%- if settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endif -%}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-top-currency' %}
{%- endif -%}
{%- unless settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endunless -%}
</div>
</div>
<div class="dropdown-language-currency custom-scrollbar" data-language-currency-dropdown>
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-language' %}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-currency' %}
{%- endif -%}
</div>
</language-currency>
</div>
{%- endif -%}
</div>
</div>
</div>
{% render 'header-mobile',
menu_tab: menu_tab,
page_handle: page_handle,
icon_account: '1',
icon_cart: '1'
%}
</header>
</{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %}>
{%- if menu_tab.size > 3 -%}
<script src="{{ 'details-disclosure.js' | asset_url }}" defer="defer"></script>
{%- endif -%}
{%- unless section.settings.show_search -%}
<script type="text/javascript">
window.hidden_search_header = true;
</script>
<script src="{{ 'halo-quick-search.js' | asset_url }}" defer="defer"></script>
{%- endunless -%}
{% javascript %}
class StickyHeader extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.getElementById('shopify-section-header');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
this.closeMenuDisclosure();
this.closeDropdownPopup();
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
}
reveal() {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
}
reset() {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header', StickyHeader);
{% endjavascript %}
{% render 'header-script' %}
{% schema %}
{
"name": "t:sections.header.name",
"class": "shopify-section-header",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "checkbox",
"id": "show_line_separator",
"label": "t:sections.header.settings.general.label__1",
"default": false
},
{
"type": "checkbox",
"id": "show_sticky_header",
"label": "t:sections.header.settings.general.label__2",
"info": "t:sections.header.settings.general.info",
"default": true
},
{
"type": "checkbox",
"id": "show_wishlist",
"label": "t:sections.header.settings.general.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_customer",
"label": "t:sections.header.settings.general.label__4",
"default": true
},
{
"type": "checkbox",
"id": "show_cart",
"label": "t:sections.header.settings.general.label__5",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__19.content"
},
{
"type": "link_list",
"id": "menu",
"label": "t:sections.header.settings.menu.label__1",
"default": "main-menu"
},
{
"type": "checkbox",
"id": "show_menu_tab",
"label": "t:sections.header.settings.menu.label__2",
"default": true
},
{
"type": "checkbox",
"id": "show_megamenu",
"label": "t:sections.header.settings.menu.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_resize_menu",
"label": "t:sections.header.settings.menu.label__4",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__2.content"
},
{
"type": "color_background",
"id": "header_top_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "header_top_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__3.content"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#808080"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color_background",
"id": "text_bg_active",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type": "color",
"id": "text_color_active",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__4.content"
},
{
"type": "color_background",
"id": "header_bottom_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__5.content"
},
{
"type": "color_background",
"id": "header_mobile_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "header_mobile_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__6.content"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.settings.logo.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__4",
"default": 145
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 120
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 30
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__8",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_icon_width",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__9",
"default": 145
},
{
"type": "range",
"id": "logo_icon_height",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__10",
"default": 145
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.header.settings.header__7.content"
},
{
"type": "checkbox",
"id": "show_search",
"label": "t:sections.header.settings.header_search.label__1",
"default": true
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "full",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.header_search.paragraph.content"
},
{
"type": "color_background",
"id": "search_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type":"color",
"id": "search_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type":"color",
"id": "search_icon_color",
"label": "t:sections.general.settings.color.label__4",
"default": "#808080"
},
{
"type": "header",
"content": "t:sections.header.settings.header__8.content"
},
{
"type": "select",
"id": "lv_1_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_1_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "lv_1_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "700",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_1_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color",
"id": "lv_1_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_1_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_1_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__9.content"
},
{
"type": "select",
"id": "lv_2_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 16
},
{
"type": "select",
"id": "lv_2_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_lv_2.paragraph__1.content"
},
{
"type": "select",
"id": "lv_2_mega_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_mega_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 18
},
{
"type": "select",
"id": "lv_2_mega_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_mega_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "lv_2_bg",
"label": "t:sections.general.settings.color.label__10",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "lv_2_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_2_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_2_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__10.content"
},
{
"type": "textarea",
"id": "sale_item_1",
"label": "t:sections.header.settings.sale_item.label__1"
},
{
"type": "textarea",
"id": "sale_item_2",
"label": "t:sections.header.settings.sale_item.label__2"
},
{
"type": "textarea",
"id": "sale_item_3",
"label": "t:sections.header.settings.sale_item.label__3"
},
{
"type": "color",
"id": "sale_item_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#D12442"
},
{
"type": "header",
"content": "t:sections.header.settings.header__11.content"
},
{
"type": "checkbox",
"id": "show_label",
"label": "t:sections.header.settings.menu_label.label__1",
"default": true
},
{
"type": "checkbox",
"id": "show_label_blink",
"label": "t:sections.header.settings.menu_label.label__5",
"info": "t:sections.header.settings.menu_label.info",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__1.content"
},
{
"type": "textarea",
"id": "new_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "new_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "new_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "new_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#BAE4ED"
},
{
"type": "color",
"id": "new_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__2.content"
},
{
"type": "textarea",
"id": "sale_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "sale_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "sale_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "sale_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#D12442"
},
{
"type": "color",
"id": "sale_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__3.content"
},
{
"type": "textarea",
"id": "hot_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "hot_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "hot_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "hot_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFF993"
},
{
"type": "color",
"id": "hot_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__12.content"
},
{
"type": "checkbox",
"id": "customer_service",
"label": "t:sections.header.settings.customer_service.label__1",
"default": true
},
{
"type": "textarea",
"id": "customer_service_icon",
"label": "t:sections.header.settings.customer_service.label__2"
},
{
"type": "textarea",
"id": "customer_service_text",
"label": "t:sections.header.settings.customer_service.label__3",
"default": "Call us <a href=\"tel:(018)%20900-6690/\">(018) 900-6690</a> or <a href=\"#\"><strong>Live Chat</strong></a>"
},
{
"type": "header",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color_background",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
],
"blocks": [
{
"type": "tab",
"name": "t:sections.header.blocks.tab.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__1.content"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.blocks.tab.settings.logo.label__1"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.blocks.tab.settings.logo.label__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.header.blocks.tab.settings.logo.label__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.header.blocks.tab.settings.logo.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__2.content"
},
{
"type": "text",
"id": "menu",
"label": "t:sections.header.blocks.tab.settings.menu.label__1"
},
{
"type": "page",
"id": "link",
"label": "t:sections.header.blocks.tab.settings.menu.label__2"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2"
}
]
},
{
"type": "megamenu",
"name": "t:sections.header.blocks.mega.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__1.content"
},
{
"type": "text",
"id": "item",
"label": "t:sections.header.blocks.mega.settings.general.label__1",
"default": "Catalog"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__2.content"
},
{
"type": "range",
"id": "column",
"label": "t:sections.header.blocks.mega.settings.column.label__1",
"min": 2,
"max": 6,
"step": 1,
"default": 5
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__3.content"
},
{
"type": "checkbox",
"id": "show_custom_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__1",
"default": true
},
{
"type": "text",
"id": "custom_text_title",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__2",
"default": "Offers"
},
{
"type": "textarea",
"id": "custom_text_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__3"
},
{
"type": "text",
"id": "custom_text_link_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__4",
"default": "See more offers"
},
{
"type": "url",
"id": "custom_text_url",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__5"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__4.content"
},
{
"type": "checkbox",
"id": "show_banner",
"label": "t:sections.header.blocks.mega.settings.banner.label__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__1.content"
},
{
"type": "text",
"id": "banner_width",
"label": "t:sections.header.blocks.mega.settings.banner.label__2",
"info": "t:sections.header.blocks.mega.settings.banner.info"
},
{
"type": "checkbox",
"id": "show_banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__2.content"
},
{
"type": "checkbox",
"id": "show_banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__3.content"
},
{
"type": "checkbox",
"id": "show_banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__4.content"
},
{
"type": "checkbox",
"id": "show_banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__1.content"
},
{
"type": "select",
"id": "heading_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "heading_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "heading_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "heading_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "heading_color",
"type": "color",
"label": "t:sections.general.settings.color.label__7",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__2.content"
},
{
"type": "select",
"id": "link_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "link_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "link_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "link_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "link_color",
"type": "color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__5.content"
},
{
"type": "checkbox",
"id": "show_az_brand",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__1",
"default": false
},
{
"type": "text",
"id": "az_brand_title",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__2",
"default" : "All Brands A-Z"
},
{
"type": "text",
"id": "az_brand_link_text",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__3",
"default" : "See All Brands"
},
{
"type": "url",
"id": "az_brand_url",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__6.content"
},
{
"type": "checkbox",
"id": "show_product",
"label": "t:sections.header.blocks.mega.settings.product_block.label__1",
"default": false
},
{
"type": "text",
"id": "product_title",
"label": "t:sections.header.blocks.mega.settings.product_block.label__2",
"default" : "On Sale Products"
},
{
"type": "collection",
"id": "product_collection",
"label": "t:sections.header.blocks.mega.settings.product_block.label__3"
},
{
"type": "range",
"id": "product_limit",
"label": "t:sections.header.blocks.mega.settings.product_block.label__4",
"min": 3,
"max": 10,
"step": 1,
"default": 6
},
{
"type": "select",
"id": "product_per_row",
"label": "t:sections.header.blocks.mega.settings.product_block.label__5",
"options": [
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}],
"default": "5"
}
]
}
]
}
{% endschema %}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:36 AM
{{ 'section-header.css' | asset_url | stylesheet_tag }}
{{ 'rtl-section-header.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-search.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-menu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- if section.settings.show_megamenu -%}
<link rel="stylesheet" href="{{ 'component-megamenu.css' | asset_url }}" media="print" onload="this.media='all'">
{%- endif -%}
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="print" onload="this.media='all'">
<noscript>{{ 'component-search.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-menu.css' | asset_url | stylesheet_tag }}</noscript>
{%- if section.settings.show_megamenu -%}
<noscript>{{ 'component-megamenu.css' | asset_url | stylesheet_tag }}</noscript>
{%- endif -%}
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{% render 'header-style' %}
<{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %} class="header-wrapper{% if section.settings.show_line_separator %} header-wrapper--border-bottom{% endif %}">
{%- liquid
if section.blocks.size > 0
assign menu_tab = section.blocks | where: "type", "tab"
assign page_handle = page.handle
endif
-%}
<header class="header header-1{% if section.settings.menu != blank %} header--has-menu{% endif %}">
<div class="header-top">
<div class="container">
<div class="header-top--wrapper{% unless menu_tab.size > 0 and section.settings.show_menu_tab %} header-top--wrapper-2{% endunless %}">
<div class="header-top-left text-left clearfix{% if section.settings.show_menu_tab and menu_tab.size > 0 %} header__multi-page header-menu-tab{% endif %}" >
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% render 'halo-menu-tab-header',
menu_tab: menu_tab,
page_handle: page_handle
%}
{%- endif -%}
</div>
<div class="header-top-center header__logo text-center">
{%- if section.settings.show_menu_tab and menu_tab.size > 0 -%}
{% assign page_handle = page.handle %}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading header__heading--item">
{%- else -%}
<div class="header__heading header__heading--item">
{%- endif -%}
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if section.settings.logo_type == 'image' -%}
{%- if block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if block.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ block.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- else -%}
{%- if request.page_type == 'index' -%}
<h1 class="header__heading">
{%- else -%}
<div class="header__heading">
{%- endif -%}
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if section.settings.logo_type == 'image' -%}
{%- if section.settings.logo != blank -%}
{%- liquid
assign image = section.settings.logo
assign image_size = section.settings.logo_width | append: 'x'
-%}
<img
srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x"
src="{{ image | img_url: image_size }}"
loading="lazy"
class="header__heading-logo"
alt="{{ image.alt | default: shop.name | escape }}"
width="{{ image.width | replace: 'px', '' }}"
height="{{ image.height | replace: 'px', '' }}"
>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'text' -%}
{%- if section.settings.logo_text != blank -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ section.settings.logo_text }}</span>
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif section.settings.logo_type == 'icon' -%}
{%- if section.settings.logo_icon != blank -%}
{{ section.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ section.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- if request.page_type == 'index' -%}
</h1>
{%- else -%}
</div>
{%- endif -%}
{%- endif -%}
</div>
<div class="header-top-right header__icons text-right clearfix">
{%- if section.settings.show_search -%}
{%- liquid
assign header_search_style = section.settings.header_search_style
-%}
{%- if header_search_style == 'full' -%}
<details-modal class="header__iconItem header__search show-full">
{%- if settings.show_predictive_search -%}
<predictive-search data-loading-text="{{ 'accessibility.loading' | t }}" data-product-to-show="{{ settings.quick_search_to_show }}" class="header__seach--details predictive-search-form">
{%- endif -%}
<details class="header__seach--details">
{% render 'halo-search-layout-full',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</details>
{%- if settings.show_predictive_search -%}
</predictive-search>
{%- endif -%}
</details-modal>
{%- else -%}
<div class="header__iconItem header__search show-icon">
<div class="header__seach--details">
{% render 'halo-search-layout-icon',
icon_search: '1',
search_custom_class: 'search-modal__form--mobile style-2'
%}
</div>
</div>
{%- endif -%}
{%- endif -%}
<div class="header__iconItem header__group">
{%- if shop.customer_accounts_enabled and section.settings.show_customer -%}
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}"
class="header__icon header__icon--account link focus-inset"
{% if routes.account_login_url == '/account/login' %}
{% if settings.customer_login_type == 'popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}
{% endif %}
>
{% render 'icon-account',
icon_account: '1'
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
{%- endif -%}
{%- if settings.show_wishlist and section.settings.show_wishlist -%}
<a href="{{ pages['wish-list'].url }}" class="header__icon header__icon--wishlist link focus-inset">
{% render 'icon-heart',
icon_heart: '1'
%}
<span class="visually-hidden">
{{ 'wishlist.general.title' | t }}
</span>
<div class="wishlist-count-bubble">
<span class="text" aria-hidden="true" data-wishlist-count>0</span>
</div>
</a>
{%- endif -%}
{%- if section.settings.show_cart -%}
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button">
{% render 'icon-cart',
icon_cart: '1'
%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
{%- endif -%}
</div>
</div>
</div>
</div>
</div>
<div class="header-bottom">
<div class="container">
<div class="header-bottom--wrapper">
{%- if section.settings.customer_service and section.settings.customer_service_text != blank -%}
{%- liquid
assign customer_service_icon = section.settings.customer_service_icon
assign customer_service_text = section.settings.customer_service_text
-%}
<div class="header__inline-customer_service header-bottom-left">
<div class="customer-service top-customer-service">
{%- if customer_service_icon != blank -%}
<div class="customer-service--icon">
{{ customer_service_icon }}
</div>
{%- endif -%}
<div class="customer-service--text">
{{ customer_service_text }}
</div>
</div>
</div>
{%- endif -%}
{%- if section.settings.menu != blank -%}
<div class="header-bottom-center{% if section.settings.show_resize_menu %} has-resize-menu{% endif %}" id="HeaderNavigation">
<nav class="header__inline-menu{% unless section.settings.customer_service %} customer-service--hide{% endunless %}{% unless settings.enable_multilang_shopify and settings.enable_currencies %} language-currency--hide{% endunless %}" data-navigation role="navigation" aria-label="{{ 'general.navigation.title' | t }}">
{%- liquid
assign page_type = request.page_type | replace: 'customers/', ''
assign load = false
if page_type == 'search'
assign load = true
endif
-%}
{% render 'halo-navigation-list',
listClass: 'list-menu list-menu--inline',
load: load
%}
</nav>
</div>
{%- endif -%}
{%- if settings.enable_multilang_shopify or settings.enable_currencies -%}
<div class="header__inline-language_currency wrapper_language_currency header-bottom-right text-right">
<language-currency class="language-currency--wrapper position-right">
<div class="toggle-language-currency" data-language-currency-toggle>
<div class="top-language-currency justify-end">
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-top-language' %}
{%- if settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endif -%}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-top-currency' %}
{%- endif -%}
{%- unless settings.enable_auto_currency -%}
<span class="dropdown-icon" role="button" aria-label="{{ 'accessibility.dropdown' | t }}" tabindex="0">
{% render 'icon-sort-down' %}
</span>
{%- endunless -%}
</div>
</div>
<div class="dropdown-language-currency custom-scrollbar" data-language-currency-dropdown>
{%- if settings.enable_multilang_shopify -%}
{% render 'halo-language' %}
{%- endif -%}
{%- if settings.enable_currencies -%}
{% render 'halo-currency' %}
{%- endif -%}
</div>
</language-currency>
</div>
{%- endif -%}
</div>
</div>
</div>
{% render 'header-mobile',
menu_tab: menu_tab,
page_handle: page_handle,
icon_account: '1',
icon_cart: '1'
%}
</header>
</{% if section.settings.show_sticky_header %}sticky-header{% else %}div{% endif %}>
{%- if menu_tab.size > 3 -%}
<script src="{{ 'details-disclosure.js' | asset_url }}" defer="defer"></script>
{%- endif -%}
{%- unless section.settings.show_search -%}
<script type="text/javascript">
window.hidden_search_header = true;
</script>
<script src="{{ 'halo-quick-search.js' | asset_url }}" defer="defer"></script>
{%- endunless -%}
{% javascript %}
class StickyHeader extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.getElementById('shopify-section-header');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
this.closeMenuDisclosure();
this.closeDropdownPopup();
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
}
reveal() {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
}
reset() {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header', StickyHeader);
{% endjavascript %}
{% render 'header-script' %}
{% schema %}
{
"name": "t:sections.header.name",
"class": "shopify-section-header",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "checkbox",
"id": "show_line_separator",
"label": "t:sections.header.settings.general.label__1",
"default": false
},
{
"type": "checkbox",
"id": "show_sticky_header",
"label": "t:sections.header.settings.general.label__2",
"info": "t:sections.header.settings.general.info",
"default": true
},
{
"type": "checkbox",
"id": "show_wishlist",
"label": "t:sections.header.settings.general.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_customer",
"label": "t:sections.header.settings.general.label__4",
"default": true
},
{
"type": "checkbox",
"id": "show_cart",
"label": "t:sections.header.settings.general.label__5",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__19.content"
},
{
"type": "link_list",
"id": "menu",
"label": "t:sections.header.settings.menu.label__1",
"default": "main-menu"
},
{
"type": "checkbox",
"id": "show_menu_tab",
"label": "t:sections.header.settings.menu.label__2",
"default": true
},
{
"type": "checkbox",
"id": "show_megamenu",
"label": "t:sections.header.settings.menu.label__3",
"default": true
},
{
"type": "checkbox",
"id": "show_resize_menu",
"label": "t:sections.header.settings.menu.label__4",
"default": true
},
{
"type": "header",
"content": "t:sections.header.settings.header__2.content"
},
{
"type": "color_background",
"id": "header_top_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "header_top_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__3.content"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#000000"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#808080"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color_background",
"id": "text_bg_active",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type": "color",
"id": "text_color_active",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__4.content"
},
{
"type": "color_background",
"id": "header_bottom_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__5.content"
},
{
"type": "color_background",
"id": "header_mobile_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "header_mobile_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__6.content"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.settings.logo.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_width",
"min": 50,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__4",
"default": 145
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 120
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 30
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__8",
"info": "t:sections.header.settings.logo.info"
},
{
"type": "range",
"id": "logo_icon_width",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__9",
"default": 145
},
{
"type": "range",
"id": "logo_icon_height",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__10",
"default": 145
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.header.settings.header__7.content"
},
{
"type": "checkbox",
"id": "show_search",
"label": "t:sections.header.settings.header_search.label__1",
"default": true
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "full",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.header_search.paragraph.content"
},
{
"type": "color_background",
"id": "search_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#2E2E2E"
},
{
"type":"color",
"id": "search_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type":"color",
"id": "search_icon_color",
"label": "t:sections.general.settings.color.label__4",
"default": "#808080"
},
{
"type": "header",
"content": "t:sections.header.settings.header__8.content"
},
{
"type": "select",
"id": "lv_1_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_1_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "lv_1_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "700",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_1_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color",
"id": "lv_1_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_1_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_1_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__9.content"
},
{
"type": "select",
"id": "lv_2_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 16
},
{
"type": "select",
"id": "lv_2_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_lv_2.paragraph__1.content"
},
{
"type": "select",
"id": "lv_2_mega_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "lv_2_mega_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 18
},
{
"type": "select",
"id": "lv_2_mega_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "lv_2_mega_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__1.content"
},
{
"type": "color_background",
"id": "lv_2_bg",
"label": "t:sections.general.settings.color.label__10",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "lv_2_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__2.content"
},
{
"type": "color",
"id": "lv_2_color_hover",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.color.paragraph__3.content"
},
{
"type": "color",
"id": "lv_2_color_mobile",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.settings.header__10.content"
},
{
"type": "textarea",
"id": "sale_item_1",
"label": "t:sections.header.settings.sale_item.label__1"
},
{
"type": "textarea",
"id": "sale_item_2",
"label": "t:sections.header.settings.sale_item.label__2"
},
{
"type": "textarea",
"id": "sale_item_3",
"label": "t:sections.header.settings.sale_item.label__3"
},
{
"type": "color",
"id": "sale_item_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#D12442"
},
{
"type": "header",
"content": "t:sections.header.settings.header__11.content"
},
{
"type": "checkbox",
"id": "show_label",
"label": "t:sections.header.settings.menu_label.label__1",
"default": true
},
{
"type": "checkbox",
"id": "show_label_blink",
"label": "t:sections.header.settings.menu_label.label__5",
"info": "t:sections.header.settings.menu_label.info",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__1.content"
},
{
"type": "textarea",
"id": "new_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "new_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "new_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "new_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#BAE4ED"
},
{
"type": "color",
"id": "new_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__2.content"
},
{
"type": "textarea",
"id": "sale_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "sale_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "sale_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "sale_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#D12442"
},
{
"type": "color",
"id": "sale_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.menu_label.paragraph__3.content"
},
{
"type": "textarea",
"id": "hot_label_1",
"label": "t:sections.header.settings.menu_label.label__2"
},
{
"type": "textarea",
"id": "hot_label_2",
"label": "t:sections.header.settings.menu_label.label__3"
},
{
"type": "textarea",
"id": "hot_label_3",
"label": "t:sections.header.settings.menu_label.label__4"
},
{
"type": "color_background",
"id": "hot_label_bg",
"label": "t:sections.general.settings.color.label__1",
"default": "#FFF993"
},
{
"type": "color",
"id": "hot_label_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.header.settings.header__12.content"
},
{
"type": "checkbox",
"id": "customer_service",
"label": "t:sections.header.settings.customer_service.label__1",
"default": true
},
{
"type": "textarea",
"id": "customer_service_icon",
"label": "t:sections.header.settings.customer_service.label__2"
},
{
"type": "textarea",
"id": "customer_service_text",
"label": "t:sections.header.settings.customer_service.label__3",
"default": "Call us <a href=\"tel:(018)%20900-6690/\">(018) 900-6690</a> or <a href=\"#\"><strong>Live Chat</strong></a>"
},
{
"type": "header",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color_background",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
],
"blocks": [
{
"type": "tab",
"name": "t:sections.header.blocks.tab.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__1.content"
},
{
"type": "image_picker",
"id": "logo",
"label": "t:sections.header.blocks.tab.settings.logo.label__1"
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.blocks.tab.settings.logo.label__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.header.blocks.tab.settings.logo.label__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.header.blocks.tab.settings.logo.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.tab.settings.header__2.content"
},
{
"type": "text",
"id": "menu",
"label": "t:sections.header.blocks.tab.settings.menu.label__1"
},
{
"type": "page",
"id": "link",
"label": "t:sections.header.blocks.tab.settings.menu.label__2"
},
{
"type": "color_background",
"id": "text_bg",
"label": "t:sections.general.settings.color.label__1"
},
{
"type": "color",
"id": "text_color",
"label": "t:sections.general.settings.color.label__2"
}
]
},
{
"type": "megamenu",
"name": "t:sections.header.blocks.mega.name",
"settings": [
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__1.content"
},
{
"type": "text",
"id": "item",
"label": "t:sections.header.blocks.mega.settings.general.label__1",
"default": "Catalog"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__2.content"
},
{
"type": "range",
"id": "column",
"label": "t:sections.header.blocks.mega.settings.column.label__1",
"min": 2,
"max": 6,
"step": 1,
"default": 5
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__3.content"
},
{
"type": "checkbox",
"id": "show_custom_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__1",
"default": true
},
{
"type": "text",
"id": "custom_text_title",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__2",
"default": "Offers"
},
{
"type": "textarea",
"id": "custom_text_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__3"
},
{
"type": "text",
"id": "custom_text_link_text",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__4",
"default": "See more offers"
},
{
"type": "url",
"id": "custom_text_url",
"label": "t:sections.header.blocks.mega.settings.custom-text.label__5"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__4.content"
},
{
"type": "checkbox",
"id": "show_banner",
"label": "t:sections.header.blocks.mega.settings.banner.label__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__1.content"
},
{
"type": "text",
"id": "banner_width",
"label": "t:sections.header.blocks.mega.settings.banner.label__2",
"info": "t:sections.header.blocks.mega.settings.banner.info"
},
{
"type": "checkbox",
"id": "show_banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_1",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__2.content"
},
{
"type": "checkbox",
"id": "show_banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_2",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__3.content"
},
{
"type": "checkbox",
"id": "show_banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_3",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.header.blocks.mega.settings.banner.paragraph__4.content"
},
{
"type": "checkbox",
"id": "show_banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__3"
},
{
"type": "image_picker",
"id": "banner_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__4"
},
{
"type": "text",
"id": "banner_title_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__5"
},
{
"type": "text",
"id": "banner_text_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__6"
},
{
"type": "url",
"id": "banner_url_4",
"label": "t:sections.header.blocks.mega.settings.banner.label__7"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__1.content"
},
{
"type": "select",
"id": "heading_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "heading_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "heading_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "heading_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "heading_color",
"type": "color",
"label": "t:sections.general.settings.color.label__7",
"default": "#000000"
},
{
"type": "paragraph",
"content": "t:sections.general.settings.typography.paragraph__2.content"
},
{
"type": "select",
"id": "link_font",
"label": "t:settings_schema.typography.settings.font.label",
"options": [
{
"value": "font_1",
"label": "t:settings_schema.typography.settings.font.options__1"
},
{
"value": "font_2",
"label": "t:settings_schema.typography.settings.font.options__2"
},
{
"value": "font_3",
"label": "t:settings_schema.typography.settings.font.options__3"
}],
"default": "font_1"
},
{
"type": "range",
"id": "link_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 10,
"max": 20,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "link_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "400",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "link_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "capitalize",
"options": [
{
"value": "none",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"id": "link_color",
"type": "color",
"label": "t:sections.general.settings.color.label__2",
"default": "#000000"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__5.content"
},
{
"type": "checkbox",
"id": "show_az_brand",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__1",
"default": false
},
{
"type": "text",
"id": "az_brand_title",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__2",
"default" : "All Brands A-Z"
},
{
"type": "text",
"id": "az_brand_link_text",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__3",
"default" : "See All Brands"
},
{
"type": "url",
"id": "az_brand_url",
"label": "t:sections.header.blocks.mega.settings.azbrands.label__4"
},
{
"type": "header",
"content": "t:sections.header.blocks.mega.settings.header__6.content"
},
{
"type": "checkbox",
"id": "show_product",
"label": "t:sections.header.blocks.mega.settings.product_block.label__1",
"default": false
},
{
"type": "text",
"id": "product_title",
"label": "t:sections.header.blocks.mega.settings.product_block.label__2",
"default" : "On Sale Products"
},
{
"type": "collection",
"id": "product_collection",
"label": "t:sections.header.blocks.mega.settings.product_block.label__3"
},
{
"type": "range",
"id": "product_limit",
"label": "t:sections.header.blocks.mega.settings.product_block.label__4",
"min": 3,
"max": 10,
"step": 1,
"default": 6
},
{
"type": "select",
"id": "product_per_row",
"label": "t:sections.header.blocks.mega.settings.product_block.label__5",
"options": [
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}],
"default": "5"
}
]
}
]
}
{% endschema %}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:46 AM
Hi @BlackenWillow,
Looks like the code is in the header-mobile.liquid file, can you send me the code again?
☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:49 AM
Yes, sorry about the duplicate replies. It was giving me an error on my end.
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="all" onload="this.media='all'">
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{%- liquid
assign background = section.settings.background
assign style_function_group = section.settings.style_function_group
assign show_header_transparent_mobile = section.settings.show_header_transparent_mobile
if show_header_transparent_mobile
assign color_modify = section.settings.color_modify | times: 0.01
assign color_modify_2 = section.settings.color_modify_2 | times: 0.01
assign color_modify_1_text = section.settings.color_modify_1_text
assign color_modify_1_icon = section.settings.color_modify_1_icon
assign color_modify_2_text = section.settings.color_modify_2_text
assign color_modify_2_icon = section.settings.color_modify_2_icon
endif
if style_function_group == '4' or style_function_group == '6'
assign icon_account = '3'
assign icon_cart = '4'
elsif style_function_group == '5'
assign icon_account = '3'
assign icon_cart = '9'
elsif style_function_group == '7'
assign icon_account = '5'
assign icon_cart = '5'
elsif style_function_group == '8'
assign icon_account = '2'
assign icon_cart = '1'
elsif style_function_group == '9'
assign icon_account = '3'
assign icon_cart = '2'
elsif style_function_group == '10'
assign icon_account = '4'
assign icon_cart = '3'
elsif style_function_group == '11'
assign icon_account = '1'
assign icon_cart = '6'
else
assign icon_account = '1'
assign icon_cart = '1'
endif
assign block_search = section.blocks | where: "type", "search"
for block in block_search
assign header_search_style = block.settings.header_search_style
endfor
-%}
<{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile data-sticky-type="{{ section.settings.sticky_header_type }}"{% else %}div{% endif %} id="shopify-section__header-mobile" class="header-wrapper header-group"
style="--header-mobile-bg: {% if section.settings.gradient != blank %}{{ section.settings.gradient }}{% else %}{{ background }}{% endif %};
{% if show_header_transparent_mobile %}
--color-modify: {{ background | color_modify: 'alpha', color_modify }};
--color-modify-2: {{ background | color_modify: 'alpha', color_modify_2 }};
--color-modify-1-text: {{ color_modify_1_text }};
--color-modify-1-icon: {{ color_modify_1_icon }};
--color-modify-2-text: {{ color_modify_2_text }};
--color-modify-2-icon: {{ color_modify_2_icon }};
{% endif %}">
<header class="header-mobile{% if show_header_transparent_mobile %} header-transparent{% endif %} header-mobile-style-{{ header_search_style }} element-spacing" style="--spacing-top-mobile: {{ section.settings.padding_top | times: 0.5 | round: 0 | append: 'px' }};--spacing-bottom-mobile: {{ section.settings.padding_bottom | times: 0.5 | round: 0 | append: 'px' }};">
<div class="container">
<div class="header-mobile--wrapper">
{%- for block in section.blocks -%}
<div class="header-mobile__item--{{ block.type }}">
{%- case block.type -%}
{%- when 'menu' -%}
<div class="header-mobile--icon item__mobile--hamburger" style="--icon-color: {{ block.settings.icon_color }};">
<a class="mobileMenu-toggle" href="/" data-mobile-menu aria-label="menu">
<span class="mobileMenu-toggle__Icon"></span>
</a>
</div>
{%- when 'search' -%}
{%- if header_search_style != 'full' -%}
<side-drawer-opener class="header-mobile--icon" data-side-drawer="#Drawer-Search" style="--icon-color: {{ block.settings.icon_color }};">
<button class="header__iconItem header__search t-button link focus-inset" type="button" aria-haspopup="dialog">
<details>
<summary class="header__icon header__icon--search header__icon--summary link focus-inset modal__toggle" aria-haspopup="dialog" aria-label="{{ 'general.search.search' | t }}" data-search-mobile role="button" tabindex="0">
<span>
{% render 'icon-search',
icon_search: icon_search,
class: 'modal__toggle-open icon icon-search'
%}
{% render 'icon-close',
icon_search: icon_search,
class: 'modal__toggle-close icon icon-close'
%}
</span>
</summary>
</details>
</button>
</side-drawer-opener>
{%- endif -%}
{%- when 'logo' -%}
<div class="header-mobile--icon">
{%- if menu_tab.size > 0 -%}
<{% if request.page_type == 'index' %}h1{% else %}div{% endif %} class="header__heading header__heading--item item-{{ count }}" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo test" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
</{% if request.page_type == 'index' %}h1{% else %}div{% endif %}>
{%- else -%}
<div class="header__heading" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
</div>
{%- endif -%}
</div>
{%- when 'customer' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};">
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}" class="header__icon header__icon--account link focus-inset" {% if routes.account_login_url == '/account/login' %}{% if settings.customer_login_type=='popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}{% endif %} role="button">
{% render 'icon-account',
icon_account: icon_account
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
</div>
{%- when 'cart' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};--cart-count-background: {{ block.settings.cart_count_background }};--cart-count-color: {{ block.settings.cart_count_color }};">
<a {% if settings.show_quick_cart %}{% if routes.account_login_url == '/account/login' %}{% if settings.quick_cart_type=='popup' %} data-open-cart-popup href="javascript:void(0)" {% else %}data-cart-sidebar href="javascript:void(0)" {% endif %}{% endif %}{% else %}href="{{ routes.cart_url }}" {% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble mobile" role="button">
{%- if style_function_group == '2' -%}
{% render 'icon-cart-special' %}
{%- else -%}
{% render 'icon-cart',
icon_cart: icon_cart
%}
{%- endif -%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
</div>
{%- endcase -%}
</div>
{%- endfor -%}
</div>
</div>
{%- if header_search_style == 'full' -%}
<div class="header-mobile-search">
<div class="header__search--mobile">
<a href="#" class="halo-sidebar-close" data-search-close>
{% render 'icon-close' %}
</a>
</div>
</div>
{%- endif -%}
</header>
</{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile{% else %}div{% endif %}>
{% javascript %}
class StickyHeaderMobile extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.querySelector('.shopify-section__header-mobile');
this.header_2 = document.querySelector('.shopify-section__header-mobile .header-mobile');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.stickyHeaderType = this.getAttribute('data-sticky-type');
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
this.setHeaderHeight();
window.matchMedia('(max-width: 1024px)').addEventListener('change', this.setHeaderHeight.bind(this));
this.backgroundTransparent();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
setHeaderHeight() {
if(document.querySelector('.section-header-single-line')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
if(document.querySelector('.header-mobile-style-full')) {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `calc(${this.header_2.offsetHeight}px + 40px)`);
} else {
this.header.style.setProperty('--header-height', `calc(${this.header.offsetHeight}px + 40px)`);
}
} else {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
this.header.style.setProperty('--header-height', `${this.header.offsetHeight}px`);
}
}
}
}
backgroundTransparent() {
if (document.querySelector('.header-mobile.header-transparent')) {
this.header.classList.add('enable-bg-transparent');
}
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky');
document.body.classList.add('scroll-up');
return
}
}
this.closeMenuDisclosure();
this.closeDropdownPopup();
}
reveal() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.add('scroll-up');
return
}
}
}
reset() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-up');
return
}
}
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header-mobile', StickyHeaderMobile);
{% endjavascript %}
{% schema %}
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"limit": 1,
"class": "shopify-section__header-mobile",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "color",
"id": "background",
"label": "t:sections.general.settings.color.label__1",
"default": "#ffffff"
},
{
"type": "color_background",
"id": "gradient",
"label": "t:sections.general.settings.color.label__20"
},
{
"type": "select",
"id": "style_function_group",
"label": "t:sections.header.settings.header-2.label__1",
"default": "1",
"options": [
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
},
{
"value": "6",
"label": "6"
},
{
"value": "7",
"label": "7"
},
{
"value": "8",
"label": "8"
},
{
"value": "9",
"label": "9"
},
{
"value": "10",
"label": "10"
},
{
"value": "11",
"label": "11"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__23.content"
},
{
"type": "select",
"id": "sticky_header_type",
"label": "t:sections.header.settings.general.label__6",
"default": "up",
"options": [
{
"value": "none",
"label": "t:sections.header.settings.general.options__3"
},
{
"value": "up",
"label": "t:sections.header.settings.general.options__1"
},
{
"value": "down",
"label": "t:sections.header.settings.general.options__2"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__21.content"
},
{
"type": "checkbox",
"id": "show_header_transparent_mobile",
"label": "t:sections.header.settings.transparent-header.label__2",
"info":"t:sections.header.settings.transparent-header.info__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__1.content"
},
{
"type": "range",
"id": "color_modify",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 20
},
{
"type": "color",
"id": "color_modify_1_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_1_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__2.content"
},
{
"type": "range",
"id": "color_modify_2",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 100
},
{
"type": "color",
"id": "color_modify_2_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_2_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.general.settings.padding.name"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__1",
"default": 0
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__2",
"default": 0
}
],
"blocks": [
{
"type": "menu",
"name": "Menu",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "search",
"name": "t:sections.header.settings.header_search.name",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "icon",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "icon-2",
"label": "t:sections.header.settings.header_search.options__9"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
}
]
},
{
"type": "logo",
"name": "t:sections.header.settings.header__6.content",
"limit": 1,
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3"
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 65
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.general.settings.style.name"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
]
},
{
"type": "customer",
"name": "Customer",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "cart",
"name": "Cart",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
}
],
"presets": [
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"settings": {
"background": "#ffffff",
"gradient": "",
"style_function_group": "1",
"sticky_header_type": "up",
"show_header_transparent_mobile": false,
"color_modify": 20,
"color_modify_1_text": "#ffffff",
"color_modify_1_icon": "#ffffff",
"color_modify_2": 100,
"color_modify_2_text": "#ffffff",
"color_modify_2_icon": "#ffffff",
"padding_top": 0,
"padding_bottom": 0
},
"blocks": [
{
"type": "menu",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "search",
"settings": {
"icon_color": "#232323",
"header_search_style": "icon"
}
},
{
"type": "logo",
"settings": {
"logo_type": "image",
"logo_mobile": "shopify:\/\/shop_images\/Halo-logo.png",
"logo_width_mobile": 100,
"logo_text": "",
"logo_icon": "",
"logo_icon_width_mobile": 100,
"logo_icon_height_mobile": 50,
"logo_font_size": 15,
"logo_font_weight": "900",
"logo_text_transform": "uppercase",
"logo_color": "#232323"
}
},
{
"type": "customer",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "cart",
"settings": {
"cart_count_background": "#bc1b3b",
"cart_count_color": "#ffffff",
"icon_color": "#232323"
}
}
]
}
],
"enabled_on": {
"groups": ["header" ]
}
}
{% endschema %}- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
10:55 AM
This is an accepted solution.
Hi @BlackenWillow,
Please change all code:
<link rel="stylesheet" href="{{ 'component-menu-mobile.css' | asset_url }}" media="all" onload="this.media='all'">
<noscript>{{ 'component-menu-mobile.css' | asset_url | stylesheet_tag }}</noscript>
{%- liquid
assign background = section.settings.background
assign style_function_group = section.settings.style_function_group
assign show_header_transparent_mobile = section.settings.show_header_transparent_mobile
if show_header_transparent_mobile
assign color_modify = section.settings.color_modify | times: 0.01
assign color_modify_2 = section.settings.color_modify_2 | times: 0.01
assign color_modify_1_text = section.settings.color_modify_1_text
assign color_modify_1_icon = section.settings.color_modify_1_icon
assign color_modify_2_text = section.settings.color_modify_2_text
assign color_modify_2_icon = section.settings.color_modify_2_icon
endif
if style_function_group == '4' or style_function_group == '6'
assign icon_account = '3'
assign icon_cart = '4'
elsif style_function_group == '5'
assign icon_account = '3'
assign icon_cart = '9'
elsif style_function_group == '7'
assign icon_account = '5'
assign icon_cart = '5'
elsif style_function_group == '8'
assign icon_account = '2'
assign icon_cart = '1'
elsif style_function_group == '9'
assign icon_account = '3'
assign icon_cart = '2'
elsif style_function_group == '10'
assign icon_account = '4'
assign icon_cart = '3'
elsif style_function_group == '11'
assign icon_account = '1'
assign icon_cart = '6'
else
assign icon_account = '1'
assign icon_cart = '1'
endif
assign block_search = section.blocks | where: "type", "search"
for block in block_search
assign header_search_style = block.settings.header_search_style
endfor
-%}
<{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile data-sticky-type="{{ section.settings.sticky_header_type }}"{% else %}div{% endif %} id="shopify-section__header-mobile" class="header-wrapper header-group"
style="--header-mobile-bg: {% if section.settings.gradient != blank %}{{ section.settings.gradient }}{% else %}{{ background }}{% endif %};
{% if show_header_transparent_mobile %}
--color-modify: {{ background | color_modify: 'alpha', color_modify }};
--color-modify-2: {{ background | color_modify: 'alpha', color_modify_2 }};
--color-modify-1-text: {{ color_modify_1_text }};
--color-modify-1-icon: {{ color_modify_1_icon }};
--color-modify-2-text: {{ color_modify_2_text }};
--color-modify-2-icon: {{ color_modify_2_icon }};
{% endif %}">
<header class="header-mobile{% if show_header_transparent_mobile %} header-transparent{% endif %} header-mobile-style-{{ header_search_style }} element-spacing" style="--spacing-top-mobile: {{ section.settings.padding_top | times: 0.5 | round: 0 | append: 'px' }};--spacing-bottom-mobile: {{ section.settings.padding_bottom | times: 0.5 | round: 0 | append: 'px' }};">
<div class="container">
<div class="header-mobile--wrapper">
{%- for block in section.blocks -%}
<div class="header-mobile__item--{{ block.type }}">
{%- case block.type -%}
{%- when 'menu' -%}
<div class="header-mobile--icon item__mobile--hamburger" style="--icon-color: {{ block.settings.icon_color }};">
<a class="mobileMenu-toggle" href="/" data-mobile-menu aria-label="menu">
<span class="mobileMenu-toggle__Icon"></span>
</a>
</div>
{%- when 'search' -%}
{%- if header_search_style != 'full' -%}
<side-drawer-opener class="header-mobile--icon" data-side-drawer="#Drawer-Search" style="--icon-color: {{ block.settings.icon_color }};">
<button class="header__iconItem header__search t-button link focus-inset" type="button" aria-haspopup="dialog">
<details>
<summary class="header__icon header__icon--search header__icon--summary link focus-inset modal__toggle" aria-haspopup="dialog" aria-label="{{ 'general.search.search' | t }}" data-search-mobile role="button" tabindex="0">
<span>
{% render 'icon-search',
icon_search: icon_search,
class: 'modal__toggle-open icon icon-search'
%}
{% render 'icon-close',
icon_search: icon_search,
class: 'modal__toggle-close icon icon-close'
%}
</span>
</summary>
</details>
</button>
</side-drawer-opener>
{%- endif -%}
{%- when 'logo' -%}
<div class="header-mobile--icon">
{%- if menu_tab.size > 0 -%}
<{% if request.page_type == 'index' %}h1{% else %}div{% endif %} class="header__heading header__heading--item item-{{ count }}" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
{%- for block in menu_tab -%}
{%- liquid
assign multi_page_handle = pages[block.settings.link].handle
assign multi_page_url = pages[block.settings.link].url
assign class = 'header__heading-link focus-inset'
if request.page_type == 'page' and page_handle == multi_page_handle
assign class = 'header__heading-link focus-inset is-active'
else
if request.page_type == 'index'
if forloop.first
assign class = 'header__heading-link focus-inset is-active'
endif
endif
endif
if multi_page_url != blank
assign url = multi_page_url
else
assign url = routes.root_url
endif
-%}
<a href="{{ url }}" class="{{ class }}{% if forloop.first %} first{% endif %}" data-load-logo-page="{{ multi_page_handle }}">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo test" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
{%- endfor -%}
</{% if request.page_type == 'index' %}h1{% else %}div{% endif %}>
{%- else -%}
<div class="header__heading" style="--logo-color: {{ block.settings.logo_color }};--logo-font-size: {{ block.settings.logo_font_size | append: 'px' }};--logo-font-weight: {{ block.settings.logo_font_weight }};{% if block.settings.logo_type == 'icon' %}--logo-icon-width-mobile: {{ block.settings.logo_icon_width_mobile | append: 'px' }};--logo-icon-height-mobile: {{ block.settings.logo_icon_height_mobile | append: 'px' }};{% endif %}">
<a href="{{ routes.root_url }}" class="header__heading-link focus-inset">
{%- if block.settings.logo_type == 'image' -%}
{%- if block.settings.logo_mobile != blank -%}
{%- liquid
assign image = block.settings.logo_mobile
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- elsif block.settings.logo != blank -%}
{%- liquid
assign image = block.settings.logo
assign image_size = block.settings.logo_width_mobile | append: 'x'
-%}
<img srcset="{{ image | img_url: image_size }} 1x, {{ image | img_url: image_size, scale: 2 }} 2x" src="{{ image | img_url: image_size }}" loading="lazy" class="header__heading-logo" alt="{{ image.alt | default: shop.name | escape }}" width="{{ image.width | replace: 'px', '' }}" height="{{ image.height | replace: 'px', '' }}">
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- elsif block.settings.logo_type == 'text' -%}
<span class="h2 {{ block.settings.logo_text_transform }}">
{% if block.settings.logo_text != blank %}{{ block.settings.logo_text }}{% else %}{{ shop.name }}{% endif %}
</span>
{%- elsif block.settings.logo_type == 'icon' -%}
{%- if block.settings.logo_icon != blank -%}
{{ block.settings.logo_icon }}
{%- else -%}
<span class="h2 {{ block.settings.logo_text_transform }}">{{ shop.name }}</span>
{%- endif -%}
{%- endif -%}
</a>
</div>
{%- endif -%}
</div>
{%- when 'customer' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};">
<a href="{%- if customer -%}{{ routes.account_url }}{%- else -%}{{ routes.account_login_url }}{%- endif -%}" class="header__icon header__icon--account link focus-inset" {% if routes.account_login_url == '/account/login' %}{% if settings.customer_login_type=='popup' %} data-open-auth-popup{% else %} data-open-auth-sidebar{% endif %}{% endif %} role="button">
{% render 'icon-account',
icon_account: icon_account
%}
<span class="visually-hidden">
{%- liquid
if customer
echo 'customer.account_fallback' | t
else
echo 'customer.log_in' | t
endif
-%}
</span>
</a>
</div>
{%- when 'cart' -%}
<div class="header-mobile--icon" style="--icon-color: {{ block.settings.icon_color }};--cart-count-background: {{ block.settings.cart_count_background }};--cart-count-color: {{ block.settings.cart_count_color }};">
<a {% if settings.show_quick_cart %}{% if settings.quick_cart_type == 'popup' %} data-open-cart-popup href="javascript:void(0)"{% else %}data-cart-sidebar href="javascript:void(0)"{% endif %}{% else %}href="{{ routes.cart_url }}"{% endif %} class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble-mobile" role="button">
{%- if style_function_group == '2' -%}
{% render 'icon-cart-special' %}
{%- else -%}
{% render 'icon-cart',
icon_cart: icon_cart
%}
{%- endif -%}
<span class="visually-hidden">{{ 'templates.cart.cart' | t }}</span>
<div class="cart-count-bubble">
{%- if cart.item_count < 100 -%}
<span class="text" aria-hidden="true" data-cart-count>{{ cart.item_count }}</span>
{%- endif -%}
<span class="visually-hidden">{{ 'sections.header.cart_count' | t: count: cart.item_count }}</span>
</div>
</a>
</div>
{%- endcase -%}
</div>
{%- endfor -%}
</div>
</div>
{%- if header_search_style == 'full' -%}
<div class="header-mobile-search">
<div class="header__search--mobile">
<a href="#" class="halo-sidebar-close" data-search-close>
{% render 'icon-close' %}
</a>
</div>
</div>
{%- endif -%}
</header>
</{% if section.settings.sticky_header_type != 'none' %}sticky-header-mobile{% else %}div{% endif %}>
{% javascript %}
class StickyHeaderMobile extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.header = document.querySelector('.shopify-section__header-mobile');
this.header_2 = document.querySelector('.shopify-section__header-mobile .header-mobile');
this.headerBounds = {};
this.currentScrollTop = 0;
this.preventReveal = false;
this.stickyHeaderType = this.getAttribute('data-sticky-type');
this.onScrollHandler = this.onScroll.bind(this);
this.hideHeaderOnScrollUp = () => this.preventReveal = true;
this.addEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.addEventListener('scroll', this.onScrollHandler, false);
this.createObserver();
this.setHeaderHeight();
window.matchMedia('(max-width: 1024px)').addEventListener('change', this.setHeaderHeight.bind(this));
this.backgroundTransparent();
}
disconnectedCallback() {
this.removeEventListener('preventHeaderReveal', this.hideHeaderOnScrollUp);
window.removeEventListener('scroll', this.onScrollHandler);
}
createObserver() {
let observer = new IntersectionObserver((entries, observer) => {
this.headerBounds = entries[0].intersectionRect;
observer.disconnect();
});
observer.observe(this.header);
}
setHeaderHeight() {
if(document.querySelector('.section-header-single-line')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
if(document.querySelector('.header-mobile-style-full')) {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `calc(${this.header_2.offsetHeight}px + 40px)`);
} else {
this.header.style.setProperty('--header-height', `calc(${this.header.offsetHeight}px + 40px)`);
}
} else {
if(document.querySelector('.header-mobile.header-transparent')) {
this.header.style.setProperty('--header-height', `${this.header_2.offsetHeight}px`);
} else {
this.header.style.setProperty('--header-height', `${this.header.offsetHeight}px`);
}
}
}
}
backgroundTransparent() {
if (document.querySelector('.header-mobile.header-transparent')) {
this.header.classList.add('enable-bg-transparent');
}
}
onScroll() {
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if (scrollTop > this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if(!document.body.classList.contains('open-search')){
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop < this.currentScrollTop && scrollTop > this.headerBounds.bottom) {
if (!this.preventReveal) {
requestAnimationFrame(this.reveal.bind(this));
} else {
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(() => {
this.preventReveal = false;
}, 66);
requestAnimationFrame(this.hide.bind(this));
}
} else if (scrollTop <= this.headerBounds.top) {
requestAnimationFrame(this.reset.bind(this));
}
this.currentScrollTop = scrollTop;
}
hide() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-hidden', 'shopify-section-header-sticky');
document.body.classList.add('scroll-down');
document.body.classList.remove('scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky');
document.body.classList.add('scroll-up');
return
}
}
this.closeMenuDisclosure();
this.closeDropdownPopup();
}
reveal() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.add('shopify-section-header-sticky', 'animate');
this.header.classList.remove('shopify-section-header-hidden');
document.body.classList.add('scroll-up');
document.body.classList.remove('scroll-down');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.add('scroll-up');
return
}
}
}
reset() {
if(this.stickyHeaderType != null) {
if(this.stickyHeaderType === 'up') {
this.header.classList.remove('shopify-section-header-hidden', 'shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-down', 'scroll-up');
} else {
this.header.classList.add('shopify-section-header-sticky', 'animate');
document.body.classList.remove('scroll-up');
return
}
}
}
closeMenuDisclosure() {
this.disclosures = this.disclosures || this.header.querySelectorAll('details-disclosure');
this.disclosures.forEach(disclosure => disclosure.close());
}
closeDropdownPopup() {
if(this.querySelector('.dropdown-language-currency')){
this.querySelector('.dropdown-language-currency').classList.remove('show');
}
}
}
customElements.define('sticky-header-mobile', StickyHeaderMobile);
{% endjavascript %}
{% schema %}
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"limit": 1,
"class": "shopify-section__header-mobile",
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.header__1.content"
},
{
"type": "color",
"id": "background",
"label": "t:sections.general.settings.color.label__1",
"default": "#ffffff"
},
{
"type": "color_background",
"id": "gradient",
"label": "t:sections.general.settings.color.label__20"
},
{
"type": "select",
"id": "style_function_group",
"label": "t:sections.header.settings.header-2.label__1",
"default": "1",
"options": [
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
},
{
"value": "6",
"label": "6"
},
{
"value": "7",
"label": "7"
},
{
"value": "8",
"label": "8"
},
{
"value": "9",
"label": "9"
},
{
"value": "10",
"label": "10"
},
{
"value": "11",
"label": "11"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__23.content"
},
{
"type": "select",
"id": "sticky_header_type",
"label": "t:sections.header.settings.general.label__6",
"default": "up",
"options": [
{
"value": "none",
"label": "t:sections.header.settings.general.options__3"
},
{
"value": "up",
"label": "t:sections.header.settings.general.options__1"
},
{
"value": "down",
"label": "t:sections.header.settings.general.options__2"
}]
},
{
"type": "header",
"content": "t:sections.header.settings.header__21.content"
},
{
"type": "checkbox",
"id": "show_header_transparent_mobile",
"label": "t:sections.header.settings.transparent-header.label__2",
"info":"t:sections.header.settings.transparent-header.info__1",
"default": false
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__1.content"
},
{
"type": "range",
"id": "color_modify",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 20
},
{
"type": "color",
"id": "color_modify_1_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_1_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "paragraph",
"content": "t:sections.header.settings.transparent-header.paragraph__2.content"
},
{
"type": "range",
"id": "color_modify_2",
"min": 0,
"max": 100,
"step": 10,
"unit": "t:sections.header.settings.transparent-header.unit",
"label": "t:sections.header.settings.transparent-header.label__3",
"default": 100
},
{
"type": "color",
"id": "color_modify_2_text",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "color_modify_2_icon",
"label": "t:sections.general.settings.color.label__4",
"default": "#FFFFFF"
},
{
"type": "header",
"content": "t:sections.general.settings.padding.name"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__1",
"default": 0
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 30,
"step": 1,
"unit": "px",
"label": "t:sections.general.settings.padding.label__2",
"default": 0
}
],
"blocks": [
{
"type": "menu",
"name": "Menu",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "search",
"name": "t:sections.header.settings.header_search.name",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
},
{
"type": "select",
"id": "header_search_style",
"label": "t:sections.header.settings.header_search.label__2",
"default": "icon",
"options": [
{
"value": "icon",
"label": "t:sections.header.settings.header_search.options__1"
},
{
"value": "icon-2",
"label": "t:sections.header.settings.header_search.options__9"
},
{
"value": "full",
"label": "t:sections.header.settings.header_search.options__2"
}]
}
]
},
{
"type": "logo",
"name": "t:sections.header.settings.header__6.content",
"limit": 1,
"settings": [
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__1"
},
{
"type": "select",
"id": "logo_type",
"label": "t:sections.header.settings.logo.label__1",
"default": "image",
"options": [
{
"value": "image",
"label": "t:sections.header.settings.logo.options__1"
},
{
"value": "text",
"label": "t:sections.header.settings.logo.options__2"
},
{
"value": "icon",
"label": "t:sections.header.settings.logo.options__3"
}]
},
{
"type": "image_picker",
"id": "logo_mobile",
"label": "t:sections.header.settings.logo.label__3"
},
{
"type": "range",
"id": "logo_width_mobile",
"min": 50,
"max": 150,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__5",
"default": 65
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__2"
},
{
"type": "textarea",
"id": "logo_text",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "header",
"content": "t:sections.header.settings.logo.paragraph__3"
},
{
"type": "textarea",
"id": "logo_icon",
"label": "t:sections.general.settings.content.label__2"
},
{
"type": "range",
"id": "logo_icon_width_mobile",
"min": 5,
"max": 250,
"step": 5,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__11",
"default": 100
},
{
"type": "range",
"id": "logo_icon_height_mobile",
"min": 1,
"max": 50,
"step": 1,
"unit": "t:sections.header.settings.logo.unit",
"label": "t:sections.header.settings.logo.label__12",
"default": 50
},
{
"type": "header",
"content": "t:sections.general.settings.style.name"
},
{
"type": "range",
"id": "logo_font_size",
"label": "t:settings_schema.typography.settings.font_size.label",
"min": 15,
"max": 30,
"step": 1,
"unit": "t:settings_schema.typography.settings.font_size.unit",
"default": 15
},
{
"type": "select",
"id": "logo_font_weight",
"label": "t:settings_schema.typography.settings.font_weight.label",
"default": "900",
"options": [
{
"value": "400",
"label": "t:settings_schema.typography.settings.font_weight.options__1"
},
{
"value": "500",
"label": "t:settings_schema.typography.settings.font_weight.options__2"
},
{
"value": "600",
"label": "t:settings_schema.typography.settings.font_weight.options__3"
},
{
"value": "700",
"label": "t:settings_schema.typography.settings.font_weight.options__4"
},
{
"value": "800",
"label": "t:settings_schema.typography.settings.font_weight.options__5"
},
{
"value": "900",
"label": "t:settings_schema.typography.settings.font_weight.options__6"
}]
},
{
"type": "select",
"id": "logo_text_transform",
"label": "t:settings_schema.typography.settings.text_transform.label",
"default": "uppercase",
"options": [
{
"value": "normal",
"label": "t:settings_schema.typography.settings.text_transform.options__1"
},
{
"value": "capitalize",
"label": "t:settings_schema.typography.settings.text_transform.options__2"
},
{
"value": "uppercase",
"label": "t:settings_schema.typography.settings.text_transform.options__3"
},
{
"value": "lowercase",
"label": "t:settings_schema.typography.settings.text_transform.options__4"
}]
},
{
"type": "color",
"id": "logo_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
}
]
},
{
"type": "customer",
"name": "Customer",
"limit": 1,
"settings": [
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
},
{
"type": "cart",
"name": "Cart",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "t:sections.header.settings.header__16.content"
},
{
"type": "color",
"id": "cart_count_background",
"label": "t:sections.general.settings.color.label__1",
"default": "#BC1B3B"
},
{
"type": "color",
"id": "cart_count_color",
"label": "t:sections.general.settings.color.label__2",
"default": "#FFFFFF"
},
{
"type": "color",
"id": "icon_color",
"label": "t:sections.general.settings.color.label__3",
"default": "#232323"
}
]
}
],
"presets": [
{
"name": "t:settings_schema.layouts.settings.header__4.content",
"settings": {
"background": "#ffffff",
"gradient": "",
"style_function_group": "1",
"sticky_header_type": "up",
"show_header_transparent_mobile": false,
"color_modify": 20,
"color_modify_1_text": "#ffffff",
"color_modify_1_icon": "#ffffff",
"color_modify_2": 100,
"color_modify_2_text": "#ffffff",
"color_modify_2_icon": "#ffffff",
"padding_top": 0,
"padding_bottom": 0
},
"blocks": [
{
"type": "menu",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "search",
"settings": {
"icon_color": "#232323",
"header_search_style": "icon"
}
},
{
"type": "logo",
"settings": {
"logo_type": "image",
"logo_mobile": "shopify:\/\/shop_images\/Halo-logo.png",
"logo_width_mobile": 100,
"logo_text": "",
"logo_icon": "",
"logo_icon_width_mobile": 100,
"logo_icon_height_mobile": 50,
"logo_font_size": 15,
"logo_font_weight": "900",
"logo_text_transform": "uppercase",
"logo_color": "#232323"
}
},
{
"type": "customer",
"settings": {
"icon_color": "#232323"
}
},
{
"type": "cart",
"settings": {
"cart_count_background": "#bc1b3b",
"cart_count_color": "#ffffff",
"icon_color": "#232323"
}
}
]
}
],
"enabled_on": {
"groups": ["header" ]
}
}
{% endschema %}
☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
11:13 AM
This worked! Thank you SO much!
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-27-2024
11:17 AM
Hi @BlackenWillow,
You're welcome and happy to help you 😊
☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com
Community Blog Articles
Holiday Cheers to Our Community | November '24
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024
Dropshipping Viral Products to Sell in 2025
Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024
Shining a spotlight on our top members of October 2024!
Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024