[Resolved] mobile menu display bottom with larger nav size

Home Forums Support [Resolved] mobile menu display bottom with larger nav size

Home Forums Support mobile menu display bottom with larger nav size

Viewing 15 posts - 1 through 15 (of 49 total)
  • Author
    Posts
  • #647991
    Howard

    Hi guys:
    Starting another site, as I try to create exact replication of my previous site, (www.rawassertions.com) with similar CSS and Snippets
    Bit of a problem with mobile navigation at this point:
    https://www.thesoundadvocate.com — LARGER BLACK NAVIGATION HEIGHT….MENU NOT ALIGNED WITH LOGO

    If it helps these are my previous sites CSS and Snippets entries

    SNIPPET: add_action( ‘wp_enqueue_scripts’, ‘generate_dequeue_secondary_nav_mobile’, 999 );
    function generate_dequeue_secondary_nav_mobile() {
    wp_dequeue_style( ‘generate-secondary-nav-mobile’ );
    }

    SIMPLE CSS

    .secondary-navigation .menu-toggle {
    display: none;
    }
    .secondary-navigation ul {
    display: block;
    }
    .secondary-navigation .sf-menu>li {
    float: none;
    display: inline-block !important;
    }

    @media
    (max-width: 768px) {
    .secondary-navigation {
    text-align: center !important;
    }
    I have not put in secondary nav. follow buttons plugin by Tom at this point as in previous site above

    Thanks for some help
    Howard

    #648523
    Leo
    Staff
    Customer Support

    Hi there,

    This is happening because the logo is simply too big on mobile and it’s pushing the toggle to the next line.

    You could try reducing the logo size on mobile with some CSS:

    @media (max-width: 768px) {
        .main-navigation .navigation-logo img {
            padding-top: 15px;
            height: 45px;
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #649173
    Howard

    You got it! Thanks
    Also could you explain what the other simple css Codes above DO so I can know how it will be be affecting the next moves I do in adjusting the new site as I move foreword
    Thanks
    Howard

    #649189
    Howard

    PS… which Code or how to apply the nav menu to move Down as you scroll?

    Also: what does the snippet here I have in my site do?

    SNIPPET: add_action( ‘wp_enqueue_scripts’, ‘generate_dequeue_secondary_nav_mobile’, 999 );
    function generate_dequeue_secondary_nav_mobile() {
    wp_dequeue_style( ‘generate-secondary-nav-mobile’ );
    }

    Thanks again
    Howard

    #649364
    Leo
    Staff
    Customer Support

    You shouldn’t need the CSS or snippet related to secondary navigation if you aren’t using it.

    #649406
    Howard

    I will be putting in Toms follow icon plugin on secondary navigation

    Otherwise, how to get navigation menu to move down page as scrolling on mobile?

    Thanks

    #649744
    Leo
    Staff
    Customer Support

    I’m not quite sure what you mean?

    Your secondary snippet and CSS is for this:
    https://docs.generatepress.com/article/disable-secondary-navigation-mobile-menu/

    Shouldn’t have anything to do with sticky navigation.

    #651739
    Howard

    OK—-
    Now if we revert to my other site for comparison (www.rawassertions.com)….

    I want to add follow buttons by Tom in secondary navigation

    Now my simple css Codes on that sight are;
    .secondary-navigation .menu-toggle {
    display: none;
    }
    .secondary-navigation ul {
    display: block;
    }
    .secondary-navigation .sf-menu>li {
    float: none;
    display: inline-block !important;

    How to apply the follow buttons to secondary navigation?
    At new site (www.thesoundadvocate.com )Don’t know how to apply toms follow buttons to secondary navigation.
    I did this year ago with your help but forgot.

    Now I can’t even find my secondary nav space on new site?
    This snippet is inserted:
    SNIPPET: add_action( ‘wp_enqueue_scripts’, ‘generate_dequeue_secondary_nav_mobile’, 999 );
    function generate_dequeue_secondary_nav_mobile() {
    wp_dequeue_style( ‘generate-secondary-nav-mobile’ );
    Should I remove it… then put in social icon follow plugin…then reinsert it?????

    See: example: http://www.rawassertions.com
    Toms social icons below header
    Thanks

    #651828
    Howard

    Ps working on it…adding social icon custom links to secondary menu…though as the layout looks now (haven’t added links yet)
    I don’t even see my secondary menu…unless css removed it except for link for icons which i haven’t inserted yet)??

    #651959
    Leo
    Staff
    Customer Support

    Those social icons are simply using FontAwesome in the secondary navigation:
    https://docs.generatepress.com/article/adding-icons-to-menu-items/

    The snippet and CSS is to make it so it doesn’t turn into toggle on mobile.

    If you need to review your previous topics, simply click on forum profile at the top.

    #652124
    Howard

    Leo
    I have my icons copied and their on my site at BOTTOM.. http://www.thesoundadvocate.com
    I can not get to my SECONDARY NAVIGATION to apply them even after adding to my SECOND MENU THE LINKS custom used for the FOOTER WIDGET.
    I have no idea how to get or see my secondary navigation
    This is what is installed so far:

    Snippets
    Disable secondary mobile navigation menu
    add_action( ‘wp_enqueue_scripts’, ‘generate_dequeue_secondary_nav_mobile’, 999 );
    function generate_dequeue_secondary_nav_mobile() {
    wp_dequeue_style( ‘generate-secondary-nav-mobile’ );
    }

    SIMPLE CSS
    .site-header {
    display: none;
    }

    .secondary-navigation .menu-toggle {
    display: none;
    }

    .inside-footer-widgets { text-align: center;.
    Don not display site header code
    .site-header {
    display: none;
    }
    MY OTHER SITE (CORRECT) HAS THESE SIMPLE CSS ADDED TO THE ABOVE

    @media
    (max-width: 768px) {
    .secondary-navigation {
    text-align: center !important;
    }
    .secondary-navigation ul {
    display: block;
    }
    .secondary-navigation .sf-menu>li {
    float: none;
    display: inline-block !important;
    }

    SOS…………THANKS HOWARD

    #652174
    Howard

    BASICALLY AT THIS MOMENT.,….I HAVE NO SECONDARY NAVIGATION……..!

    #652329
    Leo
    Staff
    Customer Support

    ok let’s take a step back and solve one thing at the time which is finding out where the secondary navigation go.

    On the site with the secondary navigation not showing, can you do the following:

    – remove all the PHP and CSS code related to secondary navigation

    – make sure the location setting is Not set to No Navigation here: https://docs.generatepress.com/article/secondary-navigation-location/

    – make sure you have the correct menu assigned to the secondary menu: https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#setting-a-theme-location

    If it still doesn’t show up, can you keep the setting and let me have a look?

    Thanks 🙂

    #652338
    Howard

    I will do that as you said and I get the strangest feeling (I think… might be a bug ) I will let you know.
    I appreciate your patience with me
    Thanks
    Howard
    PS
    I am almost positive I don’t have to make a SEPARATE PAGE called “secondary menu””??? I did add a NEW MENU to the menu section and added it … then put custom links for the follow buttons which shows up under secondary menu in customerizer…..

    #652347
    Leo
    Staff
    Customer Support

    No you don’t have to make a separate page called secondary menu.

    Just make sure you go through all three steps above.

Viewing 15 posts - 1 through 15 (of 49 total)
  • The topic ‘mobile menu display bottom with larger nav size’ is closed to new replies.