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.
لقد قرأت هذا المستند عشرات المرات ولكن ألم يُجِب عن جميع أسئلتك؟ ربما حصل ذات الأمر مع أشخاص آخرين: تواصل معهم على Stack Overflow.
الذهاب إلى Stack Overflow هل وجدت خطأ أو تفتقد لميزة؟يشجع مشروع AMP مشاركتك ومساهمتك بشدة! ونأمل أن تكون مشاركًا دائمًا في مجتمعنا مفتوح المصدر، ولكننا نشجع أيضًا المساهمات التي تحدث لمرة واحدة في الأمور التي تتحمس لها.
الانتقال إلى GitHub