AMPHTML stories by Example

Learn how to create visual stories with AMPHTML.

Introduction

The basic building block of AMP stories.

AMP Story Hello World

Learn how to create your first AMP Story.

Features

Introducing stories in AMP how they work

Animations

AMP Stories support animations out-of-the-box.

Layouts

The amp-story-grid-layer provides a few pre-defined layout templates.

Media

Stories support only a subset of the media types available in AMPHTML.

Monetization

Monetization strategies for AMP Stories.

DoubleClick

In an AMP story, you cannot put an amp-ad directly onto the page, instead, all ads are fetched and displayed by the amp-story-auto-ads extension.

Publisher Served

In an AMP story, you cannot put an amp-ad directly onto the page, instead, all ads are fetched and displayed by the amp-story-auto-ads extension.

Visual Effects

Ken Burns

Best known for his work on documentaries, Ken Burns developed a signature effect which consisted of a combination of panning and zooming over an image.