Adjust Superfly Menu Hamburger menu's Margin on mobile

Hello,

My superfly menu’s hamburger icon looks fine on all other pages except the blog post page. I tried to adjust the margin in the “button” tab in Superfly but I think the issue is with the announcement bar on the page?

Is there any code I can apply to adjust the margin of the icon on this specific page only?

Thanks,
Jerome

Hi Jerome,

Thank you for reaching out to us. I checked your site and I believe the issue is happening due to the third party plugin (WP Notification Bars) you’re using to show the notification bar which is pushing down the header, however the placement of your Superfly menu is the same on all pages including the posts pages. I’d suggest you to deactivate the WP Notification Bars plugin and use ConvertPlus plugin instead to show the notification bar.

This should resolve the Menu alignment issue. Let us know how this goes!

Hello Nabeel,

Works perfectly! However, is it possible if I want to relocate the notification bar to appear above the header instead of covering it?

Thanks,
Jerome

I found that toggling the “Push Page” setting does the job but it messes with the superfly hamburger icon like before. Anyway to fix this?

Thanks,
Jerome

Hey Jerome,

Regretfully, providing a fix for issue caused by 3rd party plugins is outside the scope of our theme support. You’d need to consult with a developer to provide a specific solution for you.

Thank you for understanding.

That’s okay. May I know how to reduce the spacing between the logo and menu items as indicated in the image?

Also,
How do I change the color of the tagline “grow your business” to white?

Thank you so much!

Hi Jerome,

Please see the Superfly > Menu Panel > Styling > Text, that is for the site title.

For the Tagline you need a custom CSS.

.sfm-title h4 {
color:red;
}

You can add that under Superfly > Advanced > Additional CSS

Please do mind that we don’t really provide custom CSS, it would ultimately be your responsibility to take it from here.

You can find the proper CSS code selector using the Chrome browser Developer Toolbar
For the CSS code itself, I suggest that you get started with this tutorial.
Superfly documentation

Thanks,

Thank you!

You’re most welcome Jerome.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.