Hi Community,
I would like to display the cart with the number of items instead of the cart menu link (winkelwagen) with the amount in it.
Can seem to find the solution to this problem.
My store: http://by-maem.be/
Hey @nicodemuynck
Can you share your header.liquid file code .
I will check and provide you solution here.
Thanks!
1 Like
{%- assign transparent_header = false -%}
{%- if template contains 'collection' and collection.image and section.settings.transparent_collection -%}
{%- assign transparent_header = true -%}
{%- elsif template contains 'article' and article.image and section.settings.transparent_article -%}
{%- assign transparent_header = true -%}
{%- elsif template contains 'blog' and section.settings.transparent_blog -%}
{%- assign transparent_header = true -%}
{%- elsif template contains 'page' and section.settings.transparent_page -%}
{%- assign transparent_header = true -%}
{%- elsif template == 'index' and section.settings.transparent_home -%}
{%- assign transparent_header = true -%}
{%- endif -%}
{% if section.settings.header_enable_account or section.settings.header_enable_search or section.settings.header_message != '' %}
{% if shop.customer_accounts_enabled and section.settings.header_enable_account %}
{% endif %}
{% if section.settings.header_message != '' %}
{% if section.settings.header_message_url != blank %}
{{ section.settings.header_message | escape }}
{% else %}
{{ section.settings.header_message | escape }}
{% endif %}
{% endif %}
{% if section.settings.header_enable_search %}
{% endif %}
{% endif %}
{% if template.name == 'index' %}
{% assign potential_action_target = shop.url | append: "/search?q={search_term_string}" %}
{% endif %}
{% schema %}
{
"name": "Header",
"settings": [
{
"type": "image_picker",
"id": "logo",
"label": "Logo image"
},
{
"type": "range",
"id": "logo_max_limit",
"min": 5,
"max": 495,
"step": 5,
"unit": "px",
"label": "logo width",
"default": 120
},
{
"type": "link_list",
"label": "Menu",
"id": "main_menu_linklist"
},
{
"type": "header",
"content": "Meganav image"
},
{
"type": "image_picker",
"id": "meganav_image",
"label": "Meganav image",
"info": "500 x 800px .jpg max"
},
{
"type": "url",
"id": "meganav_link",
"label": "Meganav Image Link"
},
{
"type": "header",
"content": "Sticky header"
},
{
"type": "select",
"id": "header_sticky",
"options": [
{ "value": "static", "label": "Default header"},
{ "value": "sticky", "label": "Sticky header"},
{ "value": "scroll", "label": "Sticky header only when scrolling up"}
],
"label": "Header behavior",
"default": "static"
},
{
"type": "header",
"content": "Transparent header"
},
{
"type": "checkbox",
"id": "transparent_home",
"label": "Enable on the home page",
"default": false
},
{
"type": "checkbox",
"id": "transparent_collection",
"label": "Enable on collections",
"default": false
},
{
"type": "checkbox",
"id": "transparent_blog",
"label": "Enable on the blog",
"default": false
},
{
"type": "checkbox",
"id": "transparent_article",
"label": "Enable on articles",
"default": false
},
{
"type": "checkbox",
"id": "transparent_page",
"label": "Enable on pages",
"default": false
},
{
"type": "color",
"id": "transparent_text_color",
"label": "Text and icons color",
"default": "#ffffff"
},
{
"type": "image_picker",
"id": "transparent_logo",
"label": "Alternate logo"
},
{
"type": "header",
"content": "Top Bar"
},
{
"type": "text",
"id": "header_message",
"label": "Announcement text",
"info": "45 characters or less recommended"
},
{
"type": "url",
"id": "header_message_url",
"label": "Announcement link"
},
{
"type": "checkbox",
"id": "header_enable_account",
"default": true,
"label": "Show account link in header"
},
{
"type": "checkbox",
"id": "header_enable_search",
"default": true,
"label": "Show search in header"
},
{
"type": "checkbox",
"id": "search_only_products",
"label": "Only search products"
}
]
}
{% endschema %}
Hey @nicodemuynck
I have checked your file code. again one file required for your task please share Snippets/ nav-contents. liquid file code.
Thanks!
1 Like
{% include 'icon-cart' %}
{{ 'layout.cart.title' | t }}
{% if template.name == 'index' %}
#
{% else %}
{% endif %}
{% if section.settings.logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% else %}
{{ shop.name }}
{% endif %}
{% if transparent_header and section.settings.transparent_logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% endif %}
{% if template.name == 'index' %}
{% else %}
{% endif %}
{% include 'icon-nav' %}
Hey @nicodemuynck
please add code Snippets/ nav-contents. liquid before backup the file.
{% include 'icon-cart' %}
{{ 'layout.cart.title' | t }}
{% if template.name == 'index' %}
#
{% else %}
{% endif %}
{% if section.settings.logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% else %}
{{ shop.name }}
{% endif %}
{% if transparent_header and section.settings.transparent_logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% endif %}
{% if template.name == 'index' %}
{% else %}
{% endif %}
{% include 'icon-nav' %}
Hope this will work for you.
Thanks!
Hey @nicodemuynck ,
Is it possible for you to give theme zip or staff access? I will check and provide a solution here so others can also take benefits.
Thanks!
Yes.
Which mailaccount do I send the staff access to?
Hey @nicodemuynck
please add code Snippets/ nav-contents. liquid before backup the file.
{% include 'icon-cart' %}
{{ 'layout.cart.title' | t }}
{{ cart.item_count}}
{% if template.name == 'index' %}
#
{% else %}
{% endif %}
{% if section.settings.logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% else %}
{{ shop.name }}
{% endif %}
{% if transparent_header and section.settings.transparent_logo != blank %}
{% capture image_size %}{{ section.settings.logo_max_limit }}x{% endcapture %}
{% endif %}
{% if template.name == 'index' %}
{% else %}
{% endif %}
{% include 'icon-nav' %}
Add code assets/theme.scss.liquid bottom of the file.
@media only screen and (max-width:768px) {
.nav--mobile .header-cart__bubble {
position: absolute;
top: 6%;
margin-top: -14px;
left: 17px;
width: 17px;
height: 17px;
border-radius: 15px;
background-color: #656565;
color: #fff;
text-align: center;
font-size: 10px;
}
}
@media only screen and (min-width:769px) {
.cartCount {
position: relative;
width: 17px;
height: 17px;
border-radius: 15px;
background-color: #656565;
color: #fff;
text-align: center;
font-size: 10px;
display: block !important;
bottom: 40px;
left: 19px;
}
.nav--desktop .header-cart__wrapper {
position: relative;
top: 55%;
z-index: 1000;
margin-top: 17px;
width: 25px;
height: 25px;
float: right;
left: 20px;
}
}
Hope this will work for you.
Thanks!
Amazing! It works perfectly!
Thanks a million!
