Add “MENU” text to 3-bar Menu button

Last Reviewed: 28-Aug-15 (3.4.8) 3.1-3.4.*

Where to copy/paste this code?

NoteSince Customizr 3.3.1 (Customizr-Pro 1.0.12), because of new wp themes guidelines, you cannot use single (double) quotes in the Custom CSS in customizer. Use a Child Theme.

The simplest way is to use the Custom CSS section of the customizer option screen. If you have many customizations to make in CSS and PHP, then We strongly recommend you create a child theme. Everything you need to know about creating a child theme with Customizr here.

/* START OF Add "MENU" text to 3-BAR Menu button  */
.btn-navbar {
width:          90px;
height:         30px;
vertical-align: top;
}

.btn-navbar:after {
content:        "Menu";
float:          right;
margin:         -16px 0 0 0;
}
/* END OF Add "MENU" text to 3-BAR Menu button  */

Credit: @jrisberg

 

Now if you don’t want the 3 bars to appear at all, then use this code instead:

Where to copy/paste this code?

NoteSince Customizr 3.3.1 (Customizr-Pro 1.0.12), because of new wp themes guidelines, you cannot use single (double) quotes in the Custom CSS in customizer. Use a Child Theme.

The simplest way is to use the Custom CSS section of the customizer option screen. If you have many customizations to make in CSS and PHP, then We strongly recommend you create a child theme. Everything you need to know about creating a child theme with Customizr here.

/* START OF Add "MENU" text to 3-BAR Menu button (Needs additional php code in Child Theme functions.php) */

.btn-navbar {
width:          60px;
height:         30px;
vertical-align: top;
}

.btn-navbar:after {
content:        "Menu";
float:          right;
margin:         -5px 0 0 0;
}
/* END OF Add "MENU" text to 3-BAR Menu button (Needs additional php code in Child Theme functions.php) */

Where to copy/paste this code?
We strongly recommend you create a child theme and add this to the Child Theme functions.php.
Download a start-up child theme here.

Remember: you shouldn’t edit the theme’s functions.php.

// START OF Add "MENU" text to 3-BAR Menu button (Needs additional CSS code in Child Theme style.css) 

// Remove 3-bars from menu button
add_filter('tc_menu_display', 'rdc_menu_display');
function rdc_menu_display($output) {
    return preg_replace('||', null, $output);
}
// END OF Add "MENU" text to 3-BAR Menu button (Needs additional CSS code in Child Theme style.css) 

23 thoughts on “Add “MENU” text to 3-bar Menu button”

Comments are closed.