Fading header - Pipeline theme

Solved

Fading header - Pipeline theme

manekakknowle
Excursionist
37 0 5

So I was given these steps to fix a fading header issue...

@manekakknowle Please follow below steps to fix the header fading issue. Let me know whether it is helpful for you.

1. From admin, go to "Online Store" -> "Themes".
2. Click action button from the current theme and select "Edit code".
3. Go to "theme.css" file and paste the below code at the bottom of the file and save changes.

 

.js__header__stuck.js__header__stuck__backdrop .theme__header:after {
  opacity: 1 !important;
}
Result will be like,
manekakknowle_0-1717703256566.png

 

So this has worked when you scroll down however when I am at the top of the homepage it looks like this:

Screenshot 2024-06-06 at 18.52.46.png

 

I need the sticky banner at the top as well.  Can you please assist here. This the website link : https://04a275-e5.myshopify.com/?key=2302b92a75ab7d98ed9b65659ef1105ae8625eb9c25c91a9eb1b6dbe0d8e2b5...

Accepted Solution (1)
Made4uo-Ribe
Shopify Partner
10036 2385 3012

This is an accepted solution.

Can you add the code in the Custom Css on the Customize theme. 

When you click the header. 

Made4uoRibe_0-1717709186976.png

The right tab will visible, scroll down and youll find this. 

Made4uoRibe_1-1717709229798.png

Paste the code, save and refresh the browser afrer saving. 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.

View solution in original post

Replies 4 (4)

Made4uo-Ribe
Shopify Partner
10036 2385 3012

Hi @manekakknowle 

You mean you dont like the transparent header right? 

If it is check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

 

.header__inner {
    background: #8f993d;
}
.section-slideshow.palette--light.bg--neutral {
    position: sticky;
    top: 0;
}

 

And Save. 

result:

Made4uoRibe_0-1717705270881.png

 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
manekakknowle
Excursionist
37 0 5

Hi thank you for your reply. As you can see there was no change: 

Screenshot 2024-06-06 at 23.33.20.png

 

this is what I put in the code section  

Screenshot 2024-06-06 at 23.33.32.png

 

And the banner has even become even more faded as you scroll down: 

Screenshot 2024-06-06 at 23.35.16.png

  

manekakknowle
Excursionist
37 0 5

this is what is in the code section:

Screenshot 2024-06-06 at 23.33.32.png

Made4uo-Ribe
Shopify Partner
10036 2385 3012

This is an accepted solution.

Can you add the code in the Custom Css on the Customize theme. 

When you click the header. 

Made4uoRibe_0-1717709186976.png

The right tab will visible, scroll down and youll find this. 

Made4uoRibe_1-1717709229798.png

Paste the code, save and refresh the browser afrer saving. 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.