Archived topic
Off canvas panel not showing up
26 replies · Started by Antonio on August 2, 2022
Hello,
I did the following:
1) added the following code to the function.php file of the child theme:
add_filter( 'generate_svg_icon', function( $output, $icon ) {
if ( 'menu-bars' === $icon ) {
$svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 91.9 61.2" style="enable-background:new 0 0 91.9 61.2" xml:space="preserve"><path d="M30.6 30.6h30.6v30.6H30.6zM0 0h30.6v30.6H0zm61.3 0h30.6v30.6H61.3z" style="fill-rule:evenodd;clip-rule:evenodd;fill:#fff"/></svg>';
return sprintf(
'<span class="gp-icon %1$s">
%2$s
</span>',
$icon,
$svg
);
}
return $output;
}, 15, 2 );
2) Moved to Customizer > Layout > Off Canvas Panel and set the Offcanvas panel this way: https://prnt.sc/p1wmVoJvax1w
3) Moved to Appearence > Menu and did the following: https://prnt.sc/mi9HGtrhFfH0
3) modify the header element as follows: https://prnt.sc/yDB9d9mraQX9
Still I see the full menu and can't see the SVG icon: https://prnt.sc/TlyaTjqzARBX
Where am I wrong?
Thank you
1. If you keep using the block element - site header, the off-canvas panel can not be opened.
2. The navigation block you added to the element is a WP core block, it's not related to GP's off canvas panel.
Can you follow the below steps?
1) disable the block element - site header, use the default GP header instead.
2) set the off canvas menu to onat customzier > layout > off canvas panel.
3) change Fernando's code menu-bars to pro-menu-bars.
Let me know!
Hello,
done it, but still there are some problems:
1) SVG icon is not the one I've set: https://prnt.sc/gH0Qg5BdgTNt
Here's the code:
add_filter( 'generate_svg_icon', function( $output, $icon ) {
if ( 'pro-menu-bars' === $icon ) {
$svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 91.9 61.2" style="enable-background:new 0 0 91.9 61.2" xml:space="preserve"><path d="M30.6 30.6h30.6v30.6H30.6zM0 0h30.6v30.6H0zm61.3 0h30.6v30.6H61.3z" style="fill-rule:evenodd;clip-rule:evenodd;fill:#fff"/></svg>';
return sprintf(
'<span class="gp-icon %1$s">
%2$s
</span>',
$icon,
$svg
);
}
return $output;
}, 15, 2 );
2) color settings are not working: https://prnt.sc/Lz9cwdi7cMDN
Also: is there a way to show the Tagline of the Site title?
Thank you
Try this code:
add_filter( 'generate_svg_icon', function( $output, $icon ) {
if ( 'pro-menu-bars' === $icon ) {
$svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 91.9 61.2" style="enable-background:new 0 0 91.9 61.2" xml:space="preserve"><path d="M30.6 30.6h30.6v30.6H30.6zM0 0h30.6v30.6H0zm61.3 0h30.6v30.6H61.3z" style="fill-rule:evenodd;clip-rule:evenodd;fill:#fff"/></svg>';
return sprintf(
'<span class="gp-icon %1$s">
%2$s
</span>',
$icon,
$svg
);
}
return $output;
}, 15, 2 );
Tested this on my site and it's working.
Try clearing cache after adding this. If that doesn't work, try adding it through Code Snippets as well.
Hello,
the code you sent me was exactly the same as the one I was using. Can you please login to the website and check the issue?
Thank you
I see. Can you try this instead?:
add_filter( 'generate_svg_icon', function( $output, $icon ) {
if ( 'menu-bars' === $icon ) {
$svg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 91.9 61.2" style="enable-background:new 0 0 91.9 61.2" xml:space="preserve"><path d="M30.6 30.6h30.6v30.6H30.6zM0 0h30.6v30.6H0zm61.3 0h30.6v30.6H61.3z" style="fill-rule:evenodd;clip-rule:evenodd;fill:#fff"/></svg>';
return sprintf(
'<span class="gp-icon %1$s">
%2$s
</span>',
$icon,
$svg
);
}
return $output;
}, 15, 2 );
Same.
Can you please login to the website and check the issue?
I see. I updated the code above. Can you try that instead?: https://generatepress.com/forums/topic/off-canvas-panel-not-showing-up/page/2/#post-2333535
It works.
I still have the following issue:
2) color settings are not working: https://prnt.sc/Lz9cwdi7cMDN
Thank you
Try changing the colors in the Primary Navigation colors.
Works now, thank you!
You're welcome Antonio!