---
title: "How to Add Preloader & Page Loading Animations with Page Transitions in WordPress (Gutenberg) [Video Tutorial]"
url: https://nexterwp.com/docs/add-preloader-page-loading-animations/
date: 2023-07-05
modified: 2026-04-14
author: "Aditya Sharma"
description: "https://www.youtube.com/watch?v=9NIAO5YVIJU Video Duration: 31 : 50 Video Overview In this WordPress tutorial, we will see how to add Preloader and Page Transition Effects in Block Builder with Image, GIF, Lottie..."
image: https://nexterwp.com/wp-content/uploads/2024/05/add-preloader-page-loading-animations-1024x519.jpg
word_count: 157
---

# How to Add Preloader & Page Loading Animations with Page Transitions in WordPress (Gutenberg) [Video Tutorial]

## Key Takeaways

- Nexter Blocks adds preloader and page transition effects in Block Builder with Image, GIF, Lottie JSON file, and Text.
- Nexter Blocks lets users add page loading animations without any coding knowledge and includes progress bars plus multiple animations in a single frame.
- Nexter Blocks supports page transitions like Fade, Slide, Duo Move, Triple Swoosh, and Simple, with both In and Out transitions and maximum or minimum load time seconds.

https://www.youtube.com/watch?v=9NIAO5YVIJU

##### Video Duration: 31 : 50

## Video Overview

In this WordPress tutorial, we will see how to add Preloader and Page Transition Effects in Block Builder with Image, GIF, Lottie JSON file, Text etc. Using this WordPress Preloader plugin, you can add any page loading animations without any coding knowledge. The best alternative for Preloader Plus Plugin.

Complete feature-packed loading page animations with progress bars, and combine multiple animations in a single frame with each other.

▶ Live Block Demo - [https://nexterwp.com/nexter-blocks/blocks/wordpress-preloader-animation-and-page-transitions/](https://nexterwp.com/nexter-blocks/blocks/wordpress-preloader-animation-and-page-transitions/)

Exclusive Features
✅ Upload any Image in Preloader
✅ Add Icons, Text, Images, Custom Code CSS, Short code, Predefined
✅ Progress Bar Loading Animations
✅ Exclude Loading on Header, or any Section with Custom Class
✅ Page Transitions like Fade, Slide, Duo Move, Triple Swoosh & Simple
✅ Add both In and Out Page Transitions
✅ Adjust Maximum or Minimum Load Time Seconds

⚡ Plugin Website - [https://nexterwp.com/](https://nexterwp.com/)
⚡ Get the Plugin [https://nexterwp.com/nexter-blocks/](https://nexterwp.com/nexter-blocks/)
USE CODE " YOUTUBE10 " TO ENJOY 10% DISCOUNT