WordPress Website Templates

Find Professional WordPress themes Easy and Simple to Setup

inner banner

Changing the menu color

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #8991
    Bruno Waser
    Participant

    How can I change the color for the menu for mobile devices only?
    Please don’t tell me: “Send the login data for my website”
    If that’s not possible for me to change, then this theme goes to waste. Friendly greetings

    #9016
    Grace Themes
    Member

    Hi Bruno,

    To change the menu color in mobile devices

    Go to Appearance -> Editor -> style.css file
    add below css code and change the color code as per your need.

    @media screen and (max-width:767px) 
    {
    .header-nav ul li a, .header-nav ul li.current_page_item ul li a { color:#FF0000 !important; }
    .header-nav ul li a:hover, .header-nav ul li.current_page_item a, .header-nav ul li.current_page_item ul li a:hover, .header-nav ul li.current-menu-ancestor a.parent { color:#00FF00 !important; }
    }

    Please do this change and let me know your feedback.

    Regards
    Grace Themes

    #9026
    Bruno Waser
    Participant

    Thank you. Worked perfectly.

    Regards
    Bruno Waser

    #9027
    Grace Themes
    Member

    Hi Bruno,

    You are most welcome..!

    Regards
    Grace Themes

    #10943
    Holger Engel
    Participant

    Hi, I have the same issue that the Menu color on mobile devices is different from the PC version.
    With the tip above I could partially fix it:I could change the font colors to make it at leasdt legible.
    However, how can I change the Menue background color to make it look as on the PC version?

    A second issue: I added a page title & sub-title on my starting page. On mobile devices in horizontal view, the body text of the pages is now starting below the mainpage header and is partially not readable. How to fix?

    Thx in advance!

    Holger

    #10949
    Grace Themes
    Member

    Hi Holger,

    To change the background color of menubar in mobile devices
    Go to Appearance -> Theme Options -> Basic Settings -> Background Colors -> Select background color for toggle menu

    To change the menu background color in mobile version
    Go to Appearance -> Editor -> style.css file
    add below css code and change the color code as per your need.

    @media screen and (max-width:767px) 
    {
    .header-nav ul li { background-color:#000000 !important; }
    }

    Second issue: Please send your website URL and some screenshot where the problem is getting so we can check and assist you.

    Regards
    Grace Themes

    #10982
    Holger Engel
    Participant

    Thanks – this works!
    Will send you the screenshot of the second issue to oyur support E-Mail.
    Thx,
    Holger

    #10998
    Grace Themes
    Member

    Hi,

    1. To solve the issue, add below css code in
    Appearance -> Editor -> style.css file

    @media only screen
    and (min-device-width : 768px)
    and (max-device-width : 1024px)
    and (orientation : landscape) {
    .innerbanner { min-height:140px; }
    }

    Regards
    Grace Themes

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.