Minimal theme: slideshow autoplay & logo sharpness

Solved
Highlighted
Excursionist
18 0 7

Hello!

I'm new to shopify so please forgive my noob-iness.

1. I'm trying to have my logo show up on the password page; I've had success with this but it appears blurry, even though it is the same file as the non-blurry logo that appears on my homepage.

2. I'm having trouble with getting my slideshow to autoplay (I fiddled with the code to get it to a portrait size, which I want, but maybe I've broken the autoplay somehow?)

My website: nadias-drawer.myshopify.com

Would be very grateful for any help!

Thank you so much.

1 Like
Highlighted
Shopify Partner
9227 1179 3246

Hello, @sourcer 

Welcome to the Shopify community!
and Thanks for your Good question.

Thanks for url but your store is password protect
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
18 0 7

So sorry @KetanKumar ! The password is trildu

1 Like
Highlighted
Shopify Partner
9227 1179 3246

@sourcer 

No, worries 

Thanks for detail i have check this but i can't see any issue can you please provide furhter issue screenshot so i will guide you.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
18 0 7

@KetanKumar Here's a screenshot comparison for the logo blurring issue.

Top is the blurred logo on the password page and below is the accurately sharp logo on the homepage. Both are from the same image asset uploaded on shopify. 

 

blurred appearance on password pageblurred appearance on password pagesharp appearance on homepagesharp appearance on homepage

1 Like
Highlighted
Shopify Partner
9227 1179 3246

@sourcer 

Yes, please your header and password header code so i will update

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
18 0 7

 

@KetanKumar 

Header

<style>
  {%- assign logo_width = 695 -%}
  {%- assign logo_max_width = section.settings.logo_max_width | times: 1 -%}
  {% if logo_max_width < logo_width %}
    {%- assign logo_width = logo_max_width -%}
  {% endif %}
  .logo__image-wrapper {
    max-width: {{ logo_width }}px;
  }
  /*================= If logo is above navigation ================== */
  {% if section.settings.nav_below_logo %}
    .site-nav {
      {% if section.settings.show_header_lines %}
        border-top: 1px solid {{ settings.color_borders }};
        border-bottom: 1px solid {{ settings.color_borders }};
      {% endif %}
      margin-top: 30px;
    }

    {% unless section.settings.left_aligned_logo %}
      .logo__image-wrapper {
        margin: 0 auto;
      }
    {% endunless %}
  {% endif %}

  /*============ If logo is on the same line as navigation ============ */
  {% unless section.settings.nav_below_logo or section.settings.show_header_lines == false %}
    .site-header .grid--full {
      border-bottom: 1px solid {{ settings.color_borders }};
      padding-bottom: 30px;
    }
  {% endunless %}


  {% unless section.settings.nav_below_logo %}
    @media screen and (min-width: 769px) {
      .site-nav {
        text-align: right!important;
      }
    }
  {% endunless %}
</style>

<div data-section-id="{{ section.id }}" data-section-type="header-section">
  <div class="header-bar">
    <div class="wrapper medium-down--hide">
      <div class="post-large--display-table">

        {% if section.settings.show_announcement or section.settings.header_search_enable %}
          <div class="header-bar__left post-large--display-table-cell">

            {% comment %}
              Add social links to header
            {% endcomment %}

            {% comment %}
            <div class="header-bar__module header-bar__module--list">
              {% include 'social-links' %}
            </div>
            {% endcomment %}

            {% if section.settings.show_announcement %}
              <div class="header-bar__module header-bar__message">
                {% if section.settings.announcement_link != blank %}
                  <a href="{{ section.settings.announcement_link }}">
                {% endif %}
                  {{ section.settings.header_text | escape }}
                {% if section.settings.announcement_link != blank %}
                  </a>
                {% endif %}
              </div>
            {% elsif section.settings.header_search_enable %}
              <div class="header-bar__module header-bar__search">
                {% include 'search-bar' with 'header' %}
              </div>
            {% endif %}

          </div>
        {% endif %}

        <div class="header-bar__right post-large--display-table-cell">

          {% if shop.customer_accounts_enabled %}
            <ul class="header-bar__module header-bar__module--list">
              {% if customer %}
                <li>
                  <a href="{{ routes.account_url }}">{{ 'layout.customer.account' | t }}</a>
                </li>
                <li>
                  {{ 'layout.customer.log_out' | t | customer_logout_link }}
                </li>
              {% else %}
                <li>
                  {{ 'layout.customer.log_in' | t | customer_login_link }}
                </li>
                <li>{{ 'layout.customer.or' | t }}</li>
                <li>
                  {{ 'layout.customer.create_account' | t | customer_register_link }}
                </li>
              {% endif %}
            </ul>
          {% endif %}

          <div class="header-bar__module">
            <span class="header-bar__sep" aria-hidden="true"></span>
            <a href="{{ routes.cart_url }}" class="cart-page-link">
              <span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
            </a>
          </div>

          <div class="header-bar__module">
            <a href="{{ routes.cart_url }}" class="cart-page-link">
              {{ 'layout.cart.title' | t }}{% unless cart.item_count == 0 %}:{% endunless %}
              <span class="cart-count header-bar__cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
            </a>
          </div>

          {% if section.settings.header_search_enable %}
            {% if section.settings.show_announcement %}
              <div class="header-bar__module header-bar__search">
                {% include 'search-bar' with 'header' %}
              </div>
            {% endif %}
          {% endif %}

        </div>
      </div>
    </div>

    <div class="wrapper post-large--hide announcement-bar--mobile">
      {% if section.settings.show_announcement %}
        {% if section.settings.announcement_link != blank %}
          <a href="{{ section.settings.announcement_link }}">
        {% endif %}
          <span>{{ section.settings.header_text | escape }}</span>
        {% if section.settings.announcement_link != blank %}
          </a>
        {% endif %}
      {% endif %}
    </div>

    <div class="wrapper post-large--hide">
      {% unless section.settings.nav_menu == blank and section.settings.header_search_enable == false and shop.customer_accounts_enabled == false %}
        <button type="button" class="mobile-nav-trigger" id="MobileNavTrigger" aria-controls="MobileNav" aria-expanded="false">
          <span class="icon icon-hamburger" aria-hidden="true"></span>
          {{ 'layout.navigation.menu' | t }}
        </button>
      {% endunless %}
      <a href="{{ routes.cart_url }}" class="cart-page-link mobile-cart-page-link">
        <span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
        {{ 'layout.cart.title' | t }} <span class="cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
      </a>
    </div>
    {% include 'mobile-nav' with linklists[section.settings.nav_menu] %}
  </div>

  <header class="site-header" role="banner">
    <div class="wrapper">

      {% if section.settings.nav_below_logo %}
        <div class="grid--full">
          <div class="grid__item">
            {% if request.page_type == 'index' %}
              <h1 class="site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% else %}
              <div class="h1 site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% endif %}
              {% if section.settings.logo != blank %}
                <noscript>
                  {% capture image_size %}{{ logo_width | escape }}x{% endcapture %}
                  <div class="logo__image-wrapper">
                    {{ section.settings.logo | img_url: image_size | img_tag: shop.name }}
                  </div>
                </noscript>
                <div class="logo__image-wrapper supports-js">
                  <a href="{{ routes.root_url }}" itemprop="url" style="padding-top:{{ 1 | divided_by: section.settings.logo.aspect_ratio | times: 100}}%;">
                    {% assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="logo__image lazyload"
                         src="{{ section.settings.logo | img_url: '300x300' }}"
                         data-src="{{ img_url }}"
                         data-widths="[120, 180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048]"
                         data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ shop.name | escape }}"
                         itemprop="logo">
                  </a>
                </div>
              {% else %}
                <a href="{{ routes.root_url }}" itemprop="url">{{ shop.name }}</a>
              {% endif %}
            {% if request.page_type == 'index' %}
              </h1>
            {% else %}
              </div>
            {% endif %}
          </div>
        </div>
        <div class="grid--full medium-down--hide">
          <div class="grid__item">
            {% include 'site-nav' with linklists[section.settings.nav_menu] %}
          </div>
        </div>
      {% else %}
        <div class="grid--full post-large--display-table">
          <div class="grid__item post-large--one-third post-large--display-table-cell">
            {% if request.page_type == 'index' %}
              <h1 class="site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% else %}
              <div class="h1 site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% endif %}
              {% if section.settings.logo != blank %}
                <noscript>
                  {% capture image_size %}{{ logo_width | escape }}x{% endcapture %}
                  <div class="logo__image-wrapper">
                    {{ section.settings.logo | img_url: image_size | img_tag: shop.name }}
                  </div>
                </noscript>
                <div class="logo__image-wrapper supports-js">
                  <a href="{{ routes.root_url }}" itemprop="url" style="padding-top:{{ 1 | divided_by: section.settings.logo.aspect_ratio | times: 100}}%;">
                    {% assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="logo__image lazyload"
                         src="{{ section.settings.logo | img_url: '300x300' }}"
                         data-src="{{ img_url }}"
                         data-widths="[120, 180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048]"
                         data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ shop.name | escape }}"
                         itemprop="logo">
                  </a>
                </div>
              {% else %}
                <a href="{{ routes.root_url }}" itemprop="url">{{ shop.name }}</a>
              {% endif %}
            {% if request.page_type == 'index' %}
              </h1>
            {% else %}
              </div>
            {% endif %}
          </div>
          <div class="grid__item post-large--two-thirds post-large--display-table-cell medium-down--hide">
            {% include 'site-nav' with linklists[section.settings.nav_menu] %}
          </div>
        </div>
      {% endif %}

    </div>
  </header>
