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 siteThe Web Stories Editor for WordPress makes it easy for you to create beautiful Web Stories, and the newly released version 1.5 provides capabilities that make it very easy to embed Web Stories into your site, including a versatile Web Stories block, integration of Web Stories into the theme customization process, and Integration with Classic Editor.
Integrating Web Stories into your content strategy allows you to:
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.
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:
Latest Stories: Display your most recent stories, with filtering and sorting options. The list automatically updates as you publish new stories.
Selected Stories: Display a list of handpicked stories.
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:
Carousel: Carousel of web stories as rectangular cards or circular items.
Grid: Grid view (up to four columns).
List: Stacked list of stories.
Each layout option provides additional settings to give you fine-grained control over how embedded stories appear.
With this new Web Stories block, stories can be displayed anywhere blocks can be used. This includes the upcoming full site editing feature in WordPress, which gives users the ability to edit all elements of a site using Gutenberg blocks. This is great news, as the ecosystem continues to evolve and moving steadily towards Gutenberg-based themes, more and more users will get direct access to the Stories format.
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!
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 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.
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!