Change the MENU label on mobile version of your site
If you have set your menu to collapse on mobile devices, you will see a label on the menu button which says MENU. You can change this label to something else – for example the word OPEN or VIEW GALLERIES.
You can do this by adding a CSS content block to the ENTIRE SITE section of your site and then adding this code to it:
CSS
/* Hide the word "menu" */
.sm-user-ui .sm-page-widget-nav-mobile-header .sm-page-widget-nav-menu-expand .sm-h5 {
visibility: hidden;
}
/* Change the title "Menu" to something else */
.sm-user-ui .sm-page-widget-nav-mobile-header .sm-page-widget-nav-menu-expand .sm-h5:after {
content: 'YOUR CUSTOM LABEL';
visibility: visible;
}Related articles
Comments (4)
Leave a Reply Cancel reply
This site uses Akismet to reduce spam. Learn how your comment data is processed.
Support me
I am writing this portal in my free time and I pay for it myself. So, if you want to support my work – use this button to buy me a coffee 🙂 Which will help towards the hosting costs of the portal.
If I have 2 MENU bar on my Entire Site, could I have 2 different words instead of MENU?
You could do this by addressing in the CSS the element ID of each of the MENU content blocks.
woow, thank you so much, I love your website and tutorials.
Quick question? would it be possible to instead of changing the word MENU (to another word) change it to a small graphic , like what squarespace have for mobile phone 3 parallel lines ???
thank you again
Javier unfortunately not. But if you are looking for a hamburger menu – please try this: https://dgrin.com/discussion/256975/hamburger-menu-icon-on-mobile-device