Embedding Web Stories | How to embed single webstory | embed single wordpress webstory
Are you looking for an engaging and visually stunning way to share your content with your website visitors? Look no further than web stories! Web stories, also known as AMP stories, are immersive and interactive visual stories that can be embedded in your website or any other webpage. In this blog post, we will walk you through the steps of embedding a web story in your website.
Step 1: Add the necessary JavaScript to your website
The first step in embedding a web story is to add the necessary JavaScript to your website. You will need to add the following code above the </head> tag of your website:
<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>
This code is required for the web story to function properly on your website.
Step 2: Place the web story player where you want to display the story
The next step is to place the web story player where you want to display the story. To do this, simply copy and paste the following code where you want the web story to appear:
<amp-story-player layout="fixed" width="300" height="533" amp-cache="cdn.ampproject.org"> <a href="Story_URL"> <img src="Story_poster_image" width="300" height="533" loading="lazy" data-amp-story-player-poster-img> </a> </amp-story-player>
Replace Story_URL with the URL of your web story and Story_poster_image with the URL of the poster image for your web story. The poster image is the image that will be displayed before the web story is played.
And that’s it! With these two simple steps, you can embed a web story in your website and provide your visitors with an engaging and interactive way to consume your content.
web stories are a great way to make your website content more engaging and visually appealing. By following the steps outlined in this blog post, you can easily embed a web story in your website and provide your visitors with an immersive and interactive experience.