---
title: "Kadence Page Transitions"
source: "https://docs.nexcess.com/software/kadence/page-transitions/"
description: "Kadence Page Transitions enables smooth animated transitions between pages on your website. This feature enhances the user experience by replacing regular page…"
vertical: "Software"
area: "Kadence"
date: "2025-06-13"
last_modified: "2026-07-02"
---

# Kadence Page Transitions

**Kadence Page Transitions** enables smooth animated transitions between pages on your website. This feature enhances the user experience by replacing regular page loads with visually appealing animations as users navigate from one page to another.

The ***Kadence Page Transitions** plugin* is only available with the **Kadence** **Ultimate** or **Lifetime** **Ultimate** **Plan**. You can purchase either the Ultimate or the Lifetime Ultimate Plan by [clicking here](https://www.kadencewp.com/pricing/).

![Page Transition Demo](https://docs.nexcess.com/wp-content/uploads/2026/06/Page-Transition-Demop.gif)

Getting Started

Once you have access to the Kadence Full Plan or Lifetime Plan, you can download Kadence Page Transitions from your Kadence [Downloads & License](https://www.kadencewp.com/my-account/downloads/) page.

![Downloads and licenses](https://docs.nexcess.com/wp-content/uploads/2026/06/Downloads-and-licenses-1024x601-1.jpg)

Scroll down to the **Classic** **Plugins** tab and expand it. Then, you will see the **Kadence** **Page** **Transitions** plugin in your Product List. You can download the ZIP file. Be sure to leave the file compressed and don’t unzip it.

![Classic Plugins](https://docs.nexcess.com/wp-content/uploads/2026/06/Classic-Plugins.gif)

You can upload your ZIP file by going to your **WordPress Dashboard -> Plugins -> Add New Plugin**. Then you can click on the **Upload** **Plugin** button at the top of the page. This will allow you to choose a file. Select the Kadence Page Transitions ZIP file downloaded from your Kadence Account.

![Upload Plugin](https://docs.nexcess.com/wp-content/uploads/2026/06/Upload-Plugin.jpg)Once you have uploaded your plugin and activated it, you are all set to get started using Kadence Page Transitions.

Page Transition Settings

Access the Kadence Page Transition settings by going to the Dashboard -> Appearance -> Kadence -> Page Transitions page. Here, you can control how page transitions will occur across your website.

![Page Transition Settings](https://docs.nexcess.com/wp-content/uploads/2026/06/Page-Transition-Settings-scaled-1.jpg)

**Select Transition In:** Set the transition effect you wish to use. See the [examples](#examples) below.  
  
**Transition In Duration:** Set the coming in transition duration for the animation. (This is the first part of the transition effect.)  
  
**Transition Out Duration:** Set the out-going transition duration for the animation. (This is the second part of the transition effect.)  
  
**Overlay Color:** Assign a specific overlay color for the transition overlay.  
  
**Site Background Color:** When the site background is exposed, you can set a Site Background Color to specify which color should show.  
  
**Enable Loading Spinner:** Enable this option if you wish for the loading spinner to show in between transitions.  
  
**Enable for Mobile:** Turn this setting on or off based on whether you wish for mobile users to see the transition.

![Transition Settings 2](https://docs.nexcess.com/wp-content/uploads/2026/06/Transition-Settings-2-1024x951-1.jpg)

Examples

Here is an example of each available **Kadence** **Page** **Transition**.  
  
**Overlay Slide In/Out Right:**

![Page Transition Demo](https://docs.nexcess.com/wp-content/uploads/2026/06/Page-Transition-Demop.gif)

**Zoom In/Out:**

![In:Out](https://docs.nexcess.com/wp-content/uploads/2026/06/InOut.gif)

**Fade Up In/Down Out:**

![Up In:Down Out](https://docs.nexcess.com/wp-content/uploads/2026/06/Up-InDown-Out-1024x583-1.gif)

**Fade In/Out:**

![Fade In:Out](https://docs.nexcess.com/wp-content/uploads/2026/06/Fade-InOut.gif)