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 on navigation and round icons – Vantage

Open 5 replies themetheme-vantage
Yifan Jiang
11 years ago · Last reply by Andrew Misplon 11 years ago

Hi Site Origin,

I really love your Vantage theme and am building a site with it.
However there are 2 tech difficulty that need your help with.

a) is it possible to put a logo on the navigation bar (and remove the header so the page begin with the navi)?

b) i’m putting those icon and texts by using your Page Builder plugin, is there a way to upload my own icons for these?

Or are these functions actually available in the Vantage Premium?

Thanks!
Yifan

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

Need fast email support? Get SiteOrigin Premium

Replies

5
  1. Andrew Misplon Staff 11 years, 6 months ago

    Hi Yifan

    Thanks for running Vantage.

    1. Yes, Appearance > Theme Settings > Layout > Masthead Layout: Logo in Menu. The logo size gets constrained in this type of layout, insert the following under Appearance > Custom CSS to reverse that:

    /* Vantage Remove Logo in Menu img constraint */
header#masthead.masthead-logo-in-menu .logo > img {
max-height: none !important;
}

    b. It depends on the widget. The Circle Icon widget lets you select None for the icon, you can then use the Background URL field to enter your own image from the media library. Our Features Widget also lets you upload your own icon:

    http://wordpress.org/plugins/so-widgets-bundle/

    Nothing discussed here is specific to Premium.

  2. Yifan Jiang 11 years, 6 months ago

    Hi Andrew,

    Thanks a lot for the tip and it works :)

    However my team is asking for another visual twist that I need your help with.

    Now that the logo is in the menu, is there a way to make it reach it out down into the main body a little?
    That is making the menu bar thinner than the logo.

    Thanks!

  3. Andrew Misplon Staff 11 years, 6 months ago

    For sure. To this you’ll need to:

    Remove the logo float and absolute position it:

    header#masthead.masthead-logo-in-menu .logo {
float: none !important;
position: absolute;
left: 0;
top: 30px;
}

    Then push the menu over:

    .main-navigation ul {
margin-left: 200px;
}

    Just neaten up my numbers to your requirements.

  4. Yifan Jiang 11 years, 6 months ago

    Hi Andrew,

    Thanks a lot for the codes, it works on every page except the homepage with a meta slider right under the menu.

    It seems the slider is overlaid on top of everything else and covers the part of that logo.

    (homepage is build with page builder)

    anything we can do to fix that?

    Thanks!

  5. Andrew Misplon Staff 11 years, 6 months ago

    Try setting a logo z-index:

    header#masthead.masthead-logo-in-menu .logo {
z-index: 9000;
}

    Just add the one line, the z-index to your existing header#masthead…. selector. Increase 9000 to a higher number if it’s still underneath the slider.

    Ref: http://www.w3schools.com/cssref/pr_pos_z-index.asp

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