Video not visible on AMP page when using youtube-embed tool

I’m experiencing issues with video display in the AMP page version, when using the youtube-embed tool. I have just set up a local dev environment, installed using npm/ghost-cli to test this using version 3.33.0, and the default ‘caspar’ theme. The same issues are happening on our hosted ghost service.

To reproduce the steps, use the latest version to create a post and insert youtube embed content, then visit the post url with ‘/amp’ appended to see the AMP version of the page. The video is not visible.

I have made a few tests, and found that it is more reliable to use the ‘embed’ html code provided on youtube and insert this directly into an ‘html’ block in the post. This generates a visible video on the AMP version of the post page.

I have included a screenshot that shows using both the Youtube-Embed tool in ghost, and the html code provided by youtube share ‘embed’ feature. I have higlighted the difference in code output that appears in the source code.

The ghost embedding tool seems to be missing the ‘iframe’ part of the amp-video tag, plus it is not displaying when wrapped by the ‘card’ ui.

Am I doing something wrong? It seems like the youtube-embed tool is not working for AMP pages.

1 Like

For reference, here is a comparison screenshot of the HTML source for the non-AMP page:

1 Like