---
title: "How to Add Text Based Preloader Animation in WordPress?"
url: https://nexterwp.com/docs/text-based-preloader-animation-in-wordpress/
date: 2023-04-10
modified: 2026-04-15
author: "Aditya Sharma"
description: "Are you interested in showing a Text Based Preloading Animation on your WordPress website? Loading times can be a frustrating experience for website visitors, and providing visual feedback can help..."
image: https://nexterwp.com/wp-content/uploads/2024/05/text-based-preloader-animation-in-wordpress-1024x519.jpg
word_count: 249
---

# How to Add Text Based Preloader Animation in WordPress?

## Key Takeaways

- Nexter Blocks Preloader block adds text based loading animations on a WordPress website, displaying a short text message or phrase while a page loads.
- Pre Loader tab includes a repeater item under Layers, where the user selects Text from the Select Type dropdown and enters loading text in the Content field.
- Text as Loader toggle turns the text into a loader and slowly changes the text color from one color to another, with typography, color, and text loader color options available.

Are you interested in showing a Text Based Preloading Animation on your WordPress website? Loading times can be a frustrating experience for website visitors, and providing visual feedback can help reassure them that the site is still loading. One way to do this is by adding a text-based preloader animation to your WordPress website. This type of animation displays a short text message or phrase while a website or page loads.

With the Preloader block from the Nexter Blocks, you can add amazing text based loading animations on your WordPress website.

*To check the complete feature overview documentation of the Nexter Blocks* Preloader block, [click here](/docs/preloader-block-settings-overview/).

***Requirement  - This block is a part of the Nexter Blocks***, make sure its installed & activated to enjoy all its powers.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-preloader-animation-and-page-transitions/)

To do this, add the Preloader block on the page or template, in the **Pre Loader** tab, you’ll find a repeater item under **Layers**.

Open the item and select **Text **from the **Select Type** dropdown.

In the **Content** field, you can add your loading text.

![](https://nexterwp.com/wp-content/uploads/2023/04/preloader-type-text-new.png)

Then, you can turn your text into a loader from the **Text as Loader** toggle. As the page loads, it will slowly change the text color from one color to another.

You’ll find options to manage the text typography and color as well. 

Once you turn on the **Text as Loader** toggle, you’ll find an additional color option for the text loader color.

Also, check [How to Add Image Preloader Animation in WordPress](https://nexterwp.com/docs/image-preloader-animation-in-wordpress/).