Return to previous page

Header Color is change on scroll page and not sticky

This topic has 13 replies, 3 voices, and was last updated 6 days, 21 hours ago ago by Andrew Mitchell

Ankit Khandelwal

Participant

April 30, 2024 at 18:26

Header Color is change on scroll page and not sticky

Please, contact administrator
for this information.

#393532 Copied Theme version: 9.3.8

12 Answers
Luca Rossi

Support staff

May 1, 2024 at 06:14
Hi @Ankit Khandelwal,

Please try adding the following CSS codes under Theme Options > Theme Custom CSS > Global CSS:
```
.sticky-on .header-main,
.sticky-on .header-bottom{
    background-color: #fff;
}
.sticky-on .header-main h1,
.sticky-on .header-main-menu.et_element-top-level .menu > li > a {
    color: #000;
}
```
Best Regards,
8Theme’s Team
#393562 Copied
Ankit Khandelwal

Participant

May 1, 2024 at 12:46

There are some portion left to implement change. Please see screenshot

Please contact administrator
for this information.

#393619 Copied

Luca Rossi

Support staff

May 1, 2024 at 14:13

Hi @Ankit Khandelwal,

We don’t understand what you mean in that screenshot. Could you please explain?

2. Please reduce the gap between header & primary menu

Please remove the top & bottom padding of the main header.

Best Regards,
8Theme’s Team

#393621 Copied

Ankit Khandelwal

Participant

May 1, 2024 at 14:44

Please see my reply

Please contact administrator
for this information.

#393627 Copied
Luca Rossi

Support staff

May 1, 2024 at 15:56
Hi @Ankit Khandelwal,

#1, The header is black in the begining and turn to white when you scroll down. Do you want the header is white from the begining also?

#2,
– Please add the following CSS:
```
.header-main h1 {
margin-bottom: 0;
}
```
– After that remove the top & bottom padding of your header main under XStore > Theme Options > Header Builder > Main Header > https://prnt.sc/WEGoAlgRlr4I

Hope it helps!
#393633 Copied
Ankit Khandelwal

Participant

May 1, 2024 at 16:10

#1, The header is black in the beginning and turn to white when you scroll down. Do you want the header is white from the beginning also? –

— I want only white header in every condition before or after scroll , Kindly fixed white header in all pages

#393635 Copied
Luca Rossi

Support staff

May 2, 2024 at 06:07
Hi @Ankit Khandelwal,

I want only white header in every condition before or after scroll , Kindly fixed white header in all pages

In this case, please use this custom CSS codes instead, this codes will make the header white for all pages except the home page:
```
body:not(.home) .header-main,
body:not(.home) .header-bottom {
    background-color: #fff;
}
body:not(.home) .header-main h1 {
    color: #000;
    margin-bottom: 0;
    text-align: center;
}
body:not(.home) .header-main-menu.et_element-top-level .menu > li > a {
    color: #000;
}
```
Best Regards,
8Theme’s Team
#393664 Copied
Ankit Khandelwal

Participant

May 2, 2024 at 11:36

Footer also in White Background and black text and top border to be black

#393708 Copied

Luca Rossi

Support staff

May 2, 2024 at 12:27

Hi @Ankit Khandelwal,

Please navigate to the link we sent in the Private Content area after that change the background color, text color of your footer elements.

Best Regards,
8Theme’s Team

Please contact administrator
for this information.

#393712 Copied

Ankit Khandelwal

Participant

May 2, 2024 at 16:23

Applying few setting are disturbed. You are kindly requested to all the matter by changing setting

Please contact administrator
for this information.

#393766 Copied

Luca Rossi

Support staff

May 3, 2024 at 03:46

Hi @Ankit Khandelwal,

For #1, we’ve already replied to you in this topic: https://www.8theme.com/topic/single-product-images-and-thumbnail-went-into-footer/#post-393793.

For #2, which browser are you using? We’ve checked on both Safari & Chrome the header looks good.

And for the footer, please change the color of footer under XStore > Theme Options > Footer > Footer Styling:

https://prnt.sc/5cstKFBgVRid

Best Regards,
8Theme’s Team

#393794 Copied

Andrew Mitchell

Support staff

May 14, 2024 at 17:54

Dear Ankit Khandelwal,

In the spirit of gratitude, we want to express our appreciation for your trust in our products. As a valued customer, your experience matters greatly. Would you consider sharing it by giving our theme a deserving 5-star rating on ThemeForest?

Click here to share your thoughts: https://themeforest.net/downloads

Being part of our community means a lot, and your feedback contributes immensely.

Best Regards,
The 8Theme Team

#395142 Copied
Tagged: change header color, dynamic header color change, non-sticky header, scroll page customization, woocommerce website design, wordpress scroll effects, wordpress woocommerce templates
Viewing 13 results - 1 through 13 (of 13 total)

The issue related to '‘Header Color is change on scroll page and not sticky’' has been successfully resolved, and the topic is now closed for further responses

Header Color is change on scroll page and not sticky

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection