Support » Theme: Spacious » mobile “Menu” link change to 3 lines

  • Hi, when my page is viewed on a mobile device the top menu shrinks down to just the word “Menu”.

    Is there a way to make it not say “Menu” but have the three lines like most sites? Even this wordpress.org has the three lines instead of “Menu”.

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 16 total)
  • Hi,

    Can you go to the Appearance > Customize > Header > Responsive Menu Style and tick on the Switch to new responsive menu. Publish and reload the page to show burger menu.

    Thanks.

    Hi,

    The issue might be arising due to the plugin conflict. Have you tried disabling the used plugins? If not, can you try disabling the used plugins one by one and check if the issue is resolved?

    Thanks.

    Hi,

    Could you go to the Appearance > Customize > Additional CSS in the dashboard and insert the code mentioned below:

    @media only screen and (max-width: 640px){
    	#header-nav-container h3.menu-toggle {
    		font-size: 0;
    	}
    }
    @media only screen and (max-width: 640px){
    	#header-nav-container h3.menu-toggle::before {
    		content: '\2261';
    		font-size: 40px;
    	}
    }

    Thanks.

    That worked great! One other thing is that the menu looks off. Basically that it doesn’t line up right. Is there a way you have to fix that?
    Thank you for the great help!

    Hi,

    If you are referring to aligning the header widget center, you can go to the Additional CSS box and insert the code mentioned below:

    @media screen and (max-width: 600px)
    .better-responsive-menu #header-right-sidebar {
        float: none;
    }

    If not, can you specify in detail as to what you want to achieve?

    Thanks.

    Hi, I put it in and it gave an error. I made a quick video to show you what it looks like.
    https://www.loom.com/share/ed8a79b578cf4322bcba89029e2c4bfe

    Thank you for all your help!

    Hi,

    The above code seems to has curley braces missing. Can replace the above code with this one.

    @media screen and (max-width: 600px){
    	.better-responsive-menu #header-right-sidebar {
    		float: none;
    	}
    }

    For removing the padding and border, you can insert the code mentioned below:

    @media screen and (max-width: 600px){
    	#header-nav-container .main-navigation {
    		padding-bottom: 0px;
        }
    	.main-small-navigation {
        border-bottom: 0px;
        }
    }

    Thanks.

    That worked perfectly. Thank you!

    Hi,

    Glad to know it worked. Feel free to ask again if you get any issue regarding the theme. If you liked this theme, you can help us by leaving a review.

    Thanks.

    Terrific, and just left a 5 star for you. Thanks!

    triune51

    (@triune51)

    Hi, I’m not sure if this caused a change or something else did but the footers are now now working.

    Now it shows 4 columns when I only want one column.

    In the theme customization, footers, I have the columns set to 1 column.
    When I go into the widgets, it only shows one column.

    Even though it looks like it should be working fine, the site shows the 4 columns. You can see it here: https://masterpassiveincome.com

    How can I get this to work properly?
    Thank you!

    Hi,

    If you are using a caching plugin, can you clear the cache generated by that plugin and check?

    Thanks.

    triune51

    (@triune51)

    Yep, I did that. I even disabled it and it is still the same.

    What else can I do?

    Hi,

    Then, maybe if you have used the child theme and overwritten any of the theme template files then, can you tally those and change as needed and check once?

    Thanks.

    triune51

    (@triune51)

    Hi, I do have a child theme but when I activate the main parent theme, the problem is still there.

    Any suggestions?

Viewing 15 replies - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.