AMP stories is a visual storytelling format for the open web. The stories allow readers to immerse in a tappable, full-screen content. The format enables publishers and marketers to create visual content that is fast, open, and user-first.
This tutorial helps you to add the stories on the AMP version and It requires the amp-story extension.
1. Download and Install the extension from the account area.
2. Upload and Activate it.
3. Now the AMP Stories option will be displayed in the WordPress options panel.
4. After clicking the AMP story option you will be able to see the add your new story options.
5. Also, you will get the 4 different designs of AMP story, in which you will get the upload a video option.
6. Now you can create AMP stories as many as you want.
7. Click on Add New Slide button like below the screenshot.
Design1 provides the following fields title, description, logo image, Background Image which you can set as per your requirement.
Add Animation:
Design1 provides the Animation for title, description, logo image, which you can set as per your requirement.
you can give Animation for Title
Enable Animation: If you want Animation for title then enable this option.
Animation: select Animation type here.
Duration: Enter duration time in this field.
Delay: Enter delay time in this field.
Design2 provides the following fields title, description, Background Image which you can set as per your requirement.
Design3 provides the following fields title, description, Background Image which you can set as per your requirement.
Design4 provides the following fieldsBackground video which you can set as per your requirement.
8. Click on the “publish” button.
In the above setting, you can set this option in AMP story like Publisher Logo, Portrait Poster, Landscape Poster, Background Audio.
AMP story Custom CSS: In this option, you can add Custom CSS for AMP story.
Follow the simple steps:
First, Go to your WordPress admin area and click on Settings –>Permalink.
AMP Stories Slug: If you want to change the slug name of AMP Story then you can enter slug name in this field and click on the save changes button.
That’s it for this tutorial!
We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.
If you want to add an AWeber form in AMP then first you need to…
Webpushr is the fastest growing web push notifications platform that marketers love & developers rely…
Follow these steps to add Adobe Analytics in AMP Step 1: Go to WordPress Admin Area -> AMP…
Core Web Vitals are the subset of Web Vitals that apply to all web pages,…
The following reasons can be shown for non-indexing. Server error (5xx) Your server returned a 500-level…
We have added the Google Analytics 4 ( GA 4 ) integration in AMPforWP v1.0.80.…