Mobile menu styling

video has information how to add image directly in menu

Hi

Thanks for the link. That is a good video. The part I was interested in was right at the end.

However it’s not working.

I have tried all the settings in ;
Navigation Block > Settings tab (cog icon) > GreenShift Extra Settings

Colors and padding controls under GreenShift Extra Settings do not have any noticeable effect on my mobile menu, they do effect the desktop menu. Additional Templates for mobile do not appear on the mobile menu.
Greenshift Theme Version: 1.3.7
GreenShift – Animation and Page Builder Blocks Version: 6.6.4

• This reply was modified 1 year, 6 months ago by deanes.

yes, they are for desktop. Mobile options will be also added. If you have issue with custom mobile templates, please provide all screenshots of your steps

My steps for trying to get an image on the mobile menu using Greenshift Theme v1.3.7 and Greenshift Plugin v6.7.7
From WP main menu I select ‘Reusable templates’.
On that page I just add a Greenshift Image block and insert an image (I have also tested with native WP Gutenberg text block).
Saved and Published as “Mobile-Menu-Image”.
Now I go to Appearance > Editor…go through to select the Front Page Header.
In the Header select the Navigation Block.
In the Navigation Block panel on the right side click the Cog Icon and scroll down to ;
“MOBILE MENU TOP AREA TEMPLATE”
in the drop down I select “Mobile-Menu-Image”
Now I ‘Update’.
I go to my mobile device/mobile view in Browser Developer Tools and I don’t see any image on the Menu which is displayed when I press the ‘Hamburger Menu’
I have also tried the option;
“MOBILE MENU BOTTOM AREA TEMPLATE” in the Navigation Block Settings
Again no image is shown.

Please advise.

Screenshots are here;
Reusable Template
https://postimg.cc/hXp4QH51

Navigation Settings
https://postimg.cc/cvs4HsXJ

Mobile Menu (no image)
https://postimg.cc/F1LKCCYh

not resolved

This will be fixed in theme update

Hi

It isn’t fixed in today’s theme release v1.4
But I can’t find the a Change Log for this release to understand what’s changed.
The new settings for mobile menu colours are very good thank you, but despite havin Reusable Templates set-up and selected in the Navigation Block Settings; ‘MOBILE MENU TOP AREA TEMPLATE’ and ‘MOBILE MENU BOTTOM AREA TEMPLATE’ I am not seeing the contents on the mobile menu of my device.
Are there any restrictions on what types of blocks can be used in the Templates? I have just added an image block only.

I think it’s fixed. If you still have a problem, make sure that your Parent navigation item doesn’t have Line height or other typography option, we found bug related to this

It is fixed for me after you advised to remove line height formatting from the Menu/Navigation block.
Thanks

Hi:

If I add a reusable template to the “MOBILE MENU TOP AREA TEMPLATE” should I be able to see it in my desktop browser with Responsive Tools? I’m working on a site in MAMP and I don’t see the image I added when I view the site in Chrome using developer tools. Is it only viewable via a live device?

Thanks.

no, it’s using mobile detection tool