Spark Theme: White on White Header Outside of Homepage Issue

KwameAdusei
Visitor
3 0 0

Running the Spark theme on Shopify:

I setup the header to be completely transparent on the home page but that effect doesn't carry across any other pages.

 

Tried inserting: 

@media only screen and (min-width: 750px) {
.template-index .site-header {
position: absolute;
    width: 100%;
background-color: transparent;
}
.template-index .site-header__mobile-nav {
background-color: transparent;
}
}

into the end of the Theme.css and Theme.liquid codes but nothing's being affected across any page.

 

Anyone have a quick solution? For having created quite a lot of websites, this seems like a very simple issue to remedy yet I've had no luck so far.

 

https://kwameadusei.myshopify.com/

 

Thank you

Replies 5 (5)

Blend-Cole
Shopify Partner
6 2 2

Hi there.

 

.template-index in your css will target the homepage only.  Try replacing it with body.

 

I do hope this helps you with this particular issue.

If you found this answer helped with your question,  kindly mark it as a solution.

Kind regards.
Cole.

Blend Commerce.

BlendCole_1-1633547523326.png

 

 

diego_ezfy
Shopify Partner
2967 571 898

@KwameAdusei, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

header[data-section-id="header"].is-sticky *{
    color: #000 !important;
}

header[data-section-id="header"].is-sticky .header__cart-count{
    border: 1px solid #000 !important;
}



You can change the #000 to any color you wish.

Kind regards,
Diego

KwameAdusei
Visitor
3 0 0

Thank you

KwameAdusei
Visitor
3 0 0

Appreciate the help

Katman
Shopify Partner
32 1 6

I tried using both suggested code snippets from KwameAdusei and Diego_ezfy and neither work for me. I too am looking for a way to keep the Spark theme's header background transparent whilst scrolling and if possible to carry over to other pages on the site.


DM'd you too  @KwameAdusei 👍