Home / Forums / You Theme Support / How To Style A Single Menu Item To Standout?

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts

  • jodaboss86
    Participant

    Hi,

    First of all, really great work on this theme!

    I was wondering how I could make one menu item stand out from the other ones (e.g. color, font, background)? The idea would be to have ‘Contact Us’ stand out from the other items, as a highlighted Call-to-Action.

    Thanks a lot for your help!

    Best,
    Julian

    Hi @jodaboss86

    Can you elaborate further on what you want by “to have ‘Contact Us’ stand out from the other items, as a highlighted Call-to-Action.”? Can you send us a mock up on how you want your site to look for us to check?

    Regards,


    jodaboss86
    Participant

    Hi,

    The idea would be to be able to change any menu item, similar to the following example:

    Contact Us Highlighted

    Best,

    Julian

    Hi @jodaboss86

    We can’t seem to view the screenshot you sent. Can you upload the screenshot via http://www.tinypic.com and send us the URL?

    Regards,


    jodaboss86
    Participant

    Hi @jodaboss86

    The best option is to add a class to the menu item so we can add a specific style for it.

    Please send over your site’s login credentials so we can implement it for you?

    Thanks!


    jodaboss86
    Participant
    This reply has been marked as private.

    Hi @jodaboss86

    You can post your login credentials here, just make sure you set your reply to ‘private’.

    Regards,


    jodaboss86
    Participant
    This reply has been marked as private.

    Hi Julian,

    Our sincerest apologies for the delayed reply.

    Can you please doublecheck the login credentials you sent? We tried it multiple times and the credentials do not work.

    Thanks!


    jodaboss86
    Participant
    This reply has been marked as private.

    Hi @jodaboss86

    I have now made the necessary changes. The CSS are inside Appearance > Theme Options > Customize and you can change the background and font color to whatever you want.

    Thanks!


    jodaboss86
    Participant
    This reply has been marked as private.

    Mike
    Participant

    Can you share the CSS code used for this? I am interested in the same concept. I am assuming you just need to assign the CSS class inside the menu option, and input the specialized CSS.

    Hi @jodaboss86

    First, you will need to go to Appearance > Menus then add a CSS class to the menu you want to style.

    Once done, then you just need to change ‘contact-us-menu-item’ to the class you specified for that menu item.

    @talanithus

    The CSS is:

    #acoda-tabs ul li.contact-us-menu-item a {
    background-color: #04A8C9;
    color: #ffffff;
    }

    But as mentioned above, you will need to specify a class for the menu item first before implementing.

    Thanks!

Viewing 15 posts - 1 through 15 (of 17 total)

You must be logged in to reply to this topic.