Support/Ultra Theme/Top Menu

[Resolved] Top Menu

  • Author
    Posts
  • February 25, 2017 at 9:13 am #5991

    tipsfromitaly
    Participant

    Hi Guys!

    I love the puro theme. It’s working really well.

    I just wanna tweek one little thing – my menu hight is too big and i’d like to make it 4 rem. can you help me do that? thanks so much!

    Veronica

    February 25, 2017 at 6:20 pm #5992

    Puro Support
    Keymaster

    Hi Veronica

    Thanks for reaching out. Please, try adding the following to Appearance > Customize > Additional CSS or your own Custom CSS plugin.

    /* Header */
.site-header {
    padding: 40.5px 0;
}

    Adjust the padding value as required. The single value manages top and bottom padding which in turns sets the header height.

    February 26, 2017 at 9:41 am #5994

    tipsfromitaly
    Participant

    Hi,

    I did, but this happened.

    screenshot

    Can you tell me how to:
    – have the two sides in white too?
    – move the whole menu to the right?
    – insert a logo or text on the left?
    – is my menu still going to be responsive on mobile devices?

    thank you,

    February 26, 2017 at 6:22 pm #5997

    Puro Support
    Keymaster

    Sorry about that, I thought this was for the Puro theme, I’ve moved this topic to the Ultra forum. Here is the easiest way to proceed, I think 🙂

    1. Remove the Custom CSS previously added.
    2. Disable the top bar at Appearance > Customize > Theme Settings > Top Bar, disable the checkbox.
    3. Enable the Header at Appearance > Customize > Theme Settings > Header, enable the checkbox.
    4. Add your logo at Appearance > Customize > Theme Settings > Logo.
    5. Go to Appearance > Customize > Menus > Menu Locations and save a menu to the Primary Menu location.
    6. Customize > Additional CSS, add the following:

    .site-header,
.site-header .container,
.site-header .site-branding-container,
.main-navigation .menu-search {
	height: 56px
}
.main-navigation div>ul>li>a,
.main-navigation .menu-search .search-icon:before {
	height: 56px;
	line-height: 56px
}
.main-navigation ul ul {
	top: 53px
}

    If you want to change the header height further, change all the 56px values. The last value must be 2px less than all the other values.

    56px is 4em considering a 14px base.

    Hope that helps.

    March 3, 2017 at 7:25 am #6009

    tipsfromitaly
    Participant

    Hi!

    I had to specify.

    Thanks so much for the help and the elaborate comprehensive explanation. Somehow I wasn’t notified for your response. Super glad you got back to me! It’s beautiful now! Just like I wanted it 🙂

    Thanks again!!

    Veronica

    March 3, 2017 at 11:36 am #6010

    Puro Support
    Keymaster

    Super 🙂 Glad to hear that did the trick. All the best with your site.

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

You must be logged in to reply to this topic.

Scroll to top