PT
EN FR ES HI

Important: this documentation is not applicable to your currently selected format nation-usa!

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>
Abrir este trecho no playground

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.

Precisa de mais ajuda?

Você já leu este documento várias vezes, mas ainda ficou com dúvidas sem respostas? Talvez outras pessoas pensem da mesma forma. Procure entrar em contato com elas no Stack Overflow.

Ir para o Stack Overflow
Encontrou um bug ou sente falta de um recurso?

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.

Ir para o GitHub