Docs

[Brock B]

I’m trying to figure out how to add a small version of my logo in the top left corner of the header on my site. Any suggestions on how to do this?

http://www.paradisevalleyproductions.com

[Christopher]

Hi there,

You can add logo under CUstomize -> Header.
You can also add logo to topbar using following code :

<img src="add image URL here">

Hope it helps.

[Brock B]

This reply has been marked as private.

[Thai]

Hi There,

To achieve that, please add the following CSS under Customizer > Custom > Global CSS:

.x-navbar-inner .x-container.max.width {
    max-width: 100%;
}

Hope it helps 🙂

[Brock B]

🙁 Looks like that didn’t work. I copied the CSS in under Customize > Custom > CSS

Once I coped it into the CSS box, nothing happened. Any other suggestions?

[Christopher]

Hi there,

Please add this :

.x-navbar-inner .x-container.max.width {
    max-width: 100%;
    width: 98%;
}

Increase ‘Navbar Top Height’ under Customize -> Header.

Hope it helps.

[Brock B]

I’m really sorry, but that didn’t work either. Would you be able to jump in there and see what the issue is?

[Thai]

Hi There,

Please this HTML code in your custom > CSS then add the provided CSS again:

<img src="http://paradisevalleyproductions.com/wp-content/uploads/2015/01/PVPlogotransparent3.png">

Thanks.

[Brock B]

None of this seems to be working 🙁

I’ve tried all of this and put them in the CSS under custom and nothing changes unfortunately

[Rupok]

Hi there,

Maybe we are not getting your issue properly. Would you summarize the issue again? I can you already have the logo in header. Do you want an extra logo on the top left? Did you add it from Customize > Header > Topbar content ?

Kindly add a screenshot and clarify what you are really trying to achieve to avoid confusion.

Cheers!

[Brock B]

You are correct, I do have the logo in the header, but I am wanting it down a bit so it’s even with the menu items in the header. I am trying to get it just to the left of “Services.”

I want it similar to how the website below has the logo in the top left but it’s still even with the menu items in the header. http://www.michaelsvideova.com/

Does that make sense?

[Rue Nel]

Hello There,

I found out that you have inserted an invalid css code.
http://prntscr.com/bu6z41

To align your logo, menu and the social icons, please add the following JS code in the customizer, Appearance > Customize > Custom > Javascript

(function($){
  //$(document).ready(function(){
  	var W = $(window).width();
    if( W > 979 ) {
  	  $('.x-topbar .x-social-global').insertAfter( $('.x-brand') );
    }
 // });
})(jQuery);

And then your also need to add the following css code in the customizer, Appearance > Customize > Custom > CSS

.x-navbar .x-container.max.width {
    max-width: 100%;
    width: 90%;
}

.x-navbar .x-social-global {
    float: right;
    margin-top: 80px;
    margin-left: 20px;
}

.x-navbar .x-social-global a {
    margin-left: 6px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 18px;
    font-size: 1.8rem;
}

.site .x-topbar {
  min-height: 0;
}

.no-touch .x-topbar .x-social-global{
  display: none;
}

And your navbar top alignment may need to be adjust. You can change the settings in Appearance > Customize > Header > Alignment

Hope this helps.

[Author]

Posts