Change colour Add cart bar header

Store Design
,
1

Daniil_P13_0-1718802575372.png
Daniil_P13_0-1718802575372.png1919×710 183 KB

How can I change colour background of add bar?

Link: https://alpadadoors.com/products/5x-lite-interior-steel-glass-door-1

Pass: yewyew

2

@Daniil_P13 - please add this css to the very end of your theme.css file and check

.product-sticky-bar.is-visible {background-color: #fff;}
3

Hey @Daniil_P13

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1718803021913.png
Moeed_0-1718803021913.png1877×943 195 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

4

Hi @Daniil_P13 ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

BSSCommerceHDL_0-1718803480726.png
BSSCommerceHDL_0-1718803480726.png1902×899 133 KB

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1718803488598.png
BSSCommerceHDL_1-1718803488598.png1916×934 101 KB

Step 3: Insert the below code at the bottom of the file → Save

product-sticky-bar.product-sticky-bar.is-visible {
    background-color: #ffff !important;
}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

5

Hello @Daniil_P13

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.product-sticky-bar.is-visible { background: #fff !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

6

Hi @Daniil_P13

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.css

Step 3: Paste the below code at bottom of the file → Save

product-sticky-bar.product-sticky-bar.is-visible {

background: wheat !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly