Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Different Logos on Homepage and Collection DEBUT

Different Logos on Homepage and Collection DEBUT

Mototech271
Tourist
8 0 5

Hi,

how do i have to change the code to get one logo for the header at homepage and a different one for the header at collection sites?

Im using the debut design. The code underneath is taken from header.liquid.

Please help!

 

  {% 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 request.page_type == 'index' %}
          <h1 class="h2 site-header__logo">
        {% else %}
          <div class="h2 site-header__logo">
        {% endif %}
          {% if section.settings.logo %}
            {%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
            <a href="{{ routes.root_url }}" class="site-header__logo-image{% if section.settings.align_logo == 'center' %} site-header__logo-image--centered{% endif %}">
              {% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
              <img class="lazyload js"
                   src="{{ section.settings.logo | img_url }}"
                   data-src="{{ img_url }}"                   
                   data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                   data-sizes="auto"
                   alt="{{ logo_alt | escape }}"
                   >
              <noscript>
                {% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
                <img src="{{ section.settings.logo | img_url: image_size }}"
                     srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x"
                     alt="{{ section.settings.logo.alt | default: shop.name }}"
                     >
              </noscript>
            </a>
          {% else %}
            <a class="site-header__logo-link" href="{{ routes.root_url }}">{{ shop.name }}</a>
          {% endif %}
        {% if request.page_type == 'index' %}
          </h1>
        {% else %}
          </div>
        {% endif %}

 

 

Replies 3 (3)

Guleria
Shopify Partner
3671 740 1037

Hello @Mototech271 ,

Check the login in the code

  {% 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 request.page_type == 'index' %}
          <h1 class="h2 site-header__logo">
        {% else %}
          <div class="h2 site-header__logo">
        {% endif %}
          {% if section.settings.logo and template == 'index'%}
            {%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
            <a href="{{ routes.root_url }}" class="site-header__logo-image{% if section.settings.align_logo == 'center' %} site-header__logo-image--centered{% endif %}">
              {% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
              <img class="lazyload js"
                   src="{{ section.settings.logo | img_url }}"
                   data-src="{{ img_url }}"                   
                   data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
                   data-sizes="auto"
                   alt="{{ logo_alt | escape }}"
                   >
              <noscript>
                {% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
                <img src="{{ section.settings.logo | img_url: image_size }}"
                     srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x"
                     alt="{{ section.settings.logo.alt | default: shop.name }}"
                     >
              </noscript>
            </a>
          {% else %}
            <a class="site-header__logo-link" href="{{ routes.root_url }}">{{ shop.name }}</a>
          {% endif %}
		  {% if template != 'index'%}
		     // Your INNER PAGES LOGO CODE WILL GO HERE
			 // Once you add the logo code  use else for next line
            <a class="site-header__logo-link" href="{{ routes.root_url }}">{{ shop.name }}</a>
          {% endif %}
        {% if request.page_type == 'index' %}
          </h1>
        {% else %}
          </div>
        {% endif %}

You can add static code in comment  ( Your INNER PAGES LOGO CODE WILL GO HERE ) or you can create another option to upload logo for inner pages parallel to the existing logo settings.
And once you create settings then in place of static code call that logo dynamically in same way as theme existing code for homepage.

Thanks

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com
- Try GEMPAGES a great page builder
- If you want to help me please PAYPAL
Mototech271
Tourist
8 0 5

That worked!

Thank you so much!

paccto
New Member
9 0 0

Hi please I tried but I think i don understand how to make it work.