Important: this documentation is not applicable to your currently selected format websites!
amp-story-player
Description
A player for embedding and playing your favorite stories in your own AMP site.
Required Scripts
<script async custom-element="amp-story-player" src="https://cdn.ampproject.org/v0/amp-story-player-0.1.js"></script>
Supported Layouts
Usage
Use 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.
<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/"> <img src="https://amp.dev/static/samples/img/story_dog2_portrait.jpg" width="360" height="600" loading="lazy" data-amp-story-player-poster-img> Stories in AMP - Hello World </a> </amp-story-player> </body>
Specify embedded stories
The <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.
Attributes
layout
Supports any of the size-defined layouts:
- fixed
- fixed-height
- responsive
- fill
Validation
See amp-story-player rules in the AMP validator specification.
Vous avez lu ce document une douzaine de fois mais il ne répond pas à toutes vos questions ? D'autres personnes ont peut-être eu le même sentiment. Contactez-les sur Stack Overflow.
Se rendre sur Stack Overflow Vous avez trouvé un bug ou une fonctionnalité manquante ?Le projet AMP encourage fortement votre participation et vos contributions ! Nous espérons que vous deviendrez un membre régulier de notre communauté open source, mais nous serons également ravis de recevoir des contributions ponctuelles concernant les questions qui vous intéressent particulièrement.
Se rendre sur GitHub