Felix Arntz, a member of the WordPress Core Performance Team, announced the release of a new experimental plugin called View Transitions. It uses the cross-document View Transitions API to add better transition effect when moving between pages on your WordPress site.
A Closer Look at the View Transitions Plugin
The View Transitions plugin, once activated, enables a smooth fade transition when navigating between pages on a WordPress site, as Felix outlined, “ As soon as you have activated the plugin on your WordPress site and navigate between a few pages of your site, you’ll notice that the plugin implements a gentle fade effect for the transition, creating a more graceful and visually engaging user experience.”
Traditionally, moving from one page to another causes a hard reload, which can affect the user experience. This plugin uses the cross-document View Transitions API to create a better browsing experience, similar to what users have experienced in modern apps. It works automatically once activated, without requiring major changes to site structure.
Here’s how the page transition looks without the plugin activated:
Now, here’s with the plugin activated:
Since how the transitions look depends on each theme’s design, future updates will allow themes to enable and customize these animations using WordPress’s theme support system.
As Felix highlighted, “ Because the nature and style of transitions can be heavily dependent on a theme’s specific layout and design, the long-term vision is for themes to opt in and customize this behavior. This is facilitated through the WordPress theme support API, for instance by calling add_theme_support( ‘view-transitions’ ).”
But for now, the plugin applies the transitions site-wide automatically, regardless of the theme you use.
Various Ways to Configure View Transitions
During this early experimental phase, the plugin’s configuration can be accessed under Settings > Reading > View Transitions.
If the View Transitions plugin becomes part of the WordPress Core in the future, customization will only be possible through code using the theme support API, as Felix explained, “ Should view transitions make their way into Core, customization would solely be managed through code via the theme support API.”
While the admin settings allow limited customization, the recommended way to adjust view transitions is via the theme support API. In order to enable view transitions in your theme, add this to your functions.php:
function mytheme_setup() {
add_theme_support( 'view-transitions' );
}
add_action( 'after_setup_theme', 'mytheme_setup' );
For more control, you can pass options to customize animations, post selectors, and so on, as shared by Felix.
One thing to keep in mind for now is that settings adjusted through the admin interface will override any view transition options set in your theme’s code with add_theme_support(). Currently, most of the modern browsers support this API, and the browsers that don’t will load the pages with the normal transition effect even while the plugin is active.
How You Can Contribute
WordPress developers and maintainers can test the plugin by experimenting with it via add_theme_support( ‘view-transitions’ ). Feedback from testing out the plugin from the dashboard can also be provided.
For suggestions, new features, and bug reports, make use of the WordPress Core Performance Team’s GitHub repository.
Now, for everything related to troubleshooting, create a new topic on the support forum.