Viewing 30 posts - 1 through 30 (of 33 total)
1 2
  • Author
    Posts
  • February 23, 2019 at 12:47 pm #1070658
    oliverdubai

    Hello there;
    The background color of the header automatically for some unknown reason, has vanished.

    As you can see the header background is transparent making the text difficult to read with the images moving.

    Kindly help.

    Thank you.

    • This topic was modified 5 years, 10 months ago by oliverdubai.
    February 24, 2019 at 5:23 pm #1070977
    Vinay

    Hey Oliver,

    Thank you for contacting us.

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    CSS Snippet:

    
/* CSS - */

#top #header_main {
    background: #FFF !important;
}

    You may not see the changes until the cached files are cleared in your browser.

    Please perform the below steps to clear the browser cache:

    1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
    2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
    3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”.

    Best regards,
    Vinay

    February 27, 2019 at 8:05 am #1072177
    oliverdubai

    Hi Vinay;
    I have added the CSS but because it was not displaying correctly, I removed it.
    The header background did become solid white, but unfortunately, with that the header menu items font color also became white. This made the menu item text unreadable.
    I need the header background to be exactly the same as the one on our ‘contact us’ page.

    I did not understand the below steps:
    “You may not see the changes until the cached files are cleared in your browser.

    Please perform the below steps to clear the browser cache:

    1. Disable “merging and compression” for CSS and JS files from Enfold > Performance. – DID NOT FIND ‘PERFORMANCE’
    2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
    3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload”. – ON MAC WHAT ARE THE KEYS?

    February 27, 2019 at 8:15 am #1072179
    oliverdubai

    p.s: I haven’t removed the CSS because it is partially working. But I request you to please have a look at the home page and contact us page and assist me to make header menu in all pages exactly the same.
    Thank you.

    February 27, 2019 at 3:45 pm #1072298
    oliverdubai

    Hello again; I have done the “Empty Cache and Hard Reload”. The problem still persists. Kindly assist to sort it out. Thank you.

    March 1, 2019 at 11:57 am #1073081
    Rikard

    Hi,

    Please try this CSS instead:

    .home .container_wrap_meta {
    background: #fd9351 !important;
}

    Best regards,
    Rikard

    March 3, 2019 at 9:58 am #1073882
    oliverdubai

    URGENT
    Hello Rikard, thank you for the feedback.
    So now we have the secondary header background color back. But lost the white background for main header menu.

    Unfortunately now, the header menu on all webpages of my site go transparent upon scrolling :(

    Please help!

    March 3, 2019 at 10:34 am #1073893
    oliverdubai

    So I have made certain changes to the website backend that has solved part of my problem.
    Now the only issue is:

    How to avoid the background of header bar to become transparent on scrolling?
    I want it to be solid white.

    Awaiting your assistance at the earliest.

    Thank you.

    March 5, 2019 at 11:49 pm #1075168
    Basilis

    Hi,

    Please add the following CSS:

    #header_main { background: #fff; }

    Thank you

    Best regards,
    Basilis

    March 6, 2019 at 4:05 pm #1075529
    oliverdubai

    Hi Basilis, adding that css code did not solve the problem.

    The header menu background still goes transparent upon scrolling.

    Kindly help!

    March 8, 2019 at 12:13 pm #1076319
    oliverdubai

    Requesting assistance for the discussed problem.

    March 9, 2019 at 9:29 am #1076670
    Victoria

    Hi oliverdubai,

    Could you please attach some screenshots of the issue?

    Which browser are you using?

    Best regards,
    Victoria

    March 14, 2019 at 4:09 pm #1078737
    oliverdubai

    Hi Victoria; The issue is that the background of the header becomes transparent upon scrolling. This makes the menu items text unreadable.

    I want the header background to be white always.

    March 14, 2019 at 4:11 pm #1078738
    oliverdubai

    I am using Google chrome

    March 20, 2019 at 6:47 pm #1080951
    Victoria

    Hi oliverdubai,

    Thank you for clarifying. I thought the inverse transparency was on purpose.

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    March 24, 2019 at 12:46 pm #1082223
    oliverdubai

    Sharing the login details in the private content section:

    March 24, 2019 at 12:48 pm #1082224
    oliverdubai

    Requesting you to please notify me if you perform any actions on my website.
    Thank you.

    March 25, 2019 at 3:42 pm #1082711
    Victoria

    Hi oliverdubai,

    There was an error in your Quick css, the missing bracket and so the css did not work.

    Please check the header now.

    Best regards,
    Victoria

    March 26, 2019 at 8:49 am #1083012
    oliverdubai

    Thank you for solving the header background color issue Victoria :)

    Now; could you also tell me the steps to change the font color of the menu items in the header, please?

    Thank you.

    March 26, 2019 at 9:13 am #1083017
    oliverdubai

    Also; the LANGUAGE button on top right corner has a white background instead of the saffron color. Could you kindly help revert the color back to saffron from white.
    Thank you.

    March 28, 2019 at 2:55 pm #1084121
    oliverdubai

    Hi Victoria; returning back to the Header issue – there are certain pages in my website in which the header is not operating correctly. These are all the pages that are the dropdown sub-menu items.

    Examples are given in private content.

    Please help as these are the important pages for my business.

    Thank you.

    March 30, 2019 at 5:07 pm #1084898
    Mike

    Hi,
    Sorry for the late reply, I have tried to read over your past posts, and I believe that now you are looking to have to your menu items gray before you scroll, right now they are white on white so they won’t show.
    I also believe that the 4 pages you listed are the only ones with the issue. Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    #top.parent-pageid-5666 #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text,
