Skip to content
Get Divi Torque

Native Divi 5 ModuleFree

Divi Dual Buttons

Offer two clear calls to action side by side.

Why use the Divi Dual Buttons module?

Two calls to action next to each other is one of the most common things a page needs, and one of the most annoying to build. Two Divi button modules in one row means two columns, two sets of spacing, and an alignment that breaks the moment the text length changes.

Dual Buttons is one module that holds both. One gap setting, one alignment setting, and an optional connector between them. Each button keeps its own text, link, colours and border.

The pair beside this is the live module.

Get the free plugin
OR
Compare plans

What you get out of it

One module, not two columnsBoth buttons live in the same module, so the pair stays together at every width instead of drifting apart.A connector between themLeave it out, put a word in it, or drop in an icon. The choice is a single setting.The two never have to matchEach button has its own full Divi button design group, plus its own border and box shadow.Links behave separatelyEach button takes its own URL and decides on its own whether to open in a new tab.Alignment and gap in one placeLeft, centre or right for the pair, and a gap from 0 to 250 pixels between them.Free, and native on Divi 5It ships in Divi Torque Lite on WordPress.org and in Divi Torque Pro, built on the Divi 5 engine rather than shimmed from Divi 4.

Everything the Divi Dual Buttons module does

Every option below ships in the free plugin, and in Divi Torque Pro.

Two buttons in a single moduleSeparate text for each buttonSeparate link for each buttonNew tab or same tab, set per buttonConnector between them: none, text or iconAny text in the connectorAny icon from the Divi icon pickerConnector size and corner radiusConnector background and text colourConnector text sizeConnector border width and colourAlignment: left, centre or rightGap between the buttons, 0 to 250pxA full Divi button design group per buttonBorder and box shadow per buttonCustom CSS hooks for primary, secondary and connector

See the Divi Dual Buttons in action

Every pair below is the live module, not a picture of one. The three connector options are the whole set: none, text, icon.

No Connector

The default. Two buttons and the gap between them, nothing else.

Get the plugin
See all modules

Text

A short word sits between them. It is a text field, so it can say anything.

Monthly
OR
Yearly

Icon

Any icon from the Divi picker, at the size and colour you choose.

Download
5
Documentation

Where the pair sits

One setting moves both buttons together, so they never drift out of line with each other.

left

Left is the default, and the one that lines up with body copy above it.

Primary action
Secondary action

center

Centre suits a hero or a closing call to action.

Primary action
Secondary action

right

Right pairs with an image or a form sitting on the other side.

Primary action
Secondary action

Two buttons, two designs

Each button carries its own design group, so the primary can be loud and the secondary can stay out of the way.

Solid and outline

The usual pairing. One button carries the weight, the other stays quiet.

Start free
Compare plans

Two pills

Radius is part of each button’s own design group, so both can be round.

Buy Pro
Read the docs

Different weights

One raised, one flat. Each button has its own box shadow setting.

Get started
Talk to support

On a dark band

Colours are set on the buttons themselves, so a dark section is a settings change rather than a stylesheet.

On a dark section

Both buttons take their own background and text colour, so a dark band needs no custom CSS.

Get the free plugin
See the modules

One opens a new tab

Each link carries its own target. Here the second button opens in a new tab, the first does not.

Pricing
OR
WordPress.org

The connector is its own element

Size, radius, background, border and text colour are all separate settings.

Round

Radius at 999px with a background gives a circular chip between the buttons.

Yes
OR
No thanks

Square

Drop the radius to zero and the same chip becomes a square tile.

Grid
/
List

Outlined

Border width and colour are separate settings, so an outline needs no fill.

Import
$
Export

Wider gap

The gap runs from 0 to 250 pixels and is measured between the two buttons.

Before
5
After

Building one takes about a minute

Three steps, and none of them involve custom CSS.

1Drop in the moduleAdd Dual Buttons to any row. It arrives with both buttons already in place, so there is nothing to wire up.2Write the two buttonsPrimary and Secondary each have their own panel: the text, the link, and whether it opens in a new tab.3Choose the connectorPick none, text or icon in the Connector panel, then set the gap and the alignment for the pair.

Questions people ask first

Short answers, all of them checked against what the module actually does.

Is the Dual Buttons module free?Yes. It ships in Divi Torque Lite on WordPress.org, and in Divi Torque Pro. Nothing on this page is behind the paid plugin.Does it need Divi 5?It is a native Divi 5 module, built on the Divi 5 engine rather than shimmed from Divi 4. Layouts built with the Divi 4 version convert across.Can the two buttons look completely different?Yes. Each one has its own Divi button design group, its own border group and its own box shadow group, so nothing is shared between them.Can I put an icon between the buttons?Yes. Set the connector to Icon and pick any icon from the Divi icon picker. Its size, colour, background, radius and border are separate settings.Can one button open in a new tab and the other not?Yes. New tab or same tab is set per button, so a download link and an internal link can behave differently in the same pair.Can I add a third button?No. This module holds exactly two. For a longer row of actions, use separate Divi Button modules or place a second Dual Buttons module below it.

Related modules

Other modules in the same plugin, included with every license.

Icon Box

Pair icons with text to present services and features clearly.

Feature Box

Highlight key information with icon-and-text boxes.

Gradient Heading

Add eye-catching gradient headings without touching CSS.

Get Dual Buttons and 78 more.

One license, every module and extension, native on Divi 5.

Get 50% off Lifetime