A player for embedding and playing your favorite stories in your own AMP site.
<script async custom-element="amp-story-player" src="https://cdn.ampproject.org/v0/amp-story-player-0.1.js"></script>
amp-story-player to embed and play stories within an AMP webpage.
Embed in an AMP page
The code snippet below demonstrates an embed of
<amp-story-player> in a AMP webpage.
[example preview="top-frame" playground="true"]
<head> <script async src="https://cdn.ampproject.org/v0.js"></script> <script async custom-element="amp-story-player" src="https://cdn.ampproject.org/v0/amp-story-player-0.1.js" ></script> </head> <body> <amp-story-player layout="fixed" width="360" height="600"> <a href="https://preview.amp.dev/documentation/examples/introduction/stories_in_amp/" style="--story-player-poster: url('https://amp.dev/static/samples/img/story_dog2_portrait.jpg')" > Stories in AMP - Hello World </a> </amp-story-player> </body>
Specify embedded stories
<amp-story-player> component contains one or more
<a> tags. Point the href attribute of each to the story URL.
Place the story's title within the
<a> tag. This provides a better user experience and allows search engines to crawl embedded stories.
Supports any of the size-defined layouts:
See amp-story-player rules in the AMP validator specification.
You've read this document a dozen times but it doesn't really cover all of your questions? Maybe other people felt the same: reach out to them on Stack Overflow.Go to Stack Overflow Found a bug or missing a feature?
The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.Go to GitHub