How to change header-menu layout Envy Theme

[Teddy9]

Fellow community member,

First my I’d like to express my appreciation for the help I’ve received to this point. You guys helped me very much.

I have a situation with the header-menu which I’d tried to solve but obviously was not able to.

I prepared a slide for your reference but a short explanation; How can I make the header-menu layout what you see after scrolling permanent, with preservation of the announcement bar? It has a much better layout design.

note: I enclosed the store url and password in the slide.

[suyash1]

@Teddy9 - can you please share your store URL and password?

[KetanKumar]

@Teddy9

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[LitCommerce]

Hi @Teddy9 ,

Go to Assets > custom.css and paste this at the bottom of the file:

.header-wrapper.js.stuck {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 4;
}
.sticky-header-wrapper.sticky {
	display: none !important;
}

Hope it helps!

[Teddy9]

Hi,

Thank you for your answer, I tried it and this is the result. The header logo pops to the middle (should be left) and the header changing dynamic stays the same.

Any idea how to proceed next?

[KetanKumar]

@Teddy9

if possible to share store url

[Teddy9]

Sure https://mood-street-petit.myshopify.com/ and password is: ‘jolo’

[LitCommerce]

Hi @Teddy9 ,

Are you wanting it to always display like this?

Please send me the code of header.liquid file, I will help you to change it

[Teddy9]

Yes please! Thank you for you great assistance! Here is the code header.liquid

.site-header__logo-image img, .overlay-logo-image { max-width: {{ section.settings.logo_max_width }}px; } .site-header__logo-image img, .overlay-logo-image { width: {{ section.settings.logo_max_width }}px; } .logo-placement-within-wrapper--logo { width: {{ section.settings.logo_max_width }}px; flex-basis: {{ section.settings.logo_max_width }}px; } #site-header svg:not(.icon-caret), .sticky-header-wrapper svg { height: {{ section.settings.icon-size }}px; } @media screen and (max-width: 767px) { #site-header svg, .sticky-header-wrapper svg { height: 24px; } } .top-search #search-wrapper { background: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--page-background){% else %}var(--header-background){% endif %}!important; border-bottom: 1px solid {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--page-background){% else %}var(--header-background){% endif %}!important; } #top-search-wrapper svg { stroke: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}!important; } .top-search input { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}!important; } #top-search-wrapper #search_text::placeholder { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } #top-search-wrapper #search_text::-webkit-input-placeholder { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } #top-search-wrapper #search_text:-ms-input-placeholder { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } #top-search-wrapper #search_text::-moz-placeholder { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } #top-search-wrapper #search_text:-moz-placeholder { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } .top-search { border-bottom: solid 1px {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-border-color){% endif %}!important; } .predictive-search-group { background-color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--page-background){% else %}var(--header-background){% endif %}!important; } .search-results__meta { background: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--page-background){% else %}var(--header-background){% endif %}!important; } .search-results__meta .search-results__meta-clear { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } .search-results__meta-view-all a { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}!important; } .search-results-panel .predictive-search-group h2 { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; border-bottom: solid 1px {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-border-color){% endif %}; } .search-results-panel .predictive-search-group .search-vendor, .search-results-panel .predictive-search-group .money { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}; } .search--result-group h5 a { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}!important; } .predictive-loading { color: {% if settings.header-background-color == "rgba(0,0,0,0)" %}var(--color-primary){% else %}var(--header-text){% endif %}!important; }

{% capture header_logo %}

{% capture props %}itemprop=“logo”{% endcapture %}

{% comment %}If main logo but no overlay logo{% endcomment %}
{% if section.settings.logo and section.settings.overlay_logo == blank %}