</div>


{% schema %}
{
  "name": {
    "da": "Overskrift",
    "de": "Titel",
    "en": "Header",
    "es": "Encabezado",
    "fi": "Ylätunniste",
    "fr": "En-tête",
    "hi": "हैडर",
    "it": "Header",
    "ja": "ヘッダー",
    "ko": "머리글",
    "nb": "Header",
    "nl": "Koptekst",
    "pt-BR": "Cabeçalho",
    "pt-PT": "Cabeçalho",
    "sv": "Rubrik",
    "th": "ส่วนหัว",
    "zh-CN": "标头",
    "zh-TW": "標頭"
  },
  "settings": [
    {
      "type": "checkbox",
      "id": "header_search_enable",
      "label": {
        "da": "Vis søgelinje",
        "de": "Suchleiste anzeigen",
        "en": "Show search bar",
        "es": "Mostrar barra de búsqueda",
        "fi": "Näytä hakupalkki",
        "fr": "Afficher la barre de recherche",
        "hi": "सर्च बार दिखाएं",
        "it": "Mostra barra di ricerca",
        "ja": "検索バーを表示する",
        "ko": "검색 바 표시",
        "nb": "Vis søkefelt",
        "nl": "Zoekbalk weergeven",
        "pt-BR": "Exibir barra de pesquisa",
        "pt-PT": "Mostrar barra de pesquisa",
        "sv": "Visa sökfältet",
        "th": "แสดงแถบการค้นหา",
        "zh-CN": "显示搜索栏",
        "zh-TW": "顯示搜尋列"
      }
    },
    {
      "type": "image_picker",
      "id": "logo",
      "label": {
        "da": "Logo",
        "de": "Logo",
        "en": "Logo",
        "es": "Logotipo",
        "fi": "Logo",
        "fr": "Logo",
        "hi": "लोगो",
        "it": "Logo",
        "ja": "ロゴ",
        "ko": "로고",
        "nb": "Logo",
        "nl": "Logo",
        "pt-BR": "Logotipo",
        "pt-PT": "Logótipo",
        "sv": "Logotyp",
        "th": "โลโก้",
        "zh-CN": "logo",
        "zh-TW": "商標"
      },
      "info": {
        "da": "450 x 200 pixel anbefales",
        "de": "450 x 200 Pixel empfohlen",
        "en": "450 x 200px recommended",
        "es": "450 x 200px recomendado",
        "fi": "Suositus 450 x 200px",
        "fr": "450 x 200 px recommandé",
        "hi": "450 x 200px की अनुशंसा की जाती है",
        "it": "450 x 200 px consigliato",
        "ja": "450 x 200ピクセルを推奨",
        "ko": "450x200 픽셀 권장",
        "nb": "450 x 200 px anbefales",
        "nl": "450 x 200 px aanbevolen",
        "pt-BR": "450 x 200 px recomendado",
        "pt-PT": "450 x 200 píxeis (recomendado)",
        "sv": "450 x 200px rekommenderas",
        "th": "แนะนำขนาด 450 x 200 พิกเซล",
        "zh-CN": "推荐使用 450 x 200 像素大小",
        "zh-TW": "建議使用 450 x 200px"
      }
    },
    {
      "type": "text",
      "id": "logo_max_width",
      "label": {
        "da": "Tilpasset logobredde (i pixels)",
        "de": "Benutzerdefinierte Logobreite (Pixel)",
        "en": "Custom logo width (in pixels)",
        "es": "Ancho del logotipo personalizado (en píxeles)",
        "fi": "Mukautettu logon leveys (pikseleinä)",
        "fr": "Largeur personnalisée du logo (en pixels)",
        "hi": "कस्टम लोगो की चौड़ाई (पिक्सेल)",
        "it": "Larghezza logo personalizzato (in pixel)",
        "ja": "ロゴの幅をカスタムする(ピクセルで)",
        "ko": "사용자 지정 로고 폭 (픽셀)",
        "nb": "Tilpasset logobredde (i piksler)",
        "nl": "Aangepaste logobreedte (in pixels)",
        "pt-BR": "Largura do logotipo personalizado (em pixels)",
        "pt-PT": "Largura de logótipo personalizada (em píxeis)",
        "sv": "Anpassad logotypbredd (i pixlar)",
        "th": "ความกว้างของโลโก้แบบกำหนดเอง (เป็นพิกเซล)",
        "zh-CN": "自定义 logo 宽度(像素)",
        "zh-TW": "自訂標誌寬度 (單位為像素)"
      },
      "default": {
        "da": "450",
        "de": "450",
        "en": "450",
        "es": "450",
        "fi": "450",
        "fr": "450",
        "hi": "450",
        "it": "450",
        "ja": "450",
        "ko": "450",
        "nb": "450",
        "nl": "450",
        "pt-BR": "450",
        "pt-PT": "450",
        "sv": "450",
        "th": "450",
        "zh-CN": "450",
        "zh-TW": "450"
      }
    },
    {
      "type": "header",
      "content": {
        "da": "Hovedmenu",
        "de": "Hauptmenü",
        "en": "Main menu",
        "es": "Menú principal",
        "fi": "Päävalikko",
        "fr": "Menu principal",
        "hi": "मुख्य मेनू",
        "it": "Menu principale",
        "ja": "メインメニュー",
        "ko": "주 메뉴",
        "nb": "Hovedmeny",
        "nl": "Hoofdmenu",
        "pt-BR": "Menu principal",
        "pt-PT": "Menu principal",
        "sv": "Huvudmeny",
        "th": "เมนูหลัก",
        "zh-CN": "主菜单",
        "zh-TW": "主選單"
      }
    },
    {
      "type": "link_list",
      "id": "nav_menu",
      "label": {
        "da": "Menu",
        "de": "Menü",
        "en": "Menu",
        "es": "Menú",
        "fi": "Valikko",
        "fr": "Menu",
        "hi": "मेनू",
        "it": "Menu",
        "ja": "メニュー",
        "ko": "메뉴",
        "nb": "Meny",
        "nl": "Menu",
        "pt-BR": "Menu",
        "pt-PT": "Menu",
        "sv": "Meny",
        "th": "เมนู",
        "zh-CN": "菜单",
        "zh-TW": "選單"
      },
      "default": "main-menu"
    },
    {
      "type": "checkbox",
      "id": "nav_below_logo",
      "label": {
        "da": "Centrer hovedmenuen under logoet",
        "de": "Hauptmenü unter Logo zentrieren",
        "en": "Center main menu below logo",
        "es": "Centrar el menú principal debajo del logotipo",
        "fi": "Keskitä päävalikko logon alle",
        "fr": "Centrer le menu principal sous le logo",
        "hi": "लोगो के नीचे केंद्र मुख्य मेनू",
        "it": "Centra menu principale sotto il logo",
        "ja": "ロゴの下のメインメニューを中央寄せする",
        "ko": "로고 아래 중앙 주요 메뉴",
        "nb": "Sentrer hovedmeny under logo",
        "nl": "Centreer hoofdmenu onder logo",
        "pt-BR": "Centralizar menu principal abaixo do logotipo",
        "pt-PT": "Centrar menu principal abaixo do logótipo",
        "sv": "Centrera huvudmeny under logotypen",
        "th": "จัดเมนูหลักใต้โลโก้ให้อยู่ตรงกลาง",
        "zh-CN": "在 logo 下方居中显示主菜单",
        "zh-TW": "將主選單置中並置於商標下方"
      }
    },
    {
      "type": "checkbox",
      "id": "left_aligned_logo",
      "label": {
        "da": "Venstrejuster logo",
        "de": "Logo linksbündig ausrichten",
        "en": "Left-align logo",
        "es": "Alinear el logotipo a la izquierda",
        "fi": "Tasaa logo vasemmalle",
        "fr": "Aligner le logo à gauche",
        "hi": "बाईं ओर पंक्तिबद्ध लोगो",
        "it": "Allinea logo a sinistra",
        "ja": "ロゴを左寄せする",
        "ko": "왼쪽 맞춤 로고",
        "nb": "Venstrejuster logo",
        "nl": "Logo links uitlijnen",
        "pt-BR": "Alinhar logotipo à esquerda",
        "pt-PT": "Alinhar logótipo à esquerda",
        "sv": "Vänsterjustera logotypen",
        "th": "จัดโลโก้ชิดซ้าย",
        "zh-CN": "左对齐 logo",
        "zh-TW": "將商標靠左對齊"
      }
    },
    {
      "type": "checkbox",
      "id": "show_header_lines",
      "label": {
        "da": "Vis skillelinjer i sidehoved",
        "de": "Trennlinien in Header anzeigen",
        "en": "Show divider lines in header",
        "es": "Mostrar líneas divisorias en el encabezado",
        "fi": "Näytä väliviivat otsikossa",
        "fr": "Afficher les lignes de séparation dans l'en-tête",
        "hi": "हैडर में डिवाइडर लाइन दिखाएं",
        "it": "Mostra linee divisorie nell'header",
        "ja": "ヘッダーに分割線を表示する",
        "ko": "제목에 구분선 표시",
        "nb": "Vis skillelinjer i topptekst",
        "nl": "Toon scheidingslijnen in koptekst",
        "pt-BR": "Exibir linhas divisórias no cabeçalho",
        "pt-PT": "Mostrar linhas divisórias no cabeçalho",
        "sv": "Visa delningslinjer i rubriken",
        "th": "แสดงเส้นแบ่งในส่วนหัว",
        "zh-CN": "在标头中显示分割线",
        "zh-TW": "在標頭中顯示分隔線"
      }
    },
    {
      "type": "header",
      "content": {
        "da": "Meddelelseslinje",
        "de": "Ankündigungsbereich",
        "en": "Announcement bar",
        "es": "Barra de anuncios",
        "fi": "Ilmoituspalkki",
        "fr": "Barre d'annonces",
        "hi": "घोषणा बार",
        "it": "Barra degli annunci",
        "ja": "告知バー",
        "ko": "공지 표시줄",
        "nb": "Kunngjøringslinje",
        "nl": "Aankondigingsbalk",
        "pt-BR": "Barra de avisos",
        "pt-PT": "Barra de comunicado",
        "sv": "Meddelandefält",
        "th": "แถบประกาศ",
        "zh-CN": "公告栏",
        "zh-TW": "公告列"
      }
    },
    {
      "type": "checkbox",
      "id": "show_announcement",
      "label": {
        "da": "Vis meddelelse",
        "de": "Ankündigung anzeigen",
        "en": "Show announcement",
        "es": "Mostrar anuncio",
        "fi": "Näytä ilmoitus",
        "fr": "Afficher l'annonce",
        "hi": "घोषणा डिखाएं",
        "it": "Mostra annuncio",
        "ja": "告知を表示する",
        "ko": "공지 표시",
        "nb": "Vis kunngjøring",
        "nl": "Aankondiging weergeven",
        "pt-BR": "Exibir anúncio",
        "pt-PT": "Mostrar comunicado",
        "sv": "Visa tillkännagivande",
        "th": "แสดงประกาศ",
        "zh-CN": "显示公告",
        "zh-TW": "顯示公告"
      },
      "default": true
    },
    {
      "type": "text",
      "id": "header_text",
      "label": {
        "da": "Tekst",
        "de": "Text",
        "en": "Text",
        "es": "Texto",
        "fi": "Teksti",
        "fr": "Texte",
        "hi": "टेक्स्ट",
        "it": "Testo",
        "ja": "テキスト",
        "ko": "텍스트",
        "nb": "Tekst",
        "nl": "Tekst",
        "pt-BR": "Texto",
        "pt-PT": "Texto",
        "sv": "Text",
        "th": "ข้อความ",
        "zh-CN": "文本",
        "zh-TW": "文字"
      },
      "default": {
        "da": "Meddel noget her",
        "de": "Hier etwas ankündigen",
        "en": "Announce something here",
        "es": "Anuncia algo aquí",
        "fi": "Ilmoita jotakin tässä",
        "fr": "Annoncez quelque chose ici",
        "hi": "यहां कुछ घोषित करें",
        "it": "Annuncia qualcosa qui",
        "ja": "ここで告知してください",
        "ko": "여기에 공지하십시오",
        "nb": "Kunngjør noe her",
        "nl": "Kondig hier iets aan",
        "pt-BR": "Anuncie algo aqui",
        "pt-PT": "Anunciar algo aqui",
        "sv": "Meddela något här",
        "th": "ประกาศข้อความที่นี่",
        "zh-CN": "在此处进行公告",
        "zh-TW": "在此公告資訊"
      }
    },
    {
      "type": "url",
      "id": "announcement_link",
      "label": {
        "da": "Link",
        "de": "Link",
        "en": "Link",
        "es": "Enlace",
        "fi": "Linkki",
        "fr": "Lien",
        "hi": "लिंक",
        "it": "Link",
        "ja": "リンク",
        "ko": "링크",
        "nb": "Kobling",
        "nl": "Link",
        "pt-BR": "Link",
        "pt-PT": "Ligação",
        "sv": "Länk",
        "th": "ลิงก์",
        "zh-CN": "链接",
        "zh-TW": "連結"
      },
      "info": {
        "da": "Valgfri",
        "de": "Optional",
        "en": "Optional",
        "es": "Opcional",
        "fi": "Valinnainen",
        "fr": "Facultatif",
        "hi": "वैकल्पिक",
        "it": "Facoltativo",
        "ja": "オプション",
        "ko": "선택 사항",
        "nb": "Valgfritt",
        "nl": "Optioneel",
        "pt-BR": "Opcional",
        "pt-PT": "Opcional",
        "sv": "Valfritt",
        "th": "ไม่จำเป็น",
        "zh-CN": "可选",
        "zh-TW": "(選填)"
      }
    }
  ]
}
{% endschema %}

 

