Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1089515

    Brock B
    Participant

    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

    #1089652

    Christopher
    Moderator

    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.

    #1089890

    Brock B
    Participant
    This reply has been marked as private.
    #1089948

    Thai
    Moderator

    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 🙂

    #1090028

    Brock B
    Participant

    🙁 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?

    #1090340

    Christopher
    Moderator

    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.

    #1090655

    Brock B
    Participant

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

    #1090674

    Thai
    Moderator

    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.

    #1090716

    Brock B
    Participant

    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

    #1090725

    Rupok
    Member

    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!

    #1091053

    Brock B
    Participant

    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?

    #1091294

    Rue Nel
    Moderator

    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.