{% capture alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
{% render ‘responsive-image’ with section.settings.logo, alt: alt, props: props %}

{% comment %}If overlay logo enabled but not main{% endcomment %}
{% elsif section.settings.overlay_logo and section.settings.logo == blank %}
{% capture overlayAlt %}{{ section.settings.overlay_logo.alt | default: shop.name }}{% endcapture %}

{% if template == ‘index’ and section.settings.overlay_header %}

{% render ‘responsive-image’ with section.settings.overlay_logo, alt: overlayAlt, props: props, class: “overlay-logo-image” %}

{{ shop.name }}
{% else %}
{{ shop.name }}
{% endif %}

{% comment %}If both logos are enabled{% endcomment %}
{% elsif section.settings.overlay_logo and section.settings.logo %}

{% capture alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
{% capture overlayAlt %}{{ section.settings.overlay_logo.alt | default: shop.name }}{% endcapture %}

{% if template == ‘index’ and section.settings.overlay_header %}
{% render ‘responsive-image’ with section.settings.overlay_logo, alt: overlayAlt, props: props, class: “overlay-logo-image” %}
{% render ‘responsive-image’ with section.settings.logo, alt: alt, props: props, class: “overlay-logo-image–sticky” %}
{% else %}
{% render ‘responsive-image’ with section.settings.logo, alt: alt, props: props %}
{% endif %}

{% comment %}Show text title{% endcomment %}
{% else %}
{{ shop.name }}
{% endif %}

{% endcapture %}

{% if section.settings.sticky_header %}

{% if section.settings.sticky_header_logo %}

{{ header_logo }}

{% endif %}

{% comment %}#main-navigation-wrapper will be copied here{% endcomment %}

{% comment %}icons from .cart-link will be copied here{% endcomment %}

{% comment %}Search box will be copied here{% endcomment %}

{% comment %}Mobile menu will be copied here{% endcomment %}

{% endif %}

{% render 'nav-mobile' %}

{{ header_logo }}

{% if section.settings.search-enable %} {% endif %}

{% if settings.cart-type == ‘drawer’ %}
<button
type=“button”
class=“alt-focus header-link header-link–button slide-menu slide-menu-cart”
aria-label=“{{ ‘cart.general.open_cart’ | t }}”
aria-controls=“cartSlideoutAside”

{% else %}



{% endif %}

{% capture locale %}
{% render ‘localization-form’, enable_locale_selector: section.settings.enable_locale_selector, enable_country_selector: section.settings.enable_country_selector %}
{% endcapture %}

{% capture top_bar_or_locale %}
{% if section.settings.top_bar_linklist != blank %}

{% render 'nav--top' with section.settings.top_bar_linklist, class: 'nav-pills' %}

{% else %}

{{ locale }}

{% endif %} {% endcapture %}

{% capture locale_alternative %}
{% if section.settings.top_bar_linklist != blank %}
{% if section.settings.enable_country_selector %}

{{ locale }}

{% endif %} {% endif %} {% endcapture%}

{% capture main_icons %}

{% if section.settings.search-enable %}
• {% if settings.predictive_search_enabled %} {% if section.settings.label-enable %}{{ 'layout.header.search' | t }}{% endif %} {% else %} {% if section.settings.label-enable %}{{ 'layout.header.search' | t }}{% endif %} {% endif %}
{% endif %}

{% if shop.customer_accounts_enabled %}
{% if customer %}
<li{% if section.settings.search-enable == false %} class=“login-no-padding”{% endif %}>


{% if section.settings.label-enable %}{{ ‘layout.header.account’ | t }}{% endif %}


{% else %} {% if section.settings.label-enable %}{{ 'layout.header.account' | t }}{% endif %} {% endif %} {% endif %}
• {% if settings.cart-type == 'drawer' %} {% if section.settings.label-enable %} {{ 'layout.header.your_cart' | t }} {% case section.settings.cart-number %} {% when 'quantity' %} - {{ cart.item_count }} {% when 'total' %} - {{ cart.total_price | money }} {% endcase %} {% else %} {% case section.settings.cart-number %} {% when 'quantity' %} {{ cart.item_count }} {% when 'total' %} {{ cart.total_price | money }} {% endcase %} {% endif %} {% else %} {% if section.settings.label-enable %} {{ 'layout.header.your_cart' | t }} {% case section.settings.cart-number %} {% when 'quantity' %} - {{ cart.item_count }} {% when 'total' %} - {{ cart.total_price | money }} {% endcase %} {% else %} {% case section.settings.cart-number %} {% when 'quantity' %} {{ cart.item_count }} {% when 'total' %} {{ cart.total_price | money }} {% endcase %} {% endif %} {% endif %}

{% endcapture %}

{% capture main_icons_locale %}

{{ main_icons }} {{ locale_alternative }}

{% endcapture %}

{% if section.settings.search-enable %}
{% render ‘search-bar’ %}
{% endif %}

{% case section.settings.logo-placement %}

{% when ‘below-header’ %}

{{ top_bar_or_locale }}

{{ main_icons_locale }}

{% when ‘within-header’ %}

{{ top_bar_or_locale }}

{{ header_logo }}

{{ main_icons_locale }}

{% endcase %}

{% if section.settings.logo-placement == ‘below-header’ %}
{{ header_logo }}
{% endif %}

{% if section.settings.main_linklist != '' %}

{% render 'nav--main' with section.settings.main_linklist, class: 'nav-pills', section: section %}

{% endif %}

{% capture main_icons %}

{% if section.settings.search-enable %}
• {% if section.settings.label-enable %}{{ 'layout.header.search' | t }}{% endif %}
{% endif %}

{% if shop.customer_accounts_enabled %}
{% if customer %}
<li{% if section.settings.search-enable == false %} class=“login-no-padding”{% endif %}>


{% if section.settings.label-enable %}{{ ‘layout.header.account’ | t }}{% endif %}


{% else %} {% if section.settings.label-enable %}{{ 'layout.header.account' | t }}{% endif %} {% endif %} {% endif %}
• {% if section.settings.label-enable %} {{ 'layout.header.your_cart' | t }} {% case section.settings.cart-number %} {% when 'quantity' %} - {{ cart.item_count }} {% when 'total' %} - {{ cart.total_price | money }} {% endcase %} {% else %} {% case section.settings.cart-number %} {% when 'quantity' %} {{ cart.item_count }} {% when 'total' %} {{ cart.total_price | money }} {% endcase %} {% endif %}

{% endcapture %} {% capture main_icons_locale %}

{{ main_icons }} {{ locale_alternative }}

{% endcapture %}

{% case section.settings.logo-placement %}

{% when ‘below-header’ %}

{{ top_bar_or_locale }}

{{ main_icons_locale }}

{% when ‘within-header’ %}

{{ top_bar_or_locale }}

{{ header_logo }}

{{ main_icons_locale }}

{% endcase %}

{% if section.settings.logo-placement == ‘below-header’ %}
{{ header_logo }}
{% endif %}

{% if section.settings.main_linklist != '' %}

{% render 'nav--main' with section.settings.main_linklist, class: 'nav-pills', section: section %}

{% endif %}

{% schema %}
{
“name”: {
“en”: “Header”,
“de”: “Überschrift”,
“es”: “Encabezado”,
“fr”: “En-tête”,
“pt-PT”: “Cabeçalho”
},
“settings”: [
{
“type”: “checkbox”,
“id”: “sticky_header”,
“label”: {
“en”: “Show ‘sticky’ header”,
“de”: “Feststehende Kopfzeile aktivieren”,
“es”: “Habilitar encabezado «permanente»”,
“fr”: “Activer l’en-tête collant”,
“pt-PT”: “Ativar cabeçalho "adesivo"”
},
“default”: false
},
{
“type”: “checkbox”,
“id”: “overlay_header”,
“label”: {
“en”: “Overlay header on homepage”,
“de”: “Overlay-Kopfzeile auf Homepage”,
“es”: “Encabezado de superposición en la página de inicio”,
“fr”: “Superposition d’en-tête sur la page d’accueil”,
“pt-PT”: “Cabeçalho de sobreposição na página inicial”
},
“default”: true
},
{
“type”: “header”,
“content”: {
“en”: “Logo”,
“de”: “Logo”,
“es”: “Logotipo”,
“fr”: “Logo”,
“pt-PT”: “Logótipo”
}
},
{
“type”: “image_picker”,
“id”: “logo”,
“label”: {
“en”: “Logo image”,
“de”: “Logobild”,
“es”: “Imagen del logotipo”,
“fr”: “Image du logo”,
“pt-PT”: “Imagem do logótipo”
},
“info”: {
“en”: “250 x 133px recommended”,
“de”: “250 x 133 px empfohlen”,
“es”: “Recomendado 250 x 133 px”,
“fr”: “250 x 133 px recommandé”,
“pt-PT”: “250 x 133px, recomendado”
}
},
{
“type”: “image_picker”,
“id”: “overlay_logo”,
“label”: {
“en”: “Overlay logo image (Optional)”,
“de”: “Überlagerung des Logobilds (optional)”,
“es”: “Imagen del logo superpuesto (opcional)”,
“fr”: “Superposition du logo (facultatif)”,
“pt-PT”: “Sobrepor imagem do logótipo (Opcional)”
},
“info”: {
“en”: “250 x 133px recommended”,
“de”: “250 x 133 px empfohlen”,
“es”: “Recomendado 250 x 133 px”,
“fr”: “250 x 133 px recommandé”,
“pt-PT”: “250 x 133px, recomendado”
}
},
{
“type”: “range”,
“id”: “logo_max_width”,
“min”: 50,
“max”: 350,
“step”: 10,
“unit”: {
“en”: “px”,
“de”: “px”,
“es”: “px”,
“fr”: “px”,
“pt-PT”: “px”
},
“label”: {
“en”: “Preferred width”,
“de”: “Bevorzugte Breite”,
“es”: “Ancho preferido”,
“fr”: “Largeur préférée”,
“pt-PT”: “Largura preferida”
},
“default”: 160
},
{
“type”: “select”,
“id”: “logo-placement”,
“label”: {
“en”: “Logo placement”,
“de”: “Logoplatzierung”,
“es”: “Ubicación del logotipo”,
“fr”: “Placement du logo”,
“pt-PT”: “Colocação do logótipo”
},
“options”: [
{
“value”: “below-header”,
“label”: {
“en”: “Below header”,
“de”: “Unter Kopfzeile”,
“es”: “Debajo del encabezado”,
“fr”: “Au-dessous de l’en-tête”,
“pt-PT”: “Cabeçalho inferior”
}
},
{
“value”: “within-header”,
“label”: {
“en”: “Within header”,
“de”: “In Kopfzeile”,
“es”: “Dentro del encabezado”,
“fr”: “Dans l’en-tête”,
“pt-PT”: “Cabeçalho interior”
}
}
],
“default”: “within-header”
},
{
“type”: “checkbox”,
“id”: “sticky_header_logo”,
“label”: {
“en”: “Show logo on sticky header”,
“de”: “Logo auf fixiertem Header zeigen”,
“es”: “Mostrar logotipo en el encabezado fijo”,
“fr”: “Afficher le logo sur l’en-tête incorporé”,
“pt-PT”: “Mostrar logótipo no cabeçalho fixo”
},
“default”: true
},
{
“type”: “header”,
“content”: {
“en”: “Icons”,
“de”: “Symbole”,
“es”: “Iconos”,
“fr”: “Icônes”,
“pt-PT”: “Ícones”
}
},
{
“type”: “checkbox”,
“id”: “search-enable”,
“label”: {
“en”: “Show search”,
“de”: “Suche aktivieren”,
“es”: “Habilitar búsqueda”,
“fr”: “Activer la recherche”,
“pt-PT”: “Ativar pesquisa”
},
“default”: true
},
{
“type”: “checkbox”,
“id”: “label-enable”,
“label”: {
“en”: “Show icon labels”,
“de”: “Symbolbezeichnungen anzeigen”,
“es”: “Mostrar las etiquetas de iconos”,
“fr”: “Afficher les étiquettes des icônes”,
“pt-PT”: “Mostrar etiquetas dos ícones”
},
“default”: false,
“info”: {
“en”: “Show text labels next to the icons”,
“de”: “Textbezeichnungen neben den Symbolen anzeigen”,
“es”: “Mostrar las etiquetas de texto al lado de los iconos”,
“fr”: “Afficher les étiquettes de texte à côté des icônes”,
“pt-PT”: “Mostrar etiquetas de texto junto aos ícones”
}
},
{
“type”: “select”,
“id”: “icon-size”,
“label”: {
“en”: “Icon size”,
“de”: “Symbolgröße”,
“es”: “Tamaño del icono”,
“fr”: “Taille de l’icône”,
“pt-PT”: “Tamanho do ícone”
},
“options”: [
{
“value”: “16”,
“label”: {
“en”: “Small”,
“de”: “Klein”,
“es”: “Pequeño”,
“fr”: “Petite”,
“pt-PT”: “Pequeno”
}
},
{
“value”: “18”,
“label”: {
“en”: “Medium”,
“de”: “Mittel”,
“es”: “Mediano”,
“fr”: “Moyenne”,
“pt-PT”: “Médio”
}
},
{
“value”: “20”,
“label”: {
“en”: “Large”,
“de”: “Groß”,
“es”: “Grande”,
“fr”: “Grande”,
“pt-PT”: “Grande”
}
}
],
“default”: “18”
},
{
“type”: “radio”,
“id”: “cart-style”,
“label”: {
“en”: “Cart icon”,
“de”: “Einkaufswagen-Symbol”,
“es”: “Icono del carrito”,
“fr”: “Icône du panier”,
“pt-PT”: “Ícone do carrinho”
},
“options”: [
{
“value”: “shopping-bag”,
“label”: {
“en”: “Shopping Bag”,
“de”: “Einkaufstasche”,
“es”: “Bolsa de la compra”,
“fr”: “Sac d’achat”,
“pt-PT”: “Saco de Compras”
}
},
{
“value”: “shopping-cart”,
“label”: {
“en”: “Shopping Cart”,
“de”: “Einkaufswagen”,
“es”: “Carrito de la compra”,
“fr”: “Panier d’achat”,
“pt-PT”: “Carrinho de Compras”
}
}
],
“default”: “shopping-cart”
},
{
“type”: “radio”,
“id”: “cart-number”,
“label”: {
“en”: “Cart number”,
“de”: “Einkaufswagen-Nummer”,
“es”: “Número en el carrito”,
“fr”: “Numéro de panier”,
“pt-PT”: “Número do carrinho”
},
“options”: [
{
“value”: “quantity”,
“label”: {
“en”: “Quantity”,
“de”: “Anzahl”,
“es”: “Cantidad”,
“fr”: “Quantité”,
“pt-PT”: “Quantidade”
}
},
{
“value”: “total”,
“label”: {
“en”: “Cart total”,
“de”: “Einkaufswagen-Summe”,
“es”: “Total de la cesta”,
“fr”: “Total du panier”,
“pt-PT”: “Total do carrinho”
}
},
{
“value”: “none”,
“label”: {
“en”: “None”,
“de”: “Keiner”,
“es”: “Ninguno”,
“fr”: “Aucun”,
“pt-PT”: “Nenhum”
}
}
],
“default”: “quantity”
},
{
“type”: “header”,
“content”: {
“en”: “Country/region selector”,
“de”: “Auswahl für Land/Region”,
“es”: “Selector de país/región”,
“fr”: “Sélecteur de pays/région”,
“pt-PT”: “Seletor de país/região”
},
“info”: {
“en”: “To add a country/region, go to your market settings.”,
“de”: “Gehe zu den Markteinstellungen, um ein Land / eine Region hinzuzufügen.”,
“es”: “Para agregar un país/región, ve a tu configuración de mercado.”,
“fr”: “Pour ajouter un pays/une région, allez à vos paramètres du marché.”,
“pt-PT”: “Para adicionar um país/região, vá a configurações de mercado.”
}
},
{
“type”: “checkbox”,
“id”: “enable_country_selector”,
“label”: {
“en”: “Enable country/region selector”,
“de”: “Auswahl für Land/Region aktivieren”,
“es”: “Activar selector de país/región”,
“fr”: “Activer le sélecteur de pays/région”,
“pt-PT”: “Ativar seletor de país/região”
},
“default”: true
},
{
“type”: “header”,
“content”: {
“en”: “Language Selector”,
“de”: “Sprachauswahl”,
“es”: “Selector de idioma”,
“fr”: “Sélecteur de langue”,
“pt-PT”: “Seletor de Idioma”
},
“info”: {
“en”: “To add a language, go to your language settings.”,
“de”: “Gehen Sie zu Ihren Spracheinstellungen, um eine Sprache hinzuzufügen.”,
“es”: “Para agregar un idioma, ve a tuconfiguración de idioma”,
“fr”: “Pour ajouter une langue, allez dans vos paramètres de langue..”,
“pt-PT”: “Para adicionar um idioma, aceda a definições de idioma.”
}
},
{
“type”: “checkbox”,
“id”: “enable_locale_selector”,
“label”: {
“en”: “Enable language selector”,
“de”: “Sprachauswahl aktivieren”,
“es”: “Activar selector de idioma”,
“fr”: “Activer le sélecteur de langue”,
“pt-PT”: “Ativar seletor de idioma”
},
“default”: true
},
{
“type”: “header”,
“content”: {
“en”: “Navigation”,
“de”: “Navigatie”,
“es”: “Navegación”,
“fr”: “La navigation”,
“pt-PT”: “Navegação”
}
},
{
“type”: “link_list”,
“id”: “main_linklist”,
“label”: {
“en”: “Main menu”,
“de”: “Hauptmenü”,
“es”: “Menú principal”,
“fr”: “Menu principal”,
“pt-PT”: “Menu principal”
},
“default”: “main-menu”
},
{
“type”: “link_list”,
“id”: “top_bar_linklist”,
“label”: {
“en”: “Top Bar”,
“de”: “Obere Leiste”,
“es”: “Barra superior”,
“fr”: “Barre supérieure”,
“pt-PT”: “Barra Superior”
},
“info”: {
“en”: “Does not support Mega Menu”,
“de”: “Mega-Menü wird nicht unterstützt”,
“es”: “No es compatible con Mega Menu”,
“fr”: “Ne prend pas en charge Mega Menu”,
“pt-PT”: “Não suporta o Mega Menu”
}
}
],
“blocks”: [
{
“type”: “content”,
“name”: {
“en”: “Mega Menu”,
“de”: “Mega-Menü”,
“es”: “Mega menú”,
“fr”: “Méga menu”,
“pt-PT”: “Mega Menu”
},
“settings”: [
{
“id”: “mega-menu”,
“type”: “text”,
“label”: {
“en”: “Mega menu”,
“de”: “Mega-Menü”,
“es”: “Mega menú”,
“fr”: “Méga menu”,
“pt-PT”: “Mega menu”
},
“info”: {
“en”: “Enter an existing menu item to apply a mega menu dropdown. Learn more”,
“de”: “Geben Sie einen vorhandenen Menüartikel ein, um ein Mega-Menü-Drop-down anzuwenden. Mehr erfahren”,
“es”: “Introduzca un artículo existente en el menú para aplicar un menú desplegable gigante. Aprenda más”,
“fr”: “Entrez un élément de menu existant pour appliquer un méga menu déroulant.En savoir plus”,
“pt-PT”: “Insira um item de menu existente para aplicar a um mega menu pendente. Saber mais”
}
},
{
“type”: “header”,
“content”: {
“en”: “Image 1”,
“de”: “Bild 1”,
“es”: “Imagen 1”,
“fr”: “Image 1”,
“pt-PT”: “Imagem 1”
}
},
{
“type”: “image_picker”,
“id”: “mega_image_1”,
“label”: {
“en”: “Image”,
“de”: “Bild”,
“es”: “Imagen”,
“fr”: “Image”,
“pt-PT”: “Imagem”
},
“info”: {
“en”: “350 x 250px recommended”,
“de”: “350 x 250 px empfohlen”,
“es”: “Recomendado 350 x 250 px”,
“fr”: “350 x 250 px recommandé”,
“pt-PT”: “350 x 250px, recomendado”
}
},
{
“type”: “text”,
“id”: “mega_image_header_1”,
“label”: {
“en”: “Header”,
“de”: “Überschrift”,
“es”: “Encabezado”,
“fr”: “En-tête”,
“pt-PT”: “Cabeçalho”
}
},
{
“type”: “text”,
“id”: “mega_image_subheader_1”,
“label”: {
“en”: “Subheading”,
“de”: “Unterüberschrift”,
“es”: “Subencabezado”,
“fr”: “Sous-rubrique”,
“pt-PT”: “Subtítulo”
}
},
{
“type”: “url”,
“id”: “mega_image_link_1”,
“label”: {
“en”: “Link”,
“de”: “Link”,
“es”: “Enlace”,
“fr”: “Lien”,
“pt-PT”: “Ligação”
}
},
{
“type”: “header”,
“content”: {
“en”: “Image 2”,
“de”: “Bild 2”,
“es”: “Imagen 2”,
“fr”: “Image 2”,
“pt-PT”: “Imagem 2”
}
},
{
“type”: “image_picker”,
“id”: “mega_image_2”,
“label”: {
“en”: “Image”,
“de”: “Bild”,
“es”: “Imagen”,
“fr”: “Image”,
“pt-PT”: “Imagem”
},
“info”: {
“en”: “350 x 250px recommended”,
“de”: “350 x 250 px empfohlen”,
“es”: “Recomendado 350 x 250 px”,
“fr”: “350 x 250 px recommandé”,
“pt-PT”: “350 x 250px, recomendado”
}
},
{
“type”: “text”,
“id”: “mega_image_header_2”,
“label”: {
“en”: “Header”,
“de”: “Überschrift”,
“es”: “Encabezado”,
“fr”: “En-tête”,
“pt-PT”: “Cabeçalho”
}
},
{
“type”: “text”,
“id”: “mega_image_subheader_2”,
“label”: {
“en”: “Subheader”,
“de”: “Unterüberschrift”,
“es”: “Subencabezado”,
“fr”: “Sous-en-tête”,
“pt-PT”: “Subcabeçalho”
}
},
{
“type”: “url”,
“id”: “mega_image_link_2”,
“label”: {
“en”: “Link”,
“de”: “Link”,
“es”: “Enlace”,
“fr”: “Lien”,
“pt-PT”: “Ligação”
}
}
]
}
]
}
{% endschema %}

[Teddy9]

Hi,

Thank you for you assistance with this issue. I attached the header.liquid file as attachment. My other post with the code did not place all the characters in the same fashion as the original. If I post it like this it is identical.

Thanks!

[LitCommerce]

Hi @Teddy9 ,

Go to Assets > theme-index.min.css and paste this at the bottom of the file:

.header-wrapper.js.unstuck .header-logo-wrapper,
.header-wrapper.js.unstuck .header-menu-wrapper {
	display: none !important;
} 
.header-wrapper.js.unstuck .sticky-header-wrapper {
	display: flex !important;
    position: relative !important;
    transform: translateY(0) !important;
}

Hope it helps!

[Teddy9]

FANTASTIC! See the result below!

[Teddy9]

One question, what could be the reason that the css adjustment works for the home page header but when on the product page the headers acts like before? It should not make a difference where you are on the site right? Strange.

[LitCommerce]

Hi @Teddy9 ,

I don’t understand, I checked at product page and it works fine.

Can you explain more about it?

[Teddy9]

Hi,

I found it and will explain it correct in this one slide.

[LitCommerce]

Hi @Teddy9 ,

Go to Assets > theme-index.min.css and paste this at the bottom of the file:

.sticky-header-menu #main-navigation-wrapper .open>.dropdown-menu{
    visibility: visible;
    opacity: 1;
}

Hope it helps!

[Teddy9]

That worked! Thank you so much!

[Teddy9]

Hi,

Sorry to bother you again, but I noticed that when the menu flips open (dropdown) the logo is half cut off. How can I adjust this? Thank you for your help.

[LitCommerce]

Hi @Teddy9 ,

You can create a question on the community and send me the link. I will check it.
Because this will help build a better community.
Thank you.