Navigation Bar Doesn’t Show Up on Mobile

Hi @reactivephysio ,

The menu seems to be working fine for me.
Could you please provide more details about the device and browser you were using when you encountered this issue?

Hi, I tried accessing the site from my friends’ mobiles (Huawei, Android) via Chrome, it seems to function normally, but when I try accessing the site with my mobile (iPhone 12 Pro Max), this issue occurs. I tried clearing cache, removing and reinstalling Chrome, and I tried accessing with Safari too, the result was same. It kinda stuck at the last bit in the loading part (the page just stays loading), and no response when I tap on the navigation bar button.

• This reply was modified 1 year, 10 months ago by reactivephysio.

Hi @reactivephysio

It appears that there is an unexpected behavior happening.
We have tried to replicate the issue on our local site, and it seems to be working fine.
However, upon checking your site on Safari, We can confirm that the issue is indeed present.

To assist you further and investigate the matter thoroughly, could you please provide the system status? You can find this information by going to Dashboard -> Gutenverse -> System Status. You can copy and paste the details here.

In addition, I recommend trying to deactivate plugins one by one to see if any of them are causing the issue.

Thank you.

Hi, here is the system status:

THEME INFO

Theme Name : Zeever
Theme Version : 1.0.9

WordPress Environment

Home URL : https://reactivephysio.com.my/
Site URL : https://reactivephysio.com.my
Login URL : https://reactivephysio.com.my/wp-login.php
WP Version : 6.2.2
WP Multisite : -
WP Debug Mode : Disabled
PHP Memory Limit : 1024M
WP Memory Limit : 256M
WP Language : en_US
WP Upload Directory : ?
Number of Category : 1
Number of Tag : 0

Server Environment

Server Info : LiteSpeed
PHP Version : 7.4.33
PHP Post Max Size : 1024M
PHP Time Limit : 900
PHP Max Input Vars : 1000
SUHOSIN Installed : -
WP Remote Get : ?
PHP Image library installed : -
PHP GD library installed : ?
PHP GD WebP supported : ?
PHP fileinfo library installed : ?
CURL Installed : ?

Active Plugins

GS Logo Slider Lite : by GS Plugins - 3.4.4
Gutenverse : by Jegstudio - 1.8.5
myStickymenu : by Premio - 2.6.3
PixelYourSite : by PixelYourSite - 9.3.7
Really Simple SSL : by Really Simple Plugins - 6.2.5
Site Kit by Google : by Google - 1.99.0
The Icon Block : by Nick Diego - 1.5.0
WPCode Lite : by WPCode - 2.0.11

Hi @reactivephysio

We are uncertain about the specific cause of the issue ourselves.
This problem only seems to occur on Safari, and if it were a browser issue, it should also manifest on our site, but it didn’t.
Have you attempted to deactivate the plugins one by one to identify if any of them are causing the issue?
This may help narrow down the cause.

Thank you.

Yes, I’ve tried to reopen the site on mobile after each time I disabling the plugins one by one (except Gutenverse), but it still remained the same.

Hi @reactivephysio

In this case, could you please copy and provide your Menu block or header?
This will allow us to examine the menu content and check if there is any issue present.

Thank you.

Sorry I don’t really understand, could you give me a sample of what should be copied? Thanks!

Hi @reactivephysio

To copy blocks within the site editor, you can click on the navigation block, then click on the three dots in the toolbar, and select “Copy Block.”
For visual reference, here is a screenshot:

Thanks for the guide! Here’s the copied header block:

<!-- wp:group {"style":{"spacing":{"padding":{"top":"20px"}},"elements":{"link":{"color":{"text":"var:preset|color|zeever-third"}}}},"backgroundColor":"zeever-primary","textColor":"zeever-border","layout":{"wideSize":"1140px","contentSize":"1170px","type":"constrained"}} -->
<div class="wp-block-group has-zeever-border-color has-zeever-primary-background-color has-text-color has-background has-link-color" style="padding-top:20px"><!-- wp:columns {"verticalAlignment":"center"} -->
<div class="wp-block-columns are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%"><!-- wp:site-logo {"width":328,"align":"left"} /--></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"66.66%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:66.66%"><!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right"}} -->
<div class="wp-block-group"><!-- wp:navigation {"ref":13,"textColor":"zeever-third","className":"is-style-customnav","layout":{"type":"flex","orientation":"horizontal"},"style":{"typography":{"fontSize":"14px","textTransform":"uppercase","fontStyle":"normal","fontWeight":"500"}}} /--></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

Hi @reactivephysio

We’re still uncertain about the exact cause of the issue.
I noticed that you’re currently using the default WordPress navigation menu.
I recommend switching to the Nav Menu block provided by our plugin. This may help resolve the problem you’re experiencing.

Please don’t hesitate to reach out if you have any further questions or require additional assistance.

Thank you.

Hi, thanks! It worked.

You’re welcome! I’m glad to hear that it worked for you.
I will close the topic for now.
If you have any more questions or need further assistance, feel free to let us know.