How to hide Sparkling responsive menu?

How do we hide the responsive menu in Sparkling?

We’ll need the CSS to hide Sparkling’s responsive menu if we’re going to use a third-party responsive menu plugin.


Hi @slobjones,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

.navbar-header button.btn.navbar-toggle {
    display: none;

Best Regards,

That’s interesting.

I’m using a background image for my logo, and when I hide the button, the mobile logo shrinks.

I’ve tried media queries with various min-height settings for the logo, but it looks like hiding the button so I can use a third-party mobile menu isn’t going to work.

Mostly solved the issue by making the button transparent and disabling the button:

.navbar-default .navbar-toggle .icon-bar {
    background-color: transparent;
.navbar-default .navbar-toggle {
    border-color: transparent;

button.btn.navbar-toggle {
cursor: none;

Edit to header.php:

<button type="button" disabled class="btn navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">

Awesome great to see you got that solved.

If you need further assistance regarding this then could you please share me your site URL where it’s happening so that i can troubleshoot it?