How to add a custom link to the header menu

[rocioperezza]

Hi there,

I would like to add a link to the menu right next to Sign In, together with an icon (following the same appearance as Sign in) so that on mobile, the text disappears and only the icon remains.

Does anyone know how to do this?

Many thanks in advance!

[ihor]

Hi,

Yes, if you mean adding a custom link to this area it’s possible but requires code customizations. There may be a workaround if you use the existing menu in Appearance/Menus, and add an icon before its label.

[rocioperezza]

Thank you! Any PHP snippet I could use to add this to the menu and make it always visible on the mobile version (same as the other icons that come with the ExpertHive template)?

[rocioperezza]

Also I would like to add this link next to Sign in, when I add it via Appearance/Menus it goes to the left side of the header and I can’t add it with icons. How can I add an item to the header?

[yevhen]

Please try this PHP snippet to add a link to the header, but please note that it can require further customization. If you are not familiar with the code customization then please consider hiring someone for custom work https://fvrr.co/32e7LvY

add_filter(
	'hivepress/v1/templates/site_header_block',
	function($template){
		return hivepress()->template->merge_blocks(
			$template,
			[
				'site_header_menu' => [
					'blocks' => [
						'custom_header_link' => [
							'type' => 'content',
							'content' => '<a href="#" class="hp-menu__item hp-menu__item--custom-header-link hp-link"><i class="hp-icon fas fa-file-alt"></i><span>Custom text</span></a>',
							'_order' => 10,
						]
					],
				],
			]
		);
	},
	1000
);

[rocioperezza]

Thank you so much! It works