---
title: "How to Add Underline Overlay Effect on Text in WordPress?"
url: https://nexterwp.com/docs/add-underline-overlay-effect-on-text-in-wordpress/
date: 2024-12-05
modified: 2026-03-31
author: "Aditya Sharma"
description: "Do you want to add unique underline text effects in WordPress? Adding custom underlines to your text not only enhances the design but also helps you highlight important sections, making..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-Underline-Overlay-Effect-on-Text-in-WordPress_-1024x519.jpg
word_count: 291
---

# How to Add Underline Overlay Effect on Text in WordPress?

Do you want to add unique underline text effects in WordPress? Adding custom underlines to your text not only enhances the design but also helps you highlight important sections, making them stand out and improving readability.

With the Advanced Typography block from Nexter Blocks, you can easily add an image reveal effect on text in WordPress.

*To check the complete feature overview documentation of the Nexter Blocks Advanced Typography block,[ click here](https://nexterwp.com/docs/add-advanced-typography-in-wordpress/).*

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

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-hotspot-pinpoint-image/)

To do this, add the Advanced Typography block to the page and follow the steps - 

1. In the **Advanced Typography** tab, select **Normal** or **Multiple** from the **Select Option** section.

Let’s select Normal.

2. Then add the text in the **Text** field.

3. Then go to the **Advance Underline Options** tab under the **Style** tab.

> *Note: In the Multiple option you’ll find the Advance Underline Options in each text repeater item.*

4. From the **Select** **Underline **dropdown, you have to select the underline type. Here you’ll find three options - 

- **None** - This will not add any underline. 

- **Classic** - With this option, you can add some classic underlines like underline, overline and line through for normal and hover states. You can also add different underline styles as well. 

- **Overlay** - With this option, you can add unique underline overlay effects.

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

5. From the **Overlay Style** dropdown, you can select different predefined overlay styles.

Then, from the Normal and Hover tab, you can customize the style further.

> *Note: Depending on the selected style you’ll find different options for normal and hover states.*