Menu above built with this plugin including Mega Menu.

Menu Customisation – Please Help!

This topic contains 3 replies, has 2 voices, and was last updated by  Peter Featherstone 2 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #55792 Reply

    Jordan Kinsella
    Participant

    Hello,

    I purchased the menu today and I have to say I am loving it. I haven’t been able to find a responsive menu like this anywhere else. I have some CSS issues however and I am not great when it comes to CSS so was hoping that someone could help me.

    – Is there a way I can link the menu items to the custom css. I don’t know the attribute to do this. This is because I would like to captilise the menu items and also change the font weight of them. How can I do this.

    – Is there a way in which I can play with the padding of the menu. I want to move it down the slider further as it is way to high up and I would also like to move it to the right as well.

    – Is there a way in which I can edit the text inside the search menu. I want to make this larger font and also change the font weight again. I am unsure on how to link this.

    – Is there a way in which I can also make the additional content smaller on mobile, social icons in my case as they are appearing to big on the mobile platform. The code can be found below

    <link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css”>
    <div class=”wrapper”>
    <i class=”fa fa-3x fa-linkedin”></i>
    <i class=”fa fa-3x fa-instagram”></i>
    <i class=”fa fa-3x fa-facebook”></i>
    <i class=”fa fa-3x fa-twitter”></i>
    <i class=”fa fa-3x fa-youtube-play”></i>
    </div>

    My website can also be found here – https://dev.gravitai.com/

    Loving the plugin, its amazing, hopefully someone can help.

    All the best

    Jordan

    #55805 Reply

    Hi Jordan,

    Glad you are enjoying the plugin, let’s see if we can answer all your questions!

    1. The below CSS should do that for you:

    .responsive-menu-pro-item-link {
       font-weight: bold !important;
       text-transform: uppercase !important;
    }

    2. Same as with the below:

    #responsive-menu-pro-container {
       padding-top: 25px !important;
    }

    3. Most of what you want can be done in the Container > Search section as per the docs: https://responsive.menu/docs/basic-setup/container/#search. However for the font size and weight, you would need:

    .responsive-menu-pro-search-box {
       font-weight: bold !important;
       font-size: 18px !important;
    }

    4. That’s a bit more difficult. You will need to create some media queries for that depending on the breakpoint that you want to change the sizing. You won’t be able to target devices however, only screen sizes.

    I hope that helps!

    Peter

    #55850 Reply

    Jordan Kinsella
    Participant

    Thanks Peter, this was great really helped me out, great support!

    Jordan

    #55867 Reply

    Hey Jordan,

    No problem, glad it helped!

    Peter

Viewing 4 posts - 1 through 4 (of 4 total)
Reply To: Menu Customisation – Please Help!
Your information:





<a href="" title="" rel="" target=""> <blockquote cite=""> <code> <pre> <em> <strong> <del datetime=""> <ul> <ol start=""> <li> <img src="" border="" alt="" height="" width="">

Responsive Menu Title Image
Responsive Menu
No coding knowledge needed