#top.parent-pageid-5672 #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text,
#top.parent-pageid-5659 #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text {
color: #a9aab0 !important;
}

    Please try this and check that there are no conflicts with other pages.
    Please also clear your browser cache.

    Best regards,
    Mike

    March 31, 2019 at 4:00 pm #1085100
    oliverdubai

    Hi Mike; thank you for the CSS. This has solved the header font color issue in those particular 4 webpages.
    Although, if you can check my last message, those 4 links were just examples.
    The issue is with all the drop down menu webpages.
    Kindly share the CSS for the rest of the pages too.
    Thank you.

    p.s.: Would you want me to share the links of all the webpages that are having the issue?

    March 31, 2019 at 4:27 pm #1085105
    Mike

    Hi,
    Sorry I didn’t see that, please remove that css and try this instead:

    #header.header_color.av_header_transparency .av-main-nav > li > a .avia-menu-text {
color: #a9aab0 !important;
}

    Best regards,
    Mike

    April 13, 2019 at 9:44 am #1090326
    oliverdubai

    Thank you Mike! The CSS helped.

    But the orange (#fd9351) background of the Secondary Header bar (where the telephone number is displayed) isn’t showing for the dropdown menu items.
    The header works fine on Homepage and the main menu items. But the issue is with the dropdown menu items..

    Kindly help.

    Thank you.

    April 13, 2019 at 2:06 pm #1090353
    Mike

    Hi,
    I have taken a look at your css and have found that in your custom css you have this rule:

    #top #header_meta, #top #header_meta nav ul ul li, #top #header_meta nav ul ul a, #top #header_meta nav ul ul {
    background-color: #fd9351; 
}

    We need to add !important; to it like this:

    #top #header_meta, #top #header_meta nav ul ul li, #top #header_meta nav ul ul a, #top #header_meta nav ul ul {
    background-color: #fd9351 !important; 
}

    If you can’t find the css to adjust, then please just add the css above and clear your browser cache and check.

    Best regards,
    Mike

    April 13, 2019 at 3:37 pm #1090372
    oliverdubai

    Hi Mike;

    This worked perfectly fine. Thank you.

    For the next issue – The font color used to become #fd9351 upon mouse hover in the dropdown menu. But this isn’t happening since the issue of the header transparency began. Could you please help me out with this.

    Thank you.

    April 13, 2019 at 4:03 pm #1090373
    Mike

    Hi,
    Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    #top #header .av-main-nav > li ul li:hover > a .avia-menu-text, #top #header .av-main-nav > li ul li:hover > a .avia-menu-subtext {
    color: #fd9351 !important; 
}

    Best regards,
    Mike

    April 24, 2019 at 3:59 pm #1094042
    oliverdubai

    Hi Mike; I changed the mouse hover text color by changing the color in the styling itself. Thank you though for the CSS.

    The next issue is the LANGUAGE BUTTON has white background. Can we please make it similar to the rest of the header bar?
    Help please.

    Thank you!

    April 24, 2019 at 4:00 pm #1094045
    oliverdubai

    Missed to mention in the above query, that the language button background is white only for the main menu items webpages.

  • Author
    Posts
Viewing 30 posts - 1 through 30 (of 33 total)
1 2
  • The topic ‘Header background color not displayed’ is closed to new replies.