Change Text inside "beans_primary_menu_offcanvas_button"


Hi, What I am tyring to do is to change the text inside [data-markup-id= "beans_primary_menu_offcanvas_button"]. The offcanvas triggering button says "Menu", but I like to take out the text and just leave the icon only. It seems like there is a proper way of doing this but I can't figure it out. Someone please help!

Thanks in advance.

By the way I really appreciate this awsome framework since it made my life a lot easier. If I could figure out few more things, it could be even better πŸ™‚


u can use this snippet of html in function

<a href="#offcanvas_menu" class="uk-button" data-uk-offcanvas="" data-markup-id="beans_primary_menu_offcanvas_button"><i class="uk-icon-navicon uk-margin-small-right" data-markup-id="beans_primary_menu_offcanvas_button_icon"></i><!-- open output: beans_offcanvas_menu_button -->Menu<!-- close output: beans_offcanvas_menu_button --></a>

Thanks for the reply!

Okay, I am new to this Beans API with very limited knowledge about PHP, could you please ellaborate on this? Did you mean to remove the offcanvas button first and add the HTML you gave me like in the code below? I couldn't get this to work properly.

in functions.php

beans_remove_markup( 'beans_primary_menu_offcanvas_button' ); 
/*I am not even sure where to add this code in the template*/
add_action( 'beans_header_after_markup', 'myfunction' );
function myfunction() {
/*--the code you gave me--*/
<a href="#offcanvas_menu" class="uk-button" data-uk-offcanvas="" data-markup-id="beans_primary_menu_offcanvas_button"><i class="uk-icon-navicon uk-margin-small-right" data-markup-id="beans_primary_menu_offcanvas_button_icon"></i><!-- open output: beans_offcanvas_menu_button -->Menu<!-- close output: beans_offcanvas_menu_button --></a>
}

The code above doesn't work.


Solved. The code below let you replace the whole offcanvas triggering button with your original button.

in functions.php

//Remove the existing offcanvas triggering button
beans_remove_action( 'beans_primary_menu_offcanvas_button' );

//Adding the whole button and removed the content "Menu"
add_action( 'beans_primary_menu_append_markup', 'myfunction' );
function myfunction() {
?><a href="#offcanvas_menu" class="uk-button uk-hidden-large your-class-name" data-uk-offcanvas="" data-markup-id="beans_primary_menu_offcanvas_button"><i class="uk-icon-navicon uk-margin-small-right" data-markup-id="beans_primary_menu_offcanvas_button_icon"></i><!-- open output: beans_offcanvas_menu_button --><!--where "Menu" was --!><!-- close output: beans_offcanvas_menu_button --></a>
<?php }

Thanks for the help πŸ™‚

Write a reply

Login or register to write a reply, it's free!