---
title: "How to Add a Custom Cursor in WordPress?"
url: https://nexterwp.com/docs/add-a-custom-cursor-in-wordpress/
date: 2024-12-16
modified: 2026-04-14
author: "Aditya Sharma"
description: "Sometimes the default cursor might not match your website's design aesthetic. In such cases, adding a custom cursor can enhance the overall user experience and make your website more unique..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-a-Custom-Cursor-in-WordPress_-1024x519.jpg
word_count: 623
---

# How to Add a Custom Cursor in WordPress?

## Key Takeaways

- Nexter Blocks includes a premium Mouse Cursor block that adds a custom mouse cursor to a WordPress website, and it requires the PRO version of Nexter Blocks.
- Mouse Cursor block targets five cursor areas, including Body, Row, Column, Block, and Widget, with Row and Column working only with the Container block of Nexter Blocks.
- Mouse Cursor block offers four cursor types: Cursor Icon, Follow Image, Follow Text, and Follow Circle.
- Mouse Cursor block supports two pointer types in Icon Type, Predefined and Custom, and the Mouse Cursor Click toggle adds a different mouse cursor image for click.

Sometimes the default cursor might not match your website's design aesthetic. In such cases, adding a custom cursor can enhance the overall user experience and make your website more unique and visually engaging.

With the Mouse Cursor block from Nexter Blocks, you can easily add a custom mouse cursor to your WordPress website.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-custom-cursors/)

## Required Setup

- Make sure the default WordPress Block editor is active. 

- You need to have the [Nexter Blocks](https://wordpress.org/plugins/the-plus-addons-for-block-editor/) plugin installed and activated.

- This is a Premium block, and you need the [PRO version of Nexter Blocks](https://nexterwp.com/pricing/?utm_source=tpag&utm_medium=docs&utm_campaign=text).

- Make sure the Mouse Cursor block is activated, to verify this visit Nexter → Blocks → and Search for Mouse Cursor and activate.

## Learn via Video Tutorial

https://www.youtube.com/watch?v=2_Z0ZN4jvvc&t

## How to activate the Mouse Cursor Block?

Go to 

- **Nexter **→ **Blocks **

- **Search **the block name** **and** turn on the toggle**.

![](https://nexterwp.com/wp-content/uploads/2024/12/mouse-cursor-activation-new-1.png)

## Key Features

- **Cursor Area** - You can target a custom cursor for a column, section, container, widget and body.

- **Multiple Cursor Types** - You can choose from multiple cursor types such as cursor icon, follow text, follow image and follow circle.

- **Two Pointer Type** - You can use predefined icons or custom images as a mouse pointer.

## How to Use the Mouse Cursor Block?

Add the Mouse Cursor block to the page.

Then click on the **Design from Scratch** button to design the layout from scratch.

![](https://nexterwp.com/wp-content/uploads/2024/12/mouse-cursor-design-type-1024x191.png)

> *Note: By clicking on the Import Pre-Designed Template button, you can [import a preset template](https://nexterwp.com/docs/import-templates-in-nexter/#Import-Preset-Designs-for-Specific-Blocks-in-Nexter) and customize it as per your requirements.*

By enabling the **Backend Design Box** toggle, you can see the custom cursor in the backend.

From the **Cursor Area** dropdown, you have to select the area where you want to add the custom cursor. Here you’ll find five options - 

- **Body** - This will change the mouse cursor for the entire body.

- **Row** - To [change the mouse cursor in a row](https://nexterwp.com/docs/change-the-mouse-cursor-for-a-row-in-wordpress/) only. This will only work with the Container block of Nexter Blocks.

- **Column** - To change the mouse cursor in a column only. This will only work with the Container block of Nexter Blocks.

- **Block** - With this option, you can [change the mouse cursor for a block](https://nexterwp.com/docs/change-the-mouse-cursor-for-a-block-in-wordpress/) only.

Select the option as per your requirements, let’s select the Body here.

Then from the **Type** dropdown, you have to select the cursor type. Here you’ll find four options - 

- **Cursor Icon** - To use an icon or image as a cursor.

- **Follow Image** - To [create a follow image cursor](https://nexterwp.com/docs/add-a-follow-image-cursor-in-wordpress/).

- **Follow Text** - To [create a follow text cursor](https://nexterwp.com/docs/add-a-follow-text-cursor-in-wordpress/).

- **Follow Circle** - To [create a follow circle cursor](https://nexterwp.com/docs/add-a-follow-circle-cursor-in-wordpress/).

Select the option as per your requirements, let’s select the Cursor Icon here. 

From the **Icon Type** section, you have to select the icon type. Here you’ll find two options - 

- **Predefined** - To add predefined icons.

- **Custom** - To use a custom image as a mouse cursor.

You’ll find different options to add the cursor based on your selection. Let’s select Custom here.

In the **Cursor Icon** section, you have to add your image.

Then, by enabling the **Mouse Cursor Click** toggle, you can add a different mouse cursor image for click.

## How to Style the Mouse Cursor Block?

To style the Mouse Cursor block, you’ll find all the options in the Style tab. 

**Follow Text** - You’ll see this option only when the Follow Text type is selected. From here, you can style the cursor’s follow text.

![](https://nexterwp.com/wp-content/uploads/2024/12/mouse-cursor-style-new.png)

**Follow Circle** - You’ll see this option only when the Follow Circle type is selected. From here, you can style the cursor’s circle. You’ll see different styling options based on the selected follow circle style.

Advanced options remain common for all our blocks, you can explore all it options from here.

[View Advanced tab tutorial.](https://nexterwp.com/docs/add-advanced-tab-in-wordpress/)