Tagged: cart button, Hamburger-Menu
Hello, I have two issues. First, the Cart Icon button on the menu bar will not scroll down as the user slides down the site on a mobile device. How can I make the Cart Icon button a ‘sticky’ so that it is visible to the user has he slides down the site on his mobile phone?
Second, the small hamburger menu bar is obscured by the menu icon when the site is viewed on a mobile device. How do I keep it visible? Thank you for your help!
Hey JordanaAdrienne,
It looks like the icon font is being blocked on your site, please try following this to get them showing: https://kriesi.at/documentation/enfold/icon/#icons-are-showing-as-rectangular-boxes-
And refer to this on how to get a sticky header on mobile: https://kriesi.at/documentation/enfold/header/#sticky-header-on-mobile
Best regards,
Rikard
Thank you. I still have one more problem. I followed your instructions to unblock the icon font and to get a sticky header on mobile. But the hamburger menu is still obscured on the mobile view. How do I make it visible? Perhaps one solution is to decrease the logo for mobile? Just need it to be clear to viewers where the hamburger menu is. Here is a screenshot of what I’m talking about: https://ibb.co/ZM6y8YJ
Thanks again.
Hi,
Thanks for the update. Please try this in Quick CSS in order to make the logo smaller:
media only screen and (max-width: 767px){
.responsive .logo img {
height: 60px;
max-height: 60px;
}
}
This CSS is applying to your main menu:
.main_menu {
right: 150px!important;
}
Please remove it, or alter it, so that it doesn’t apply on mobile.
Best regards,
Rikard