Change menu on different sites

[ReviveShop]

Hello guys. I have this code which change my video banner, so its going under my top menu:

<style>
sticky-header.header-wrapper.color-background-2.gradient {
position: absolute !important;
width: 100% !important;
background: transparent !important;
}
.video-text a {
background: transparent !important;
border: solid 2px white;
}
</style>

This is making my menu bugging on all other sites. I need this code only to work for my home page!

Can anyone help me out?

https://luviera.store/

Password: bautso

I also need a my logo in black on every other page besides the home page. Is this possible?

[BSS-TekLabs · Accepted solution]

{% if template == 'index' %}
<style>
sticky-header.header-wrapper.color-background-2.gradient {
position: absolute !important;
width: 100% !important;
background: transparent !important;
}
.video-text a {
background: transparent !important;
border: solid 2px white;
}
</style>
{% endif %}

Can you try this code @ReviveShop 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[ReviveShop]

This worked perfectly! Thank you very much.

Do you also know how to change the logo on other pages?

[BSS-TekLabs]

Glad to help you. Which page do you want to change?.

[ReviveShop]

The Logo is in white right now, for the home page its perfectly. But on every other page the logo has to be black, like the menu.

[BSS-TekLabs]

You can create a black version of the logo and upload it, then send me the black version logo url. I will try to code it for you.

[ReviveShop]

I just changed it!

https://luviera.store/cdn/shop/files/LUVIERA_4.png?v=1726073214&width=150

Thank you!

[BSS-TekLabs]

Please Go back to the white logo version, and I just need the path of the black logo version to do the code.

[ReviveShop]

Changed it back.

[BSS-TekLabs]

- Here is the solution for you @ReviveShop 
- Please follow these steps: 

- Then find the theme.liquid file.
- Then add the following code at the before tag </head> and press 'Save' to save it.

 

{% unless template == 'index' %}
  <script>
window.addEventListener('load', function() {
    let logo = document.querySelector("img.header__heading-logo.motion-reduce");
logo.srcset = "https://luviera.store/cdn/shop/files/LUVIERA_4.png?v=1726073214&width=150"
})
  </script>
{% endunless %}

[BSS-TekLabs]

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[ReviveShop]

Worked perfectly! Thank you so much, you the goat!

[BSS-TekLabs]

Glad to help you. Have a good day.

- Please mark it as 'Solution' if you find it helpful @ReviveShop . Thank you.