Archived topic
Replace menu bars close icon
3 replies · Started by Daniel on August 10, 2022
Viewing posts 1–4 of 4
So using the following snippet Ive been able to replace the normal menu-bars, but not the close menu-bars.
add_filter( 'generate_svg_icon_element', function( $output, $icon ) {
if ( 'menu-bars' === $icon ) {
$output = '<svg class="mobile-menu-toggle" width="26" height="21" viewBox="0 0 26 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 0.5H26M0 10.5H26M0 20.5H26"/>
</svg>';
}
if ( 'close' === $icon ) {
$output = '<svg class="mobile-menu-close" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.1612 0.646495L19.546 19.0313M0.454102 19.0313L18.8389 0.646484"/>
</svg>';
}
return $output;
}, 10, 2 );What is wrong here? 😅
Hi Daniel,
Can you try this filter instead?
add_filter( 'generate_svg_icon', function( $output, $icon ) {
if ( 'menu-bars' === $icon ) {
$output = '<span class="gp-icon icon-menu-bars">
<svg>Hamburger icon</svg>
<svg>Close icon</svg>
</span>';
}
return $output;
}, 10, 2 );Hey Ying,
Perfect, worked like a charm. :)
Great :)
This archived topic is closed to new replies.