Password Header

<style>
  .password-page__logo .logo {
    width: {{ section.settings.logo_max_width | escape }}px;
  }
</style>

<header class="password-page__header" role="banner"  data-section-id="{{ section.id }}" data-section-type="password-header">
  <div class="password-page__header__inner">
    {% comment %}
      Link to password modal
    {% endcomment %}
    <p class="password-login text-right small--text-center">
      <a href="#LoginModal" class="js-toggle-login-modal" data-mfp-src="#LoginModal">
        {% include 'svg-definitions' with 'lock-icon' %}
        {{ 'general.password_page.password_link' | t }}
      </a>
    </p>

    {% comment %}
      Site name or logo
    {% endcomment %}
    <div class="password-page__logo">
      <h1 class="h2" itemscope itemtype="http://schema.org/Organization">
      {% assign logo_width = section.settings.logo_max_width | escape | times: 1 %}
      {% if section.settings.logo != blank and logo_width <= 2048 %}
        {% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
        <img class="logo" src="{{ section.settings.logo | img_url: image_size }}" alt="{{ shop.name }}" itemprop="logo">
      {% else %}
        <span>{{ shop.name }}</span>
      {% endif %}
      </h1>
    </div>
  </div>
</header>



{% schema %}
{
  "name": {
    "da": "Overskrift",
    "de": "Titel",
    "en": "Header",
    "es": "Encabezado",
    "fi": "Ylätunniste",
    "fr": "En-tête",
    "hi": "हैडर",
    "it": "Header",
    "ja": "ヘッダー",
    "ko": "머리글",
    "nb": "Header",
    "nl": "Koptekst",
    "pt-BR": "Cabeçalho",
    "pt-PT": "Cabeçalho",
    "sv": "Rubrik",
    "th": "ส่วนหัว",
    "zh-CN": "标头",
    "zh-TW": "標頭"
  },
  "class": "password-header-section",
  "settings": [
    {
      "type": "image_picker",
      "id": "logo",
      "label": {
        "da": "Logobillede",
        "de": "Logo-Foto",
        "en": "Logo image",
        "es": "Logotipo",
        "fi": "Logokuva",
        "fr": "Image du logo",
        "hi": "लोगो इमेज",
        "it": "Immagine del logo",
        "ja": "ロゴ画像",
        "ko": "로고 이미지",
        "nb": "Logobilde",
        "nl": "Afbeelding van logo",
        "pt-BR": "Imagem do logotipo",
        "pt-PT": "Imagem do logótipo",
        "sv": "Logobild",
        "th": "รูปภาพโลโก้",
        "zh-CN": "logo 图片",
        "zh-TW": "標誌圖片"
      }
    },
    {
      "type": "text",
      "id": "logo_max_width",
      "label": {
        "da": "Bredde på tilpasset logo (i pixels, maks. 2048)",
        "de": "Benutzerdefinierte Logobreite (in Pixel, max. 2048)",
        "en": "Custom logo width (in pixels, max 2048)",
        "es": "Ancho del logotipo personalizado (en píxeles, máx. 2048)",
        "fi": "Mukautetun logon leveys (pikseleinä, enintään 2048)",
        "fr": "Largeur personnalisée du logo (en pixels, max. 2 048)",
        "hi": "कस्टम लोगो की चौड़ाई (पिक्सेल में, अधिकतम 2048)",
        "it": "Larghezza logo personalizzato (in pixel, massimo 2048)",
        "ja": "ロゴの幅をカスタムする(最大2048ピクセル)",
        "ko": "사용자 지정 로고 폭 (픽셀, 최대 2048)",
        "nb": "Tilpasset logobredde (i piksler, maks 2048)",
        "nl": "Breedte aangepast logo (in pixels, max 2048)",
        "pt-BR": "Largura do logotipo personalizado (em pixels, máx. 2048)",
        "pt-PT": "Largura de logótipo personalizada (em píxeis, máx. 2048)",
        "sv": "Anpassad logotypsbredd (i pixlar, max 2048)",
        "th": "ความกว้างของโลโก้แบบกำหนดเอง (เป็นพิกเซลสูงสุด 2048)",
        "zh-CN": "自定义 logo 宽度(以像素为单位,最大为 2048)",
        "zh-TW": "自訂商標寬度 (單位為像素,最大 2048 像素)"
      },
      "default": {
        "da": "200",
        "de": "200",
        "en": "200",
        "es": "200",
        "fi": "200",
        "fr": "200",
        "hi": "200",
        "it": "200",
        "ja": "200",
        "ko": "200",
        "nb": "200",
        "nl": "200",
        "pt-BR": "200",
        "pt-PT": "200",
        "sv": "200",
        "th": "200",
        "zh-CN": "200",
        "zh-TW": "200"
      }
    }
  ]
}
{% endschema %}

 

 

 

0 Likes
Highlighted
Shopify Partner
9227 1179 3246
<style>
  {%- assign logo_width = 695 -%}
  {%- assign logo_max_width = section.settings.logo_max_width | times: 1 -%}
  {% if logo_max_width < logo_width %}
    {%- assign logo_width = logo_max_width -%}
  {% endif %}
  .logo__image-wrapper {
    max-width: {{ logo_width }}px;
  }
  /*================= If logo is above navigation ================== */
  {% if section.settings.nav_below_logo %}
    .site-nav {
      {% if section.settings.show_header_lines %}
        border-top: 1px solid {{ settings.color_borders }};
        border-bottom: 1px solid {{ settings.color_borders }};
      {% endif %}
      margin-top: 30px;
    }

    {% unless section.settings.left_aligned_logo %}
      .logo__image-wrapper {
        margin: 0 auto;
      }
    {% endunless %}
  {% endif %}

  /*============ If logo is on the same line as navigation ============ */
  {% unless section.settings.nav_below_logo or section.settings.show_header_lines == false %}
    .site-header .grid--full {
      border-bottom: 1px solid {{ settings.color_borders }};
      padding-bottom: 30px;
    }
  {% endunless %}


  {% unless section.settings.nav_below_logo %}
    @media screen and (min-width: 769px) {
      .site-nav {
        text-align: right!important;
      }
    }
  {% endunless %}
</style>

<div data-section-id="{{ section.id }}" data-section-type="header-section">
  <div class="header-bar">
    <div class="wrapper medium-down--hide">
      <div class="post-large--display-table">

        {% if section.settings.show_announcement or section.settings.header_search_enable %}
          <div class="header-bar__left post-large--display-table-cell">

            {% comment %}
              Add social links to header
            {% endcomment %}

            {% comment %}
            <div class="header-bar__module header-bar__module--list">
              {% include 'social-links' %}
            </div>
            {% endcomment %}

            {% if section.settings.show_announcement %}
              <div class="header-bar__module header-bar__message">
                {% if section.settings.announcement_link != blank %}
                  <a href="{{ section.settings.announcement_link }}">
                {% endif %}
                  {{ section.settings.header_text | escape }}
                {% if section.settings.announcement_link != blank %}
                  </a>
                {% endif %}
              </div>
            {% elsif section.settings.header_search_enable %}
              <div class="header-bar__module header-bar__search">
                {% include 'search-bar' with 'header' %}
              </div>
            {% endif %}

          </div>
        {% endif %}

        <div class="header-bar__right post-large--display-table-cell">

          {% if shop.customer_accounts_enabled %}
            <ul class="header-bar__module header-bar__module--list">
              {% if customer %}
                <li>
                  <a href="{{ routes.account_url }}">{{ 'layout.customer.account' | t }}</a>
                </li>
                <li>
                  {{ 'layout.customer.log_out' | t | customer_logout_link }}
                </li>
              {% else %}
                <li>
                  {{ 'layout.customer.log_in' | t | customer_login_link }}
                </li>
                <li>{{ 'layout.customer.or' | t }}</li>
                <li>
                  {{ 'layout.customer.create_account' | t | customer_register_link }}
                </li>
              {% endif %}
            </ul>
          {% endif %}

          <div class="header-bar__module">
            <span class="header-bar__sep" aria-hidden="true"></span>
            <a href="{{ routes.cart_url }}" class="cart-page-link">
              <span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
            </a>
          </div>

          <div class="header-bar__module">
            <a href="{{ routes.cart_url }}" class="cart-page-link">
              {{ 'layout.cart.title' | t }}{% unless cart.item_count == 0 %}:{% endunless %}
              <span class="cart-count header-bar__cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
            </a>
          </div>

          {% if section.settings.header_search_enable %}
            {% if section.settings.show_announcement %}
              <div class="header-bar__module header-bar__search">
                {% include 'search-bar' with 'header' %}
              </div>
            {% endif %}
          {% endif %}

        </div>
      </div>
    </div>

    <div class="wrapper post-large--hide announcement-bar--mobile">
      {% if section.settings.show_announcement %}
        {% if section.settings.announcement_link != blank %}
          <a href="{{ section.settings.announcement_link }}">
        {% endif %}
          <span>{{ section.settings.header_text | escape }}</span>
        {% if section.settings.announcement_link != blank %}
          </a>
        {% endif %}
      {% endif %}
    </div>

    <div class="wrapper post-large--hide">
      {% unless section.settings.nav_menu == blank and section.settings.header_search_enable == false and shop.customer_accounts_enabled == false %}
        <button type="button" class="mobile-nav-trigger" id="MobileNavTrigger" aria-controls="MobileNav" aria-expanded="false">
          <span class="icon icon-hamburger" aria-hidden="true"></span>
          {{ 'layout.navigation.menu' | t }}
        </button>
      {% endunless %}
      <a href="{{ routes.cart_url }}" class="cart-page-link mobile-cart-page-link">
        <span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
        {{ 'layout.cart.title' | t }} <span class="cart-count{% if cart.item_count == 0 %} hidden-count{% endif %}">{{ cart.item_count }}</span>
      </a>
    </div>
    {% include 'mobile-nav' with linklists[section.settings.nav_menu] %}
  </div>

  <header class="site-header" role="banner">
    <div class="wrapper">

      {% if section.settings.nav_below_logo %}
        <div class="grid--full">
          <div class="grid__item">
            {% if request.page_type == 'index' %}
              <h1 class="site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% else %}
              <div class="h1 site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% endif %}
              {% if section.settings.logo != blank %}
                <noscript>
                  {% capture image_size %}{{ logo_width | escape }}x{% endcapture %}
                  <div class="logo__image-wrapper">
                    {{ section.settings.logo | img_url: image_size | img_tag: shop.name }}
                  </div>
                </noscript>
                <div class="logo__image-wrapper supports-js">
                  <a href="{{ routes.root_url }}" itemprop="url" style="padding-top:{{ 1 | divided_by: section.settings.logo.aspect_ratio | times: 100}}%;">
                    {% assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="logo__image lazyload"
                         src="{{ section.settings.logo | img_url: '300x300' }}"
                         data-src="{{ img_url }}"
                         data-widths="[120, 180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048]"
                         data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ shop.name | escape }}"
                         itemprop="logo">
                  </a>
                </div>
              {% else %}
                <a href="{{ routes.root_url }}" itemprop="url">{{ shop.name }}</a>
              {% endif %}
            {% if request.page_type == 'index' %}
              </h1>
            {% else %}
              </div>
            {% endif %}
          </div>
        </div>
        <div class="grid--full medium-down--hide">
          <div class="grid__item">
            {% include 'site-nav' with linklists[section.settings.nav_menu] %}
          </div>
        </div>
      {% else %}
        <div class="grid--full post-large--display-table">
          <div class="grid__item post-large--one-third post-large--display-table-cell">
            {% if request.page_type == 'index' %}
              <h1 class="site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% else %}
              <div class="h1 site-header__logo{% if section.settings.logo == blank %}{% unless section.settings.left_aligned_logo == false and section.settings.nav_below_logo %} post-large--left{% endunless %}{% endif %}" itemscope itemtype="http://schema.org/Organization">
            {% endif %}
              {% if section.settings.logo != blank %}
                <noscript>
                  {% capture image_size %}{{ logo_width | escape }}x{% endcapture %}
                  <div class="logo__image-wrapper">
                    {{ section.settings.logo | img_url: image_size | img_tag: shop.name }}
                  </div>
                </noscript>
                <div class="logo__image-wrapper supports-js">
                  <a href="{{ routes.root_url }}" itemprop="url" style="padding-top:{{ 1 | divided_by: section.settings.logo.aspect_ratio | times: 100}}%;">
                    {% assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="logo__image lazyload"
                         src="{{ section.settings.logo | img_url: 'master' }}"
                         data-src="{{ img_url }}"
                         data-widths="[120, 180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 1944, 2048]"
                         data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                         data-sizes="auto"
                         alt="{{ shop.name | escape }}"
                         itemprop="logo">
                  </a>
                </div>
              {% else %}
                <a href="{{ routes.root_url }}" itemprop="url">{{ shop.name }}</a>
              {% endif %}
            {% if request.page_type == 'index' %}
              </h1>
            {% else %}
              </div>
            {% endif %}
          </div>
          <div class="grid__item post-large--two-thirds post-large--display-table-cell medium-down--hide">
            {% include 'site-nav' with linklists[section.settings.nav_menu] %}
          </div>
        </div>
      {% endif %}

    </div>
  </header>
</div>


{% schema %}
{
  "name": {
    "da": "Overskrift",
    "de": "Titel",
    "en": "Header",
    "es": "Encabezado",
    "fi": "Ylätunniste",
    "fr": "En-tête",
    "hi": "हैडर",
    "it": "Header",
    "ja": "ヘッダー",
    "ko": "머리글",
    "nb": "Header",
    "nl": "Koptekst",
    "pt-BR": "Cabeçalho",
    "pt-PT": "Cabeçalho",
    "sv": "Rubrik",
    "th": "ส่วนหัว",
    "zh-CN": "标头",
    "zh-TW": "標頭"
  },
  "settings": [
    {
      "type": "checkbox",
      "id": "header_search_enable",
      "label": {
        "da": "Vis søgelinje",
        "de": "Suchleiste anzeigen",
        "en": "Show search bar",
        "es": "Mostrar barra de búsqueda",
        "fi": "Näytä hakupalkki",
        "fr": "Afficher la barre de recherche",
        "hi": "सर्च बार दिखाएं",
        "it": "Mostra barra di ricerca",
        "ja": "検索バーを表示する",
        "ko": "검색 바 표시",
        "nb": "Vis søkefelt",
        "nl": "Zoekbalk weergeven",
        "pt-BR": "Exibir barra de pesquisa",
        "pt-PT": "Mostrar barra de pesquisa",
        "sv": "Visa sökfältet",
        "th": "แสดงแถบการค้นหา",
        "zh-CN": "显示搜索栏",
        "zh-TW": "顯示搜尋列"
      }
    },
    {
      "type": "image_picker",
      "id": "logo",
      "label": {
        "da": "Logo",
        "de": "Logo",
        "en": "Logo",
        "es": "Logotipo",
        "fi": "Logo",
        "fr": "Logo",
        "hi": "लोगो",
        "it": "Logo",
        "ja": "ロゴ",
        "ko": "로고",
        "nb": "Logo",
        "nl": "Logo",
        "pt-BR": "Logotipo",
        "pt-PT": "Logótipo",
        "sv": "Logotyp",
        "th": "โลโก้",
        "zh-CN": "logo",
        "zh-TW": "商標"
      },
      "info": {
        "da": "450 x 200 pixel anbefales",
        "de": "450 x 200 Pixel empfohlen",
        "en": "450 x 200px recommended",
        "es": "450 x 200px recomendado",
        "fi": "Suositus 450 x 200px",
        "fr": "450 x 200 px recommandé",
        "hi": "450 x 200px की अनुशंसा की जाती है",
        "it": "450 x 200 px consigliato",
        "ja": "450 x 200ピクセルを推奨",
        "ko": "450x200 픽셀 권장",
        "nb": "450 x 200 px anbefales",
        "nl": "450 x 200 px aanbevolen",
        "pt-BR": "450 x 200 px recomendado",
        "pt-PT": "450 x 200 píxeis (recomendado)",
        "sv": "450 x 200px rekommenderas",
        "th": "แนะนำขนาด 450 x 200 พิกเซล",
        "zh-CN": "推荐使用 450 x 200 像素大小",
        "zh-TW": "建議使用 450 x 200px"
      }
    },
    {
      "type": "text",
      "id": "logo_max_width",
      "label": {
        "da": "Tilpasset logobredde (i pixels)",
        "de": "Benutzerdefinierte Logobreite (Pixel)",
        "en": "Custom logo width (in pixels)",
        "es": "Ancho del logotipo personalizado (en píxeles)",
        "fi": "Mukautettu logon leveys (pikseleinä)",
        "fr": "Largeur personnalisée du logo (en pixels)",
        "hi": "कस्टम लोगो की चौड़ाई (पिक्सेल)",
        "it": "Larghezza logo personalizzato (in pixel)",
        "ja": "ロゴの幅をカスタムする(ピクセルで)",
        "ko": "사용자 지정 로고 폭 (픽셀)",
        "nb": "Tilpasset logobredde (i piksler)",
        "nl": "Aangepaste logobreedte (in pixels)",
        "pt-BR": "Largura do logotipo personalizado (em pixels)",
        "pt-PT": "Largura de logótipo personalizada (em píxeis)",
        "sv": "Anpassad logotypbredd (i pixlar)",
        "th": "ความกว้างของโลโก้แบบกำหนดเอง (เป็นพิกเซล)",
        "zh-CN": "自定义 logo 宽度(像素)",
        "zh-TW": "自訂標誌寬度 (單位為像素)"
      },
      "default": {
        "da": "450",
        "de": "450",
        "en": "450",
        "es": "450",
        "fi": "450",
        "fr": "450",
        "hi": "450",
        "it": "450",
        "ja": "450",
        "ko": "450",
        "nb": "450",
        "nl": "450",
        "pt-BR": "450",
        "pt-PT": "450",
        "sv": "450",
        "th": "450",
        "zh-CN": "450",
        "zh-TW": "450"
      }
    },
    {
      "type": "header",
      "content": {
        "da": "Hovedmenu",
        "de": "Hauptmenü",
        "en": "Main menu",
        "es": "Menú principal",
        "fi": "Päävalikko",
        "fr": "Menu principal",
        "hi": "मुख्य मेनू",
        "it": "Menu principale",
        "ja": "メインメニュー",
        "ko": "주 메뉴",
        "nb": "Hovedmeny",
        "nl": "Hoofdmenu",
        "pt-BR": "Menu principal",
        "pt-PT": "Menu principal",
        "sv": "Huvudmeny",
        "th": "เมนูหลัก",
        "zh-CN": "主菜单",
        "zh-TW": "主選單"
      }
    },
    {
      "type": "link_list",
      "id": "nav_menu",
      "label": {
        "da": "Menu",
        "de": "Menü",
        "en": "Menu",
        "es": "Menú",
        "fi": "Valikko",
        "fr": "Menu",
        "hi": "मेनू",
        "it": "Menu",
        "ja": "メニュー",
        "ko": "메뉴",
        "nb": "Meny",
        "nl": "Menu",
        "pt-BR": "Menu",
        "pt-PT": "Menu",
        "sv": "Meny",
        "th": "เมนู",
        "zh-CN": "菜单",
        "zh-TW": "選單"
      },
      "default": "main-menu"
    },
    {
      "type": "checkbox",
      "id": "nav_below_logo",
      "label": {
        "da": "Centrer hovedmenuen under logoet",
        "de": "Hauptmenü unter Logo zentrieren",
        "en": "Center main menu below logo",
        "es": "Centrar el menú principal debajo del logotipo",
        "fi": "Keskitä päävalikko logon alle",
        "fr": "Centrer le menu principal sous le logo",
        "hi": "लोगो के नीचे केंद्र मुख्य मेनू",
        "it": "Centra menu principale sotto il logo",
        "ja": "ロゴの下のメインメニューを中央寄せする",
        "ko": "로고 아래 중앙 주요 메뉴",
        "nb": "Sentrer hovedmeny under logo",
        "nl": "Centreer hoofdmenu onder logo",
        "pt-BR": "Centralizar menu principal abaixo do logotipo",
        "pt-PT": "Centrar menu principal abaixo do logótipo",
        "sv": "Centrera huvudmeny under logotypen",
        "th": "จัดเมนูหลักใต้โลโก้ให้อยู่ตรงกลาง",
        "zh-CN": "在 logo 下方居中显示主菜单",
        "zh-TW": "將主選單置中並置於商標下方"
      }
    },
    {
      "type": "checkbox",
      "id": "left_aligned_logo",
      "label": {
        "da": "Venstrejuster logo",
        "de": "Logo linksbündig ausrichten",
        "en": "Left-align logo",
        "es": "Alinear el logotipo a la izquierda",
        "fi": "Tasaa logo vasemmalle",
        "fr": "Aligner le logo à gauche",
        "hi": "बाईं ओर पंक्तिबद्ध लोगो",
        "it": "Allinea logo a sinistra",
        "ja": "ロゴを左寄せする",
        "ko": "왼쪽 맞춤 로고",
        "nb": "Venstrejuster logo",
        "nl": "Logo links uitlijnen",
        "pt-BR": "Alinhar logotipo à esquerda",
        "pt-PT": "Alinhar logótipo à esquerda",
        "sv": "Vänsterjustera logotypen",
        "th": "จัดโลโก้ชิดซ้าย",
        "zh-CN": "左对齐 logo",
        "zh-TW": "將商標靠左對齊"
      }
    },
    {
      "type": "checkbox",
      "id": "show_header_lines",
      "label": {
        "da": "Vis skillelinjer i sidehoved",
        "de": "Trennlinien in Header anzeigen",
        "en": "Show divider lines in header",
        "es": "Mostrar líneas divisorias en el encabezado",
        "fi": "Näytä väliviivat otsikossa",
        "fr": "Afficher les lignes de séparation dans l'en-tête",
        "hi": "हैडर में डिवाइडर लाइन दिखाएं",
        "it": "Mostra linee divisorie nell'header",
        "ja": "ヘッダーに分割線を表示する",
        "ko": "제목에 구분선 표시",
        "nb": "Vis skillelinjer i topptekst",
        "nl": "Toon scheidingslijnen in koptekst",
        "pt-BR": "Exibir linhas divisórias no cabeçalho",
        "pt-PT": "Mostrar linhas divisórias no cabeçalho",
        "sv": "Visa delningslinjer i rubriken",
        "th": "แสดงเส้นแบ่งในส่วนหัว",
        "zh-CN": "在标头中显示分割线",
        "zh-TW": "在標頭中顯示分隔線"
      }
    },
    {
      "type": "header",
      "content": {
        "da": "Meddelelseslinje",
        "de": "Ankündigungsbereich",
        "en": "Announcement bar",
        "es": "Barra de anuncios",
        "fi": "Ilmoituspalkki",
        "fr": "Barre d'annonces",
        "hi": "घोषणा बार",
        "it": "Barra degli annunci",
        "ja": "告知バー",
        "ko": "공지 표시줄",
        "nb": "Kunngjøringslinje",
        "nl": "Aankondigingsbalk",
        "pt-BR": "Barra de avisos",
        "pt-PT": "Barra de comunicado",
        "sv": "Meddelandefält",
        "th": "แถบประกาศ",
        "zh-CN": "公告栏",
        "zh-TW": "公告列"
      }
    },
    {
      "type": "checkbox",
      "id": "show_announcement",
      "label": {
        "da": "Vis meddelelse",
        "de": "Ankündigung anzeigen",
        "en": "Show announcement",
        "es": "Mostrar anuncio",
        "fi": "Näytä ilmoitus",
        "fr": "Afficher l'annonce",
        "hi": "घोषणा डिखाएं",
        "it": "Mostra annuncio",
        "ja": "告知を表示する",
        "ko": "공지 표시",
        "nb": "Vis kunngjøring",
        "nl": "Aankondiging weergeven",
        "pt-BR": "Exibir anúncio",
        "pt-PT": "Mostrar comunicado",
        "sv": "Visa tillkännagivande",
        "th": "แสดงประกาศ",
        "zh-CN": "显示公告",
        "zh-TW": "顯示公告"
      },
      "default": true
    },
    {
      "type": "text",
      "id": "header_text",
      "label": {
        "da": "Tekst",
        "de": "Text",
        "en": "Text",
        "es": "Texto",
        "fi": "Teksti",
        "fr": "Texte",
        "hi": "टेक्स्ट",
        "it": "Testo",
        "ja": "テキスト",
        "ko": "텍스트",
        "nb": "Tekst",
        "nl": "Tekst",
        "pt-BR": "Texto",
        "pt-PT": "Texto",
        "sv": "Text",
        "th": "ข้อความ",
        "zh-CN": "文本",
        "zh-TW": "文字"
      },
      "default": {
        "da": "Meddel noget her",
        "de": "Hier etwas ankündigen",
        "en": "Announce something here",
        "es": "Anuncia algo aquí",
        "fi": "Ilmoita jotakin tässä",
        "fr": "Annoncez quelque chose ici",
        "hi": "यहां कुछ घोषित करें",
        "it": "Annuncia qualcosa qui",
        "ja": "ここで告知してください",
        "ko": "여기에 공지하십시오",
        "nb": "Kunngjør noe her",
        "nl": "Kondig hier iets aan",
        "pt-BR": "Anuncie algo aqui",
        "pt-PT": "Anunciar algo aqui",
        "sv": "Meddela något här",
        "th": "ประกาศข้อความที่นี่",
        "zh-CN": "在此处进行公告",
        "zh-TW": "在此公告資訊"
      }
    },
    {
      "type": "url",
      "id": "announcement_link",
      "label": {
        "da": "Link",
        "de": "Link",
        "en": "Link",
        "es": "Enlace",
        "fi": "Linkki",
        "fr": "Lien",
        "hi": "लिंक",
        "it": "Link",
        "ja": "リンク",
        "ko": "링크",
        "nb": "Kobling",
        "nl": "Link",
        "pt-BR": "Link",
        "pt-PT": "Ligação",
        "sv": "Länk",
        "th": "ลิงก์",
        "zh-CN": "链接",
        "zh-TW": "連結"
      },
      "info": {
        "da": "Valgfri",
        "de": "Optional",
        "en": "Optional",
        "es": "Opcional",
        "fi": "Valinnainen",
        "fr": "Facultatif",
        "hi": "वैकल्पिक",
        "it": "Facoltativo",
        "ja": "オプション",
        "ko": "선택 사항",
        "nb": "Valgfritt",
        "nl": "Optioneel",
        "pt-BR": "Opcional",
        "pt-PT": "Opcional",
        "sv": "Valfritt",
        "th": "ไม่จำเป็น",
        "zh-CN": "可选",
        "zh-TW": "(選填)"
      }
    }
  ]
}
{% endschema %}

 

 

Password heaer

<style>
  .password-page__logo .logo {
    width: {{ section.settings.logo_max_width | escape }}px;
  }
</style>

<header class="password-page__header" role="banner"  data-section-id="{{ section.id }}" data-section-type="password-header">
  <div class="password-page__header__inner">
    {% comment %}
      Link to password modal
    {% endcomment %}
    <p class="password-login text-right small--text-center">
      <a href="#LoginModal" class="js-toggle-login-modal" data-mfp-src="#LoginModal">
        {% include 'svg-definitions' with 'lock-icon' %}
        {{ 'general.password_page.password_link' | t }}
      </a>
    </p>

    {% comment %}
      Site name or logo
    {% endcomment %}
    <div class="password-page__logo">
      <h1 class="h2" itemscope itemtype="http://schema.org/Organization">
      {% assign logo_width = section.settings.logo_max_width | escape | times: 1 %}
      {% if section.settings.logo != blank and logo_width <= 2048 %}
        {% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
        <img class="logo" src="{{ section.settings.logo | img_url: 'master' }}" alt="{{ shop.name }}" itemprop="logo">
      {% else %}
        <span>{{ shop.name }}</span>
      {% endif %}
      </h1>
    </div>
  </div>
</header>



{% schema %}
{
  "name": {
    "da": "Overskrift",
    "de": "Titel",
    "en": "Header",
    "es": "Encabezado",
    "fi": "Ylätunniste",
    "fr": "En-tête",
    "hi": "हैडर",
    "it": "Header",
    "ja": "ヘッダー",
    "ko": "머리글",
    "nb": "Header",
    "nl": "Koptekst",
    "pt-BR": "Cabeçalho",
    "pt-PT": "Cabeçalho",
    "sv": "Rubrik",
    "th": "ส่วนหัว",
    "zh-CN": "标头",
    "zh-TW": "標頭"
  },
  "class": "password-header-section",
  "settings": [
    {
      "type": "image_picker",
      "id": "logo",
      "label": {
        "da": "Logobillede",
        "de": "Logo-Foto",
        "en": "Logo image",
        "es": "Logotipo",
        "fi": "Logokuva",
        "fr": "Image du logo",
        "hi": "लोगो इमेज",
        "it": "Immagine del logo",
        "ja": "ロゴ画像",
        "ko": "로고 이미지",
        "nb": "Logobilde",
        "nl": "Afbeelding van logo",
        "pt-BR": "Imagem do logotipo",
        "pt-PT": "Imagem do logótipo",
        "sv": "Logobild",
        "th": "รูปภาพโลโก้",
        "zh-CN": "logo 图片",
        "zh-TW": "標誌圖片"
      }
    },
    {
      "type": "text",
      "id": "logo_max_width",
      "label": {
        "da": "Bredde på tilpasset logo (i pixels, maks. 2048)",
        "de": "Benutzerdefinierte Logobreite (in Pixel, max. 2048)",
        "en": "Custom logo width (in pixels, max 2048)",
        "es": "Ancho del logotipo personalizado (en píxeles, máx. 2048)",
        "fi": "Mukautetun logon leveys (pikseleinä, enintään 2048)",
        "fr": "Largeur personnalisée du logo (en pixels, max. 2 048)",
        "hi": "कस्टम लोगो की चौड़ाई (पिक्सेल में, अधिकतम 2048)",
        "it": "Larghezza logo personalizzato (in pixel, massimo 2048)",
        "ja": "ロゴの幅をカスタムする(最大2048ピクセル)",
        "ko": "사용자 지정 로고 폭 (픽셀, 최대 2048)",
        "nb": "Tilpasset logobredde (i piksler, maks 2048)",
        "nl": "Breedte aangepast logo (in pixels, max 2048)",
        "pt-BR": "Largura do logotipo personalizado (em pixels, máx. 2048)",
        "pt-PT": "Largura de logótipo personalizada (em píxeis, máx. 2048)",
        "sv": "Anpassad logotypsbredd (i pixlar, max 2048)",
        "th": "ความกว้างของโลโก้แบบกำหนดเอง (เป็นพิกเซลสูงสุด 2048)",
        "zh-CN": "自定义 logo 宽度(以像素为单位,最大为 2048)",
        "zh-TW": "自訂商標寬度 (單位為像素,最大 2048 像素)"
      },
      "default": {
        "da": "200",
        "de": "200",
        "en": "200",
        "es": "200",
        "fi": "200",
        "fr": "200",
        "hi": "200",
        "it": "200",
        "ja": "200",
        "ko": "200",
        "nb": "200",
        "nl": "200",
        "pt-BR": "200",
        "pt-PT": "200",
        "sv": "200",
        "th": "200",
        "zh-CN": "200",
        "zh-TW": "200"
      }
    }
  ]
}
{% endschema %}

@sourcer 

Thanlk 

header code

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
18 0 7

@KetanKumar thank you! I've updated my code but it still looks the same.

 

Screen Shot 2020-10-26 at 8.48.29 PM.png

0 Likes
Highlighted
Shopify Partner
9227 1179 3246

@sourcer 

if possible to add on staff so i will update code

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like