Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 11, 2015 at 10:23 am #409732
    LorbeerDesign

    Hello,

    I would like each main menu to assign a different background color ( see screenshot).
    Is there a way to do this using Quick CSS?

    screenshot

    Thanks for the help and best regards.

    March 11, 2015 at 11:17 am #409753
    begrafiks

    Hi LorbeerDesign ;
    I think you should follow these steps:
    #1 : Dashbord > Menu,
    #2 : Activate WP page options,
    #3 : Check “Classes CSS”,
    #4 : Create “Your-Menu”,
    #5 : Insert your elements (pages, etc.) into “Your-Menu”,
    #6 : Use “Css classes” in order to operate onto each of the “Your-Menu” elements,
    #7 : Add your custom css styles into your css file.

    Here is an image : Menu css

    • This reply was modified 9 years, 9 months ago by begrafiks.
    March 11, 2015 at 12:50 pm #409780
    Yigit

    Hi!

    Please refer to @begrafiks’ post above and if that does not help, please let us know :)

    @begrafiks     Merci :)

    Cheers!
    Yigit

    March 11, 2015 at 1:03 pm #409794
    LorbeerDesign

    Hello,

    @ Begrafiks: thank you for your great answer.
    @ Yigit: Is there an easy way ?

    Many thanks!

    March 11, 2015 at 1:07 pm #409799
    Yigit

    Hi!

    You can add following code to Quick CSS in Enfold theme options under General Styling tab

    li#menu-item-755 > a > .avia-menu-text {
  background-color: orange;
  color: white;
  border-radius: 5px;
  padding: 5px;
}

    And apply to each menu item using menu item ID’s. You can right click on Chrome or Firefox to inspect elements to find menu item ID’s http://i.imgur.com/HyPTCRg.jpg

    Regards,
    Yigit

    March 17, 2015 at 10:43 am #412834
    LorbeerDesign

    Hello,

    Thanks for the help! Everything worked great :-)

    Now I have another question : How can I remove the line under the drop-down navigation for ? If I use “.avia-menu-fx { display: none; }
    ” , only the bar disappears when navigation points without a 2nd level of navigation.

    Link to page: http://wordpress.p255345.webspaceconfig.de/

    Thanks for the help and best regards.

    March 17, 2015 at 5:02 pm #413105
    Yigit

    Hi!

    Please add following code to Quick CSS 

    .html_header_top .header_color .main_menu ul:first-child >li > ul, .html_header_top #top .header_color .avia_mega_div > .sub-menu {
  border-top: none!important;
}

    And to fix submenu height issue, please refer to my post here – https://kriesi.at/support/topic/menu-items-issue-after-update-to-version-3-1/#post-412421

    Regards,
    Yigit

    March 19, 2015 at 10:12 am #414248
    LorbeerDesign

    Hello,

    Thank you so much! It worked wonderfully .

    Thanks for the effort!

    March 19, 2015 at 11:54 am #414299
    Yigit

    Hey!

    You are welcome, glad we could help :)
    For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
    And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

    Regards,
    Yigit

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Main Menu: different background color’ is closed to new replies.