Reponsive Menu Styling – Workstation Pro Theme

[hwebb]

Hi there,

In the process of re-building our website.

Firstly, I can't get rid of the word 'menu' next to the icon for the menu when in responsive mode. Usually it would be written rather than the CSS code for the menu icon but it's not and I can't figure it out!

Secondly, How do I make it so that when the menu is activated, it displays full screen on top of the webpage. As opposed to a drop-down that moves the content down with it? (Also, if you know. How would you have the menu act as a 'responsive menu' even on desktop?)

Thanks in advance.

http://twowolvescreative.uk/

[Christoph]

Hi,

1.
The word Menu is added through this code in functions.php:

	$output = array(
		'mainMenu' => __( 'Menu', 'workstation' ),
		'subMenu'  => __( 'Menu', 'workstation' ),
	);
	wp_localize_script( 'workstation-responsive-menu', 'WorkstationL10n', $output );

2.
I´m not sure what you want to happen.
Do you want the menu items to show horizontally, show them in a kind of modal window / pop-up way or as an off-canvas menu (https://calvinkoepke.com/add-a-mobile-friendly-off-canvas-menu-in-genesis/)?

2b.
Move the .js and navigation related css from the 880px media query outside of the media queries.
Probably needs some additional styling.

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[hwebb]

Hi Christoph,

Thank you very much for your response.

I want it so that when the menu is activated using the icon it pops up/displays as a full page window maybe with slight transparency to it with the menu items listed centrally. Rather than how it is now where the menu items drop down from besides the icon. Does this make more sense?

Thanks again.

[Author]

Posts