Working great for me now!

@haecceity Hi. This is a known issue. It’s why we’ve been working to fix in the 1.0 release. It is currently available in release candidate 2 on GitHub: https://make.xwp.co/2018/11/05/amp-plugin-release-v1-0-rc2/?amp

Note that I linked you there to the AMP version of the page. Notice that it looks the same as the non-AMP version of the page: https://make.xwp.co/2018/11/05/amp-plugin-release-v1-0-rc2/ (This is running a child theme of Twenty Fifteen.)

The goal of 1.0 and the new paired/native modes is to allow you to re-use your active theme’s templates and styles in AMP. The plugin includes built-in core theme support for AMP, and other themes will generally behave in AMP as if JS is disabled (since custom JS is not currently allowed in AMP). At this stage it is best geared toward site owners who have a small about of technical experience with theme/plugin development. Another example of a site that is using the new paired mode is my own, which runs a child theme of Twenty Seventeen: https://weston.ruter.net/?amp

• This reply was modified 6 years, 3 months ago by Weston Ruter.

Version 1.0 looks very impressive. I’m sure you understand, though, that any review I post can only reflect my experience of the plugin I used, and not future versions that I have no access to.

Of course. But this is something you can try.

Understood. Thanks. I think I’ll wait until the final release, though.

Just a heads-up that I downloaded the version that was just released and my site started appearing with no styling. I disabled the plugin and my site’s back to normal again.

Perhaps it’s a plugin conflict? I have Akismet, List category posts, SG Optimizer, Securi, Tweet Button for Quotes, and Wordfence installed.

Your site appeared with no styling in paired mode or native mode?

If you have a lot of CSS in your theme you should disable the admin bar on AMP page.

If that still doesn’t fix the problem, then you may just have too much CSS in the site for the AMP plugin to convert into valid AMP. The plugin will excluded CSS once it gathers more than Max of 50KB. If you can leave up the paired mode of the site and send me the URL for a broken page then I can confirm.

Thanks for your offer of assistance.

Initially I tried with native mode and the site was unstyled — except that the post content scrolled on top of the navigation, so there must have been some styling. The admin bar was disabled. I’m using a Twenty-Fifteen child theme, with only minor modifications.

Having received your message I tried again with paired mode, and AMP pages were still unstyled.

Here’s a link to a random amp page:
https://www.realbuddhaquotes.com/i-do-not-dispute-with-the-world-rather-it-is-the-world-that-disputes-with-me/amp/

I don’t want to leave the site this way for too long, so you you please let me know when you’ve taken a look?

I didn’t want to give visitors a bad experience, so I disabled the app. Let me know when you’re ready to take a look and I’ll enable it again.

@haecceity Could you try enabling the paired mode and then take a screenshot of the page and grab the source code of the page as well? Then you can switch back to classic and share the results here so we can take a look.

It’s promising that you’re using Twenty Fifteen, so the paired mode should work. For example, a child theme of Twenty Fifteen is running successfully with the plugin at https://make.xwp.co/?amp

Sure. I’ll do that right now.

Here’s a pastebin dump of the page code: https://pastebin.com/QV5jWW6K

Here’s a screenshot: https://www.dropbox.com/s/c4epqdssu4yb24d/Screen%20Shot%202018-12-11%20at%203.11.42%20PM.png?dl=0

That is unexpected. There should be a comment that appears above the style[amp-custom] element that lists out the sources for what is inside the stylesheet. You can see this from looking at the source code on https://make.xwp.co/?amp

Also, the CSS appearing in the style[amp-custom] element is limited to just:

@font-face{
    font-family:genericons;
    src:url("https://www.realbuddhaquotes.com/wp-content/themes/twentyfifteen/genericons/Genericons.eot")
}
@font-face{
    font-family:genericons;
    src:url("https://www.realbuddhaquotes.com/wp-content/themes/twentyfifteen/genericons/Genericons.woff") format("woff"),url("https://www.realbuddhaquotes.com/wp-content/themes/twentyfifteen/genericons/Genericons.ttf") format("truetype"),url("https://www.realbuddhaquotes.com/wp-content/themes/twentyfifteen/genericons/Genericons.svg#genericonsregular") format("svg");
    font-weight:400;
    font-style:normal
}
@media screen and (-webkit-min-device-pixel-ratio:0){
    @font-face{
        font-family:genericons;
        src:url("https://www.realbuddhaquotes.com/wp-content/themes/twentyfifteen/genericons/Genericons.svg#Genericons") format("svg")
    }
}
@media screen and (min-width: 59.6875em){
    #sidebar{
        position:sticky;
        top:-9vh;
        max-height:109vh;
        overflow-y:auto
    }
}
[class^=wp-block-] blockquote{
    border-color:#707070
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-c7efc2b{
    max-width:660px
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-7338e5c{
    display:none;
    text-align:right
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-131429e{
    max-width:650px
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-7d701bf{
    max-width:800px
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-0e69b90{
    max-width:847px
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-8794c93{
    max-width:849px
}
:root:not(#_):not(#_):not(#_):not(#_):not(#_) .amp-wp-d994343{
    max-width:500px
}

What other plugins do you have active on your site, if any?

The other plugins I have installed are Akismet, List category posts, SG Optimizer, Securi, Tweet Button for Quotes, and Wordfence.

SG Optimizer is the most likely candidate for a plugin conflict. I’ll try disabling it and re-enabling AMP and then let you know how it turns out.

And that was it. With SG Optimizer disabled the AMP is working fine. I have it set to native mode. This particular site is fairly low traffic, so I’ll leave SG optimizer disabled.