This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Questions regarding Header

Open 3 replies premiumthemetheme-vantage
rmitche2
10 years ago · Last reply by Andrew Misplon 10 years ago

I’m using Vantage Premium. Under theme settingsmasthead layout, if I select “Logo in Menu” for the Masthead Layout option, I have control of the colors for text, hover, background, etc, as well as type size and a lot of other great controls. However, I can’t select a background image for the header, or locate the menu where I want it or the company logo, or the spacing between the menu listings. If I select “default Layout” for the Masthead Layout” option and use a menu widget in the header area under “Customize”, I get to add a background image (desired) and control padding for the logo and the menu fits better in the header (as opposed to wrapping into 2 lines) and I can add the Social icons. What I can’t do, is control the text colors, the secondary menu colors, etc.

Is there a better solution to create a menu in the theme?

URL: http://lagrandeboulevard.com

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Andrew Misplon Staff 10 years, 10 months ago

    Hi Rmitche2

    You’re right, there is no background option for the menu but we can use Custom CSS for this and the other controls you’re after. All the Custom CSS below should be copied to Appearance > Custom CSS. Edit as required.

    Hope that helps.

    Menu Background Image

    /* Menu background image */
.main-navigation {
  background: url('http://mysiteurl.com/image.jpg');
  background-repeat: repeat-x;
}

    Replace my url with yours. Once your background image has been added to the Media Library, click on it and locate the url in the right column metabox.

    Horizontal Menu Padding

    /* Menu Padding Horizontal */
.main-navigation ul li a {
padding-right: 25px !important;
padding-left: 25px !important;
}

    Icons in the menu

    There unfortunately isn’t a widget area in the menu. You can however use a plugin like:
    https://wordpress.org/plugins/menu-icons/ to add icons to menu link items.

    Menu Item Drop Down Background Colors

    /* Drop Down Menu Colors */
.main-navigation ul ul { background: #cccccc;  } 
.main-navigation ul ul li:hover > a { background: #000000;  }
  2. rmitche2 10 years, 10 months ago

    Hi Andrew,

    Thanks for all the below tips for controlling the Header background. I successfully used them, along with one I built on top of the menu text padding class for the sub-nave text vertical spacing:

    (.main-navigation ul ul li a {
    padding-right: 15px !important;
    padding-left: 15px !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    }

    Regarding the icons, I should have been more clear. There is a “Vantage Social Media” widget that I was using along with the “Custom Menu” widget that showed up when I didn’t have theme control of the header. I’d like to add those social icons back into the header area but that isn’t an option.

    Additionally, I’m being asked to add a weather icon to the header.

    Can you help with these?

    Thanks,

    _Rick

    Rick Mitchell

    404.759.6417
    The Partnership
    ______________________________________________________________________
    CONFIDENTIALITY NOTICE
    This message (including any attachments) contains proprietary information and may be confidential. If you are not the intended recipient (or authorized to receive for the intended recipient), you may not read, print, retain, use, copy, distribute or disclose to anyone the message or any information contained in the message. If you have received the message in error, please advise the sender by reply e-mail, and destroy all copies of the original message (including any attachments).

  3. Andrew Misplon Staff 10 years, 10 months ago

    Hi Rick

    Glad to hear you’re making progress. You’ve unfortunately hit a limitation of the theme setup and might need to consider continuing with custom development. The Logo in Menu layout traditionally doesn’t offer enough space to include the header widget area. As a result it’s not available in this layout. A weather icon would need to come from a Text widget using your own HTML/CSS or perhaps from a plugin that offers one. You could also look using the Menu Icons plugin to add icons to the menu:

    https://wordpress.org/plugins/menu-icons/

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread