How to restore cart icon on Debut theme header?

Store Design
1

Hi there,

I’m currently using the Debut theme and removed my cart icon in the header a while ago and can’t remember how to make it appear again. Below is my code for header.liquid. If someone can provide me with a code to put the cart icon on the right side of my header that would be amazing!

Thanks so much xx

{% if section.settings.message %}

{% if section.settings.logo != blank %} .site-header__logo-image { max-width: {{ section.settings.logo_max_width | escape }}px; } {% endif %} {% if section.settings.align_logo == 'left' %} .site-header__logo-image { margin: 0; } {% endif %}

{% endif %}

{% if section.settings.message %} {% if section.settings.home_page_only == false or template.name == 'index' %} .announcement-bar { background-color: {{ section.settings.color_bg }}; }

.announcement-bar–link:hover {
{% assign brightness = section.settings.color_bg | color_brightness %}

{% if brightness <= 192 %}
{% assign lightenAmount = 255 | minus: brightness | divided_by: 255 | times: 16 %}
background-color: {{ section.settings.color_bg | color_lighten: lightenAmount }};
{% else %}
{% assign darkenAmount = 255 | divided_by: brightness | times: 8 %}
background-color: {{ section.settings.color_bg | color_darken: darkenAmount }};
{% endif %}
}

.announcement-bar__message {
color: {{ section.settings.color_text }};
}

{% if section.settings.message_link == blank %}

{% else %} {% endif %}

{% endif %}
{% endif %}

{% if section.settings.align_logo == 'center' %} {%- assign logo_classes = 'medium-up--one-third medium-up--push-one-third logo-align--center' -%} {% else %} {%- assign logo_classes = 'medium-up--one-quarter logo-align--left' -%} {% endif %}
{% comment %} Use the uploaded logo from theme settings if enabled. Site name gets precedence with H1 tag on homepage, div on other pages. {% endcomment %} {% if template.name == 'index' %}

{% else %}
{% endif %} {% if section.settings.logo %} {%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%} {% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %} {{ logo_alt | escape }} {% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %} {{ section.settings.logo.alt | default: shop.name }} {% else %} {{ shop.name }} {% endif %} {% if template.name == 'index' %}

{% else %}
{% endif %}

{% if section.settings.align_logo == ‘left’ %}

{% include 'site-nav' %} {% endif %}
{% include 'search-form' %}
{% include 'icon-search' %} {{ 'layout.navigation.search' | t }}

{% if shop.customer_accounts_enabled %}
{% if customer %}

{% include ‘icon-login’ %}
{{ ‘layout.customer.account’ | t }}

{% else %}

{% include ‘icon-login’ %}
{{ ‘layout.customer.log_in’ | t }}

{% endif %}
{% endif %}

{% if shop.enabled_currencies.size > 1 %}
{% form ‘currency’, class: “currency-selector small–hide” %}
{{ ‘general.currency.dropdown_label’ | t }}

{% include 'icon-chevron-down' %}
{% endform %} {% endif %}

{% unless linklists[section.settings.main_linklist] == blank %}

{% include ‘icon-hamburger’ %}
{% include ‘icon-close’ %}

{% endunless %}

    {% for link in linklists[section.settings.main_linklist].links %} {%- assign outerLoopIndex = forloop.index -%}
  • {% if link.links != blank %} {% capture child_list_handle %}{{ link.handle }}-{{ outerLoopIndex }}{% endcapture %} {{ link.title | escape }}
    {% include 'icon-chevron-right' %}
    • {{- link.title }} {{ 'layout.navigation.menu' | t -}}
    • {% include 'icon-chevron-left' %}
      {{ link.title | escape }}

      • {% for childlink in link.links %}

    • {% if childlink.links != blank %} {% capture grandchild_list_handle %}{{ childlink.handle }}-{{ outerLoopIndex }}-{{ forloop.index }}{% endcapture %} {{ childlink.title | escape }}
      {% include 'icon-chevron-right' %}
      {% else %} {{ childlink.title | escape }} {% endif %}
      • {% endfor %}
    {% else %} {{ link.title | escape }} {% endif %}
    • {% endfor %} {% if shop.enabled_currencies.size > 1 %}
  • {% form 'currency', class: "currency-selector" %} {{ 'general.currency.dropdown_label' | t }}
    {% include 'icon-chevron-down' %}
    {% endform %}
    • {% endif %}

