Hello, and change mobile hamburger icon twentytwentytwo

Hello and welcome @leighonsea!

Just to make sure I am following you, you would like your hamburger menu icon to look like this, correct?:

https://cloudup.com/cnACu7tKUZ0

If so, you can replace the default icon with a different one adding the following function:

function custom_render_block_core_navigation (string $block_content, array $block)
{
	if (
		$block['blockName'] === 'core/navigation' && 
		!is_admin() &&
		!wp_is_json_request()
	) {
		return preg_replace('/\<svg width(.*?)\<\/svg\>/', '<SVG xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24">
		<Path d="M5 5v1.5h14V5H5zm0 7.8h14v-1.5H5v1.5zM5 19h14v-1.5H5V19z" /></SVG>', $block_content);
	}

	return $block_content;
}

add_filter('render_block', 'custom_render_block_core_navigation', null, 2);

You can replace this part <SVG xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><Path d="M5 5v1.5h14V5H5zm0 7.8h14v-1.5H5v1.5zM5 19h14v-1.5H5V19z" /></SVG> with the SVG file you plan to use.

If you are not familiar with how to add custom functions to your site, there are two main paths:

1. Access your site via SFTP, navigate to wp-admin/themes/twentytwentytwo, open up your functions.php file and include the code there on a new line, at the very bottom, under any existing code

2. An easier method to do this would be to install a plugin called Code Snippets, create a new PHP snippet, paste the code there and save/activate it.

Good luck! ?Please let me know if you have any questions or if you encounter any difficulties in doing this.

• This reply was modified 2 years, 2 months ago by Alvaro Gómez.
• This reply was modified 2 years, 2 months ago by Alvaro Gómez.

Thanks so much Alvaro!
It worked
I did it via method 1. ‘Access your site via SFTP …’
No problems at all
Best wishes
Leigh

That’s great @leighonsea!

Just one quick caveat. By following the first method, we are overwriting the theme’s original files. This means that any changes you made to those files will be lost as soon as the theme is updated.

To avoid losing this customization, I would suggest writing down the code somewhere for future reference (so you can add it again following the first method) or considering method number two. The advantage of using method two is that the snippets are stored in the database via the Code Snippets plugin and will not be lost with future updates.

As a third option, if you would prefer not having to rely on a plugin to add this code, you can always write your own plugin to include this (and other) short code snippet(s).
You could use and existing plugins as the base, such as Hello Dolly.

I hope that helps!

• This reply was modified 2 years, 2 months ago by Alvaro Gómez.

Thanks for the heads-up, @mrfoxtalbot!
It is already in my Joplin notes – its standard practice for me and my ‘memory’ ??

• This reply was modified 2 years, 2 months ago by leighonsea.