How to customize the main menu?

13 posts from 4 voices

• Started 6 months ago by elodie14
• Latest reply from Devin
• This topic is not a support question

Tags:

No tags yet.

1. 

   elodie14
   Member

   Hello,

   I bought the Velvet template and I am VERY happy with it. You did a wonderful job.
   My only concern is about the main menu. I am not good in css but I would love my title menu on the same line. I have changed "block" to "inline" but with no luck.

   Also, since the dropdown menu takes to much space the way it is, how can I get it only by clicking the main title?

   Thank you for your response.

   Elodie.

   Posted 6 months ago #
2. 

   Nick
   Moderator

   Hi,

   Can you elaborate please on "I would love my title menu on the same line". Do you mean you want the top right main menu on the same line as the logo?

   The menu for this theme (at the moment) in not a 'drop down'. However you can always change the menu with one of the dozens of free and premium plugins available. Uber Menu is pretty cool at $15 I believe on codecanyon.com , but you can look at this recent menu plugin review http://www.tripwiremagazine.com/2012/09/wordpress-menu-plugins.html.

   Thanks,

   Nick

   Posted 5 months ago #
3. 

   elodie14
   Member

   Thank you very much. I am about to buy the Uber Menu. Are you sure it's working with the Ken Burn effect?

   Thank you again.

   Elodie

   Posted 5 months ago #
4. 

   elodie14
   Member

   Actually, I have purchased abd installaled Uber menu but it it there is a huge space between my logo and the menu and the menu with the slideshow. How ca I reduce those 2 spaces?

   Thank you.

   URL: http://chambresdhotes-lesmolieres.com

   Posted 5 months ago #
5. 

   Nick
   Moderator

   Hi,

   Uber Menu can be as complex or simple as you want it, and believe me , for some menu specifications, it can take longer to customize it than the theme itself. However I think its worth it.

   1) You menu is missing a css file -> http://chambresdhotes-lesmolieres.com/wp-content/plugins/ubermenu/styles/custom.css?ver=2.2.0.0
   Are you sure you set it up correctly? There is a setup page for it where you can choose from defaults or customize it.

   2) Please add this to your custom.css file or quick css . The padding was 40px, I changed it to 20px below, You can lower/raise it to the number that you like.
   

   #header .container {
   padding: 20px 0;
   }

   Thanks,

   Nick

   Posted 5 months ago #
6. 

   elodie14
   Member

   Thank you for your quick response and your advise but this code only make my logo closer to the top. Nothing moved to erase the space between the logo and the menu and the menu with the slideshow.

   Is there a code for the slider to be closer to the menu and a code for the menu to be closer to the logo?

   I hope It is not to confusing.

   Thank you.

   Elodie

   Posted 5 months ago #
7. 

   Devin
   Moderator

   Hi Elodie,

   The ubermenu has a good chunk of padding on the sub menu so if you reduce the padding on the container with css you wont be able to see the uber menu sub menus. Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
   

   #top #header .container.main_menu {
       padding-bottom: 0px;
   }

   That will do it but you can see the issue with it. It may be better to just increase the space above the menu to make it match visually but that is up to you.

   Regards,

   Devin

   Posted 5 months ago #
8. 

   elodie14
   Member

   Thank you Devin,

   I manage to higher the menu to the top thanks to Ubermenu forum by adding;
   #header #megaMenu{
   clear:both;
   margin-top:10px;
   }

   With your code, I can't see anymore the submenu.

   I will wait for another response from Ubermenu forum to get my slider closer to the menu.

   Posted 5 months ago #
9. 

   Devin
   Moderator

   They should be able to help style the menu a bit more to your needs. It may also require adjusting its z-index since it seems to be hidden behind the slideshow once the margin is changed.

   Regards,

   Devin

   Posted 5 months ago #
10. 

    elodie14
    Member

    It's working. My dropdown menu is showing.
    I have to change overflow:hidden by visible.

    I used your code:
    #top #header .container.main_menu {
    padding-bottom: 0px;
    }

    but I will like my slideshow even closer to my menu. I try with -5px but nothing changed.

    Is it possible?

    Thank you.

    Elodie.

    Posted 5 months ago #
11. 

    Ismael
    Moderator

    Hi Elodie,

    Try to add this code:
    

    #main, .template-fullwidth.content {
       padding-top: 0;
    }

    or, this one:
    

    #main, .template-fullwidth.content {
       padding-top: 0 !important;
    }

    Regards,
    Ismael

    Posted 5 months ago #
12. 

    elodie14
    Member

    That's perfect.

    Thank you for your support.

    Elodie.

    Posted 5 months ago #
13. 

    Devin
    Moderator

    Glad Ismael could help :)

    Regards,

    Devin

    Posted 5 months ago #

RSS feed for this topic

Reply

You must log in to post.