{% if section.settings.align_logo == ‘center’ %}

{% include 'site-nav', nav_alignment: 'site-nav--centered' %} {% endif %}

{% if template.name == ‘index’ %}
{% assign potential_action_target = shop.url | append: “/search?q={search_term_string}” %}

{% endif %}

{% schema %}
{
“name”: {
“de”: “Titel”,
“en”: “Header”,
“es”: “Encabezado”,
“fr”: “En-tête”,
“it”: “Header”,
“ja”: “ヘッダー”,
“nl”: “Koptekst”,
“pt-BR”: “Cabeçalho”,
“zh-CN”: “标头”,
“zh-TW”: “標頭”
},
“settings”: [
{
“type”: “radio”,
“id”: “align_logo”,
“label”: {
“de”: “Logo-Ausrichtung”,
“en”: “Logo alignment”,
“es”: “Alineación de logotipo”,
“fr”: “Alignement du logo”,
“it”: “Allineamento logo”,
“ja”: “ロゴアラインメント”,
“nl”: “Logo-uitlijning”,
“pt-BR”: “Alinhamento do logotipo”,
“zh-CN”: “logo 对齐方式”,
“zh-TW”: “商標對齊”
},
“default”: “left”,
“options”: [
{
“value”: “left”,
“label”: {
“de”: “Links”,
“en”: “Left”,
“es”: “Izquierda”,
“fr”: “Gauche”,
“it”: “Sinistra”,
“ja”: “左”,
“nl”: “Links”,
“pt-BR”: “Esquerda”,
“zh-CN”: “左侧”,
“zh-TW”: “左方”
}
},
{
“value”: “center”,
“label”: {
“de”: “Mittig”,
“en”: “Centered”,
“es”: “Centrada”,
“fr”: “Centré”,
“it”: “Centrato”,
“ja”: “中央揃え”,
“nl”: “Gecentreerd”,
“pt-BR”: “Centralizado”,
“zh-CN”: “居中”,
“zh-TW”: “置中”
}
}
]
},
{
“type”: “image_picker”,
“id”: “logo”,
“label”: {
“de”: “Logo-Foto”,
“en”: “Logo image”,
“es”: “Logotipo”,
“fr”: “Image du logo”,
“it”: “Immagine del logo”,
“ja”: “ロゴ画像”,
“nl”: “Afbeelding van logo”,
“pt-BR”: “Imagem do logotipo”,
“zh-CN”: “logo 图片”,
“zh-TW”: “標誌圖片”
}
},
{
“type”: “range”,
“id”: “logo_max_width”,
“label”: {
“de”: “Logobreite”,
“en”: “Custom logo width”,
“es”: “Ancho del logotipo personalizado”,
“fr”: “Largeur personnalisée du logo”,
“it”: “Larghezza logo personalizzato”,
“ja”: “ロゴの幅をカスタムする”,
“nl”: “Aangepaste logo-breedte”,
“pt-BR”: “Largura do logotipo personalizado”,
“zh-CN”: “自定义 logo 宽度”,
“zh-TW”: “自訂商標寬度”
},
“min”: 50,
“max”: 250,
“step”: 5,
“unit”: {
“de”: “px”,
“en”: “px”,
“es”: “px”,
“fr”: “px”,
“it”: “px”,
“ja”: “px”,
“nl”: “px”,
“pt-BR”: “px”,
“zh-CN”: “px”,
“zh-TW”: “像素”
},
“default”: 100
},
{
“type”: “link_list”,
“id”: “main_linklist”,
“label”: {
“de”: “Menü”,
“en”: “Menu”,
“es”: “Menú”,
“fr”: “Menu”,
“it”: “Menu”,
“ja”: “メニュー”,
“nl”: “Menu”,
“pt-BR”: “Menu”,
“zh-CN”: “菜单”,
“zh-TW”: “選單”
},
“default”: “main-menu”
},
{
“type”: “header”,
“content”: {
“de”: “Ankündigungsbereich”,
“en”: “Announcement bar”,
“es”: “Barra de anuncios”,
“fr”: “Barre d’annonces”,
“it”: “Barra degli annunci”,
“ja”: “告知バー”,
“nl”: “Aankondigingsbalk”,
“pt-BR”: “Barra de anúncios”,
“zh-CN”: “公告栏”,
“zh-TW”: “公告列”
}
},
{
“type”: “checkbox”,
“id”: “message”,
“label”: {
“de”: “Ankündigung anzeigen”,
“en”: “Show announcement”,
“es”: “Mostrar anuncio”,
“fr”: “Afficher l’annonce”,
“it”: “Mostra annuncio”,
“ja”: “告知を表示する”,
“nl”: “Aankondiging weergeven”,
“pt-BR”: “Exibir anúncio”,
“zh-CN”: “显示公告”,
“zh-TW”: “顯示公告”
},
“default”: false
},
{
“type”: “checkbox”,
“id”: “home_page_only”,
“label”: {
“de”: “Nur Startseite”,
“en”: “Home page only”,
“es”: “Solo página de inicio”,
“fr”: “Page d’accueil uniquement”,
“it”: “Solo home page”,
“ja”: “ホームページのみ”,
“nl”: “Alleen startpagina”,
“pt-BR”: “Apenas página inicial”,
“zh-CN”: “仅主页”,
“zh-TW”: “僅限首頁”
},
“default”: true
},
{
“type”: “text”,
“id”: “message_text”,
“label”: {
“de”: “Text”,
“en”: “Text”,
“es”: “Texto”,
“fr”: “Texte”,
“it”: “Testo”,
“ja”: “テキスト”,
“nl”: “Tekst”,
“pt-BR”: “Texto”,
“zh-CN”: “文本”,
“zh-TW”: “文字”
},
“default”: {
“de”: “Hier etwas ankündigen”,
“en”: “Announce something here”,
“es”: “Anuncia algo aquí”,
“fr”: “Annoncez quelque chose ici”,
“it”: “Annuncia qualcosa qui”,
“ja”: “ここで告知してください”,
“nl”: “Kondig hier iets aan”,
“pt-BR”: “Anuncie algo aqui”,
“zh-CN”: “在此处进行公告”,
“zh-TW”: “在此公告資訊”
}
},
{
“type”: “url”,
“id”: “message_link”,
“label”: {
“de”: “Link”,
“en”: “Link”,
“es”: “Enlace”,
“fr”: “Lien”,
“it”: “Link”,
“ja”: “リンク”,
“nl”: “Link”,
“pt-BR”: “Link”,
“zh-CN”: “链接”,
“zh-TW”: “連結”
},
“info”: {
“de”: “Optional”,
“en”: “Optional”,
“es”: “Opcional”,
“fr”: “Facultatif”,
“it”: “Facoltativo”,
“ja”: “選択させる”,
“nl”: “Optioneel”,
“pt-BR”: “Opcional”,
“zh-CN”: “可选”,
“zh-TW”: “(選填)”
}
},
{
“type”: “color”,
“id”: “color_bg”,
“label”: {
“de”: “Zeile”,
“en”: “Bar”,
“es”: “Barra”,
“fr”: “Barre”,
“it”: “Barra”,
“ja”: “バー”,
“nl”: “Balk”,
“pt-BR”: “Barra”,
“zh-CN”: “栏”,
“zh-TW”: “橫條”
},
“default”: “#7796a8”
},
{
“type”: “color”,
“id”: “color_text”,
“label”: {
“de”: “Text”,
“en”: “Text”,
“es”: “Texto”,
“fr”: “Texte”,
“it”: “Testo”,
“ja”: “テキスト”,
“nl”: “Tekst”,
“pt-BR”: “Texto”,
“zh-CN”: “文本”,
“zh-TW”: “文字”
},
“default”: “#fff”
}
]
}
{% endschema %}

.icon-search{ display: none !important; }
2

Hello @gerlikask ,

You have to add the below code to the header section. Instead of removing just comment the code so you can again use it whenever it is required. I believe this could help you to resolve the issue.


            {% include 'icon-cart' %}
            {{ 'layout.cart.title' | t }}
            

              {{ cart.item_count }}
              {{ 'layout.cart.items_count' | t: count: cart.item_count }}

Please verify the attached screenshot:

2022_06_08_cart_icon.png
2022_06_08_cart_icon.png1617×774 195 KB

Happy Coding!!