NewThe Supreme Bundle: every Divi Supreme plugin, 31% less than buying separately.See what’s inside →

Text Badges module

Divi Text Badges for New, Sale and Beta labels.

Text Badges for Divi 5. A heading and a small badge in one module, with the badge before or after the text.

Supreme Mega Menu

New

Divi Supreme Pro

Updated
Beta

Supreme AI Writer

Lifetime plan

Save 20%

What is the Divi Text Badges module?

Text Badges is a Divi 5 module in Divi Supreme Pro that puts a small label next to a heading. Use it for New product names, Sale and Save 20% offers, Beta features, Updated changelog entries and Hot items in lists.

Type the Main Text and the Badges Text, then choose whether the badge sits before or after it. Pick the heading tag from H1 to H6, set the badge background, text colour, size, border and the gap between the two. Both texts accept dynamic content, and the whole module can be a link.

badge placements

heading levels

default gap

custom CSS

Start from a Text Badges recipe.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Try every Text Badges setting.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Everything Text Badges can do.

Before or after

Badges Placement puts the badge in front of the text or behind it.

Any heading tag

Output the text as H1 to H6 so the page outline stays right.

Your colours

Set the badge background, text colour and border to match your brand.

Gap control

Choose the space between the text and the badge, 7px by default.

Full typography

Separate font settings for the main text and the badge.

Linkable

Turn the whole heading and badge into a link with the Link settings.

Dynamic content

Fill Main Text or Badges Text from a post title, custom field and more.

Translation ready

Main Text, its link and Badges Text are registered for WPML.

Text Badges documentation

Step-by-step guide to badge text, placement, heading levels and badge styling.

Questions about Text Badges.

How do I add a "New" badge next to a heading in Divi?

Add the Text Badges module, type the heading in Main Text and the label in Badges Text. The defaults are "Badges" and "New", with the badge placed after the text.

Can the badge go before the text?

Yes. Set Badges Placement to Before. The default is After.

How do I change the badge colour?

In the Design tab, open Badge Text and set the Background Color (#2ea3f2 by default). The badge text colour, white by default, is in the Badge font settings in the same group.

Which heading tag does the main text use?

H4 by default. Change it with Heading Level in the Main Text font settings, from H1 to H6.

How do I change the space between the text and the badge?

Use Gap under Badge Text. It is 7px by default and goes from 1 to 120, in px, em, rem, % and other units.

Can the badge text come from dynamic content?

Yes. Main Text and Badges Text both support dynamic content, so you can pull in a post title, a custom field or other site data.

Can I make the heading a link?

Yes. Use the Link group in the Content tab to link the whole module.

Can I translate text badges with WPML?

Yes. Main Text, its link and Badges Text are registered for WPML.

Next module, A to Z

Text Divider Module

Related modules

Dual Heading Module

Two-part headings.

Gradient Text Module

Gradient-filled headings.

Text Divider Module

Text between two lines.

4.9 out of 5

Rated 4.9 by Divi designers on Trustpilot. Running on 350,000+ sites.

Point out what is new.

Text Badges comes with 70+ Divi 5 modules and 16 extensions in Divi Supreme Pro.

Divi Supreme