How to Use the AMP Story Page Generator Tool

This tool helps you quickly and easily generate custom AMP Web Story pages for your blog, news site, or content project.
Follow these simple steps to create your AMP story code:

Step 1: Fill in the Cover Page

• Cover Image URL: Add the main image for your story cover. Recommended size: 1080×1920 with good resolution.
• Cover Image Alt Text: Describe the image briefly for SEO and accessibility.
• Logo Image URL: Add your brand logo or website logo (recommended width: ~160px).
• Date: Enter the publication date (e.g., May 7, 2025).
• Heading: Enter the main title of your story.
• Author Name: Add your name or your website/brand name.

Step 2: Add Content Pages

• By default, the form includes Page 1.
• For each content page, add:
  • Image URL: Background image for the page.
  • Image Alt Text: Short description of the image.
  • Heading: Title or headline text.
  • Paragraph: Supporting text or story content.
  • Photo Credit Text: (e.g., Photographer's name, website, or source).

• Need more pages?
  Click the "ADD ANOTHER PAGE" button to dynamically add as many pages as you want.
  Fill in the fields for each new page.

Step 3: Fill in the Last Page

• Image URL: Add a final image for the closing page.
• Image Alt Text: Description for the image.
• Summary Text: Thank you message or closing note (e.g., Thanks for reading!).
• Next Story Heading: Title inviting users to explore more content (e.g., Read Our Latest Story).
• CTA Link URL: Add a call-to-action link to direct readers to your next story, website, or related article.

Step 4: Generate the Code

• Once all fields are filled, click the "GENERATE CODE" button.
• The generated AMP Story HTML code will appear in the textarea under the "Generated Code" section.

Step 5: Copy & Use

• Click the "COPY CODE" button to copy the generated code to your clipboard.
• Paste the code into your AMP HTML file, CMS, or your website’s editor.

Tip: Review and test your story on mobile and desktop to make sure it looks great.

Extra Options

• Click the "RESET" button anytime to clear the form and start fresh.

What this tool helps with:

• Saves time by auto-creating AMP-compliant story pages.
• Ensures your cover, content, and last page follow best practices.
• Generates clean HTML ready to use on your AMP story project.