Embedding Web Stories across your site

Web Stories are a great way for content creators to bring enhanced experiences to their users  and thousands of creators and publishers are using them. Tools for creating stories are available to a global audience, and Google products such as Search and Discover are incorporating Web Stories as a first-class content format. And if you are using WordPress we have good news for you! With the release of v1.5 of the Stories Editor for WordPress, you can easily embed Web Stories into your existing site.

Embedding Web Stories in your site

Integrating Web Stories into your content strategy allows you to:

1. Take advantage of both original and third-party story experiences to enhance the quality of your content strategy. You can embed your own Web Stories or Web Stories created by other publishers into your content. 

2. Diversify your traffic sources by combining organic traffic from search results and Discover, with direct traffic from origin, and social sharing. 

The Web Stories block

To embed stories on your WordPress-powered content site , you start by inserting a Web Stories block:

The Web Stories block provides three options for embedding stories into a post or page: 

1. Latest Stories: Display your most recent stories, with filtering and sorting options. The list automatically updates as you publish new stories. 

2. Selected Stories: Display a list of handpicked stories. 

3. Single Story: Embed a single story given its URL. This is a simple option but combined with other blocks, stories can be embedded and displayed in many creative ways.

For the Latest Stories and Selected Stories embedding options, you can specify which Web Stories you want to show, as well as some layout options to control how they are displayed:

1. Carousel: Carousel of web stories as rectangular cards or circular items.

2. Grid: Grid view (up to four columns).

3. List: Stacked list of stories.

Each layout option provides additional settings to give you fine-grained control over how embedded stories appear.

Availability

If you are using any of the following themes, you can start bringing the power of storytelling to your site today:

• The makers of the popular Astra theme announced their integration of stories.

• The Neve theme also provides integration of Web Stories into their theme.

• The Newspack project provides native stories support to the Newspack theme and the new capabilities will be released soon.

• The Web Stories WordPress plugin provides built-in integrations for all WordPress core default themes so that they have this opt-in functionality out-of-the-box.

Below you can take a look at some demo sites using these themes to get a glimpse of what is possible. Can’t wait to see what you would do on your site!

Astra

The Astra theme provides native integration with Web Stories. Check out the Astra theme demo site. In the screenshots below you can again see a selected stories embed using a circle carousel at the top of the theme, a selected stories embed using a box carousel displaying the members of the team, a selected stories embed using a box carousel displaying stories for the menu items, and a selected stories embed using a list layout.

Newspack

Newspack is an all-in-one publishing platform that incorporates industry best practices to help small and medium-sized news organizations produce great journalism. Integration of Web Stories into the Newspack flagship theme is available as of v1.33.0. Take a look at the Newspack theme demo site showcasing embedded stories in different ways. 

What’s next

With the creation capabilities of the Web Stories editor for WordPress and the completely revamped and versatile Gutenberg block, you have everything you need to unleash your creativity and bring the power of the Stories format to your content strategy. And this is just the beginning. Stay tuned and share your stories with the world!