No navigation / hamburger menu in amp

Hello @singhvirat

Thank you for contacting us, It seems you are using the AMP plugin in Reader Mode with a Legacy theme.

The Legacy theme provides the only basic structure to display AMP pages and it is not being further developed, as there are many AMP-compatible themes available in the WordPress plugin repo.

Your current theme “Astra” is AMP compatible and will work for the AMP as well as the non-AMP pages version of your site. Most of the features provided by Astra work with AMP such as Menu, Search, etc.

We will recommend you to use the AMP plugin in Transitional Mode so that AMP pages will be served with your primary theme Astra.

If you do not want to switch to Transitional Mode and keep using the Reader Mode Legacy theme, I will recommend using AMP Sidebar Hamburger Menu plugin which will add a hamburger menu to the legacy theme.

Hope this helps!

The website is getting crashed in Transitional mode with Astra theme. I have tried the AMP Sidebar Hamburger Menu plugin however when moving from amp to non-amp page there are white lines between the loading of the pages.

Here are the plugin reports:

[
    {
        "url": "https://ncert.infrexa.com/bank-of-india-recruitment-2022/",
        "type": "is_singular[post]",
        "label": "Post",
        "amp_url": "https://ncert.infrexa.com/bank-of-india-recruitment-2022/?amp=1",
        "validation_errors": [
            {
                "node_name": "font",
                "parent_name": "a",
                "code": "DISALLOWED_TAG",
                "type": "html_element_error",
                "node_attributes": {
                    "color": "#ff0000"
                },
                "node_type": 1,
                "sources": [
                    {
                        "type": "plugin",
                        "name": "amp-sidebar-hamburger-menu",
                        "file": "amp-wp-sidebar.php",
                        "line": 241,
                        "function": "jozz_ampsidebar_add_head_html",
                        "hook": "amp_post_template_footer",
                        "priority": 99
                    }
                ]
            }
        ],
        "validated_url_post": {
            "id": 25762,
            "edit_link": "https://ncert.infrexa.com/wp-admin/post.php?post=25762&action=edit"
        },
        "stale": false
    },
    {
        "url": "https://ncert.infrexa.com/editorial-team/",
        "type": "is_singular[page]",
        "label": "Page",
        "amp_url": "https://ncert.infrexa.com/editorial-team/?amp=1",
        "validation_errors": [
            {
                "node_name": "font",
                "parent_name": "a",
                "code": "DISALLOWED_TAG",
                "type": "html_element_error",
                "node_attributes": {
                    "color": "#ff0000"
                },
                "node_type": 1,
                "sources": [
                    {
                        "type": "plugin",
                        "name": "amp-sidebar-hamburger-menu",
                        "file": "amp-wp-sidebar.php",
                        "line": 241,
                        "function": "jozz_ampsidebar_add_head_html",
                        "hook": "amp_post_template_footer",
                        "priority": 99
                    }
                ]
            }
        ],
        "validated_url_post": {
            "id": 25140,
            "edit_link": "https://ncert.infrexa.com/wp-admin/post.php?post=25140&action=edit"
        },
        "stale": false
    }
]

Hello @singhvirat

I am not sure why you got those errors, the AMP Sidebar Hamburger Menu plugin doesn’t use <font> tags.

In fact, the tag is deprecated and not being used in HTML5 anymore, so we will recommend not using it.

So how to fix the issue? I urgently need a hamburger menu on amp mode. For your information, I would like to tell you that Astra is not amp-compatible. It breaks down my site in standard or transitional mode so I have no option but to keep it on with reader mode.

Please suggest…

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

Hello @singhvirat

So how to fix the issue?

Please check if you are using any custom code that might be adding <font> tag. if yes please remove it and use AMP Sidebar Hamburger Menu plugin as available on the WordPress repository.

For your information, I would like to tell you that Astra is not amp-compatible

Astra is AMP compatible, we add the themes on our site after manual testing. Astra might be conflicting with other plugins.

We also noticed that you are using PHP 8.0, AMP plugin is compatible with PHP 8.0 but other plugins that do not support PHP 8.0 might break your site on AMP.

We will recommend using PHP 7.4 for now unless all your plugins and theme ie. Astra supports PHP 8.0

@singhvirat
As we didn’t receive a response I’ll mark this as resolved. Feel free to open a new support topic if you require any further assistance.