Mobile header + social icons

Hi there,

Your website link requires log in and password.

Can you provide the actual live link to it?

I'm assuming this is what you are looking for: https://docs.generatepress.com/article/mobile-header/#adding-html-inside-the-mobile-header

Ye that is indeed what Im looking for but then a step by step guide to remove both burger icons and leaving my logo and social icons on the sticky mobile header.
I am assuming (Your mobile header HTML in here) is where you put the code for the social icons but how would you make them link to your social website?
I have no knowledge of CSS or HTML, dont know what they stand for or mean so really could use some assistance :) http://qualitymountaindays.com/ dont even know if that is my live website. Hope that works and excuse the mess

Many thanks

Your PHP would be something like this (using facebook icons for example):

add_action( 'generate_inside_mobile_header','tu_mobile_header_html' );
function tu_mobile_header_html() { ?>
    <div class="mobile-header-content">
        <a href="https://YOUR-FACEBOOK-LINK-HERE"> <i class="fa fa-facebook-square"></i></a>
    </div>
<?php }

You will need to replace YOUR-FACEBOOK-LINK-HERE and choose the icons here: http://fontawesome.io/icons/

CSS would be the same as this one: https://docs.generatepress.com/article/mobile-header/#adding-html-inside-the-mobile-header

Hide the mobile toggle on sticky mobile header should be this:

@media (max-width: 768px) {
    .mobile-header-logo .main-navigation.navigation-stick.mobile-header-navigation .menu-toggle {
        display: none;
    }
}

:) DUDE nice one. almost where I want it just slightly lower how do you get it next to my logo? oh and also how to I make my logo bigger on mobile and smaller on desktop?

Hmm I'm not seeing any CSS being added currently?

Sorry I have no idea,
I added @media (max-width: 768px) {
.mobile-header-logo .main-navigation.navigation-stick.mobile-header-navigation .menu-toggle {
display: none;
}
}
in the additional CSS tab in the GP customizer

and added
add_action( 'generate_inside_mobile_header','tu_mobile_header_html' );
function tu_mobile_header_html() { ?>

<?php }

in the snipets plugin
and it is working how i want it on my end just not at the height i want it

Hi Leo
I have tried something different that could work with some help. I have replaced my normal menu with my social menu and now I only want to see see the actual social icons and my logo in the mobile site if possible even if they are small
Many thanks

Hi again
I found a video explaining how to use elementor to do it so ill give that a shot thank for the help

Ok let me know if you want to use GP instead.

We were pretty close I think.