Support » Plugin: AMP » Header and footer not appearing in amp post

  • Resolved metodija

    (@metodija)


    Hi Guys,
    I have setup the AMP plugin to use Transitional mode, so all good there.
    When i go and view the AMP version of a post i get the post displayed without the header and footer and no css.
    I looked at the HTML structure and it is using the the same code as single.php.
    This file doesn’t have the header and footer added.
    How can i get the post to appear so it can include the header and footer and css.

    Thanks

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Support Milind More

    (@milindmore22)

    Does the same occur when selecting another theme, I’m wondering if any changes you made to your theme files may be impacting your single posts. If you’d like to share an example URL with this behavior we’d be happy to investigate.

    Thread Starter metodija

    (@metodija)

    Hi Milind,
    thanks for your email.
    Can you please send me a form so i can send you the url.

    Thanks

    Plugin Support Milind More

    (@milindmore22)

    Please share your URL privately using this form

    Thread Starter metodija

    (@metodija)

    Thanks for your response Milind, i have submitted the form now.
    Please check, i am available now for the next 3 hours.

    Plugin Support Milind More

    (@milindmore22)

    if changing the theme worked for you then the issue is not specific to the AMP plugin, you may need to contact theme support.
    Also, we will recommend using reader mode, where you can choose different theme for AMP pages. You can find list of compatible themes on our site

    Also worth mentioning make sure your single.php has get_header() and get_footer() functions also the wp_head and wp_footer hooks are not been removed under AMP specific logic.

    Thread Starter metodija

    (@metodija)

    Hi Milind,
    Actually i got it working, i had the following function
    if (is_amp_endpoint()) {
    $amp_template = locate_template([‘amp/’.basename($main)]);

    return ($amp_template) ? $amp_template : $main;
    }
    so hence why it didn’t work, i have removed it and it displays now.

    There is an overlay on the page, when i inspect element i get the below:
    <div class=”media-modal-backdrop”></div>
    Do you know what this is?

    Also what is this html code below used for, it is blocking my content:
    <div class=”media-frame-content”></div>

    The reader mode how does that work? Can i use the main theme for the main website, and then use another theme for AMP?

    Thanks

    Plugin Support Milind More

    (@milindmore22)

    Good to know you found the issue,

    There is an overlay on the page, when i inspect element i get the below:
    <div class=”media-modal-backdrop”></div>
    Do you know what this is?

    I am not sure about this one, possibly one of the plugin you are using is adding the overlay.

    Yes, When you choose reader mode you can have a different theme for your AMP pages and non-AMP pages, our guide has more information about it.

    Thread Starter metodija

    (@metodija)

    Thanks Milind,
    I have tried it with the different themes, i wanted to know how do i customize them?
    How can i change the header and footer text? I want to have a logo in header and some custom text in the footer.?

    Thanks

    Plugin Support Milind More

    (@milindmore22)

    Hello @metodija

    When you choose reader themes you can customize them with reader theme customizer options. You can visit Appearnce -> AMP menu to access it,
    our guide has more information about it.

    Thread Starter metodija

    (@metodija)

    Hi Milind,
    Just one question, i know that javascript and all javascript libraries like jQuery are disabled. Is there anyway i can enable some script to run?

    Thanks

    Plugin Support Milind More

    (@milindmore22)

    Hello @metodija,

    I would suggest checking if there is an amp component available which can fulfill your need.

    For simple js like functionalities, you can use amp-bind.

    Also, please check amp-script component, it will allow you to run javascript with certain restrictions.

    PS: you can generate script hash by using amp_generate_script_hash function

    Thread Starter metodija

    (@metodija)

    Thanks for your reply Milind.
    In my custom script i use jQuery with api calls.
    Not sure what i can achieve.

    Thanks

    Plugin Support Milind More

    (@milindmore22)

    You may find this useful. Also do check other example on same page.

Viewing 13 replies - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.