[Resolved] Keep sticky menu logo centered

Home Forums Support [Resolved] Keep sticky menu logo centered

Home Forums Support Keep sticky menu logo centered

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1266089
    Anne-Laure

    Hi everyone,

    I’m using the Split theme. I added a logo to my sticky navigation but it moves to the left side of the screen when I start scrolling down on the page.

    I want to keep the position of the logo the same in the regular menu and the sticky menu. How can I do that?

    Thank you!

    #1266095
    David
    Staff
    Customer Support

    Hi there,

    in Customizer > Layout > Primary Navigation – change the Inner Navigation Width to Contained.

    If thats not it – can you share a link to your site so i can take a look. Can probably resolve the Navigation Search issue at the same time πŸ™‚

    #1266104
    Anne-Laure

    Thanks David!

    Changing the Inner Navigation Width to Contained made the menu, well, more “contained” but the logo still moves to the left side of the screen when I scroll down.

    I’m working on the website locally but here are screenshots:

    1. regular menu
    2. sticky menu

    Thank you!

    #1266444
    Leo
    Staff
    Customer Support

    We would really need to see the site and inspect the code to be able to help with issue like this.

    Can you duplicate the issue on a live server?

    Thanks πŸ™‚

    #1266450
    Anne-Laure

    I do have it on a live server as well, but protected with a password. Is there a way I can send you the details privately?

    #1266478
    Leo
    Staff
    Customer Support

    Can you edit the original topic to include the URL in the private URL field (only our staff can see)?

    Then you can just provide the password here as it’s useless to other users without knowing the URL.

    Let me know πŸ™‚

    #1266485
    Anne-Laure

    Done!

    Username: staging_xwbdry
    Pwd: 7mgnvVAFAYcd

    (you will see I’m also currently struggling with the topbar conflicting with the sticky bar but that’s another issue)

    Thank you!

    #1267122
    David
    Staff
    Customer Support

    In Customizer > Additonal CSS change this:

    .site-branding,
    .site-logo {
    	position: absolute;
    	left: 50%;
    	-webkit-transform: translateX(-50%);
    	        transform: translateX(-50%);
    	z-index: 200;
    }

    to:

    .navigation-branding,
    .site-logo {
    	position: absolute;
    	left: 50%;
    	-webkit-transform: translateX(-50%);
    	        transform: translateX(-50%);
    	z-index: 200;
    }

    And then add this CSS:

    @media(min-width: 769px) {
        #sticky-navigation {
            top: 41px !important;
        }
        
        #sticky-navigation.main-navigation:not(.slideout-navigation) .main-nav {
            width: 100%;
        }
        #sticky-navigation .inside-navigation {
            padding-left: 40px;
            padding-right: 40px;
        }
    }
    #1267130
    Anne-Laure

    Thanks so much, David! The logo now stays in the middle πŸ™‚

    The only issue is that when the topbar is dismissed it leaves a gap like this. Any idea how I can address that? (happy to open a new topic as it’s not exactly the same issue as the original one)

    Many thanks!

    #1267407
    David
    Staff
    Customer Support

    Hmmm… i can’t actually see an easy way around it. The Mail Chimp top bar doesn’t add any body classes i can use to style the nav differently.

    #1267417
    Anne-Laure

    Do you think there’s a way to achieve a similar thing using the GeneratePress top bar?

    The part I’m unclear on is showing the GP top bar depending on whether the person has already signed up to the newsletter or not β€” not sure that’s feasible?

    Thank you!

    #1267620
    David
    Staff
    Customer Support

    Not really as it would require cookies and stuff to determine the user has subscribed.
    The simplest option would be to remove the Sticky option on either the MC bar or the Navigation.

    #1267644
    Anne-Laure

    I ended up keeping everything fixed at the top for now and always showing the email bar regardless of subscription status πŸ™‚ Many thanks for the amazing support!

    #1267647
    David
    Staff
    Customer Support
Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.