ES
EN FR HI PT

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>
Abrir este fragmento en 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.

¿Necesita ayuda adicional?

¿Ha leído este documento una docena de veces pero realmente no responde todas sus preguntas? Quizás otras personas piensen lo mismo: póngase en contacto con ellas en Stack Overflow.

Ir a Stack Overflow
¿Encontró un error o considera que falta una función?

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 a GitHub