Summer Sale — up to 51% off · Ends Jul 31Claim the deal → Skip to content

Dual Buttons

The Dual Buttons module places two Divi buttons side by side inside a single module, with an optional text or icon connector between them. It is free in Divi Torque Lite and works in both Divi 4 and Divi 5. Use it whenever a section needs two calls to action instead of one.

Building side-by-side buttons with two separate Divi Button modules means fighting with columns, floats, and custom CSS to keep them aligned and evenly spaced. Dual Buttons handles the layout, the gap, and the mobile stacking for you, and gives each button its own independent styling.

How to add the Dual Buttons module

  1. Open a page with the Divi Builder and add a section and row.
  2. Click the + icon, search for Dual Buttons, and insert it.
  3. Set the text and link for each button, then choose a connector style.

Content

Primary

The first button in the pair — the one on the left in a left-to-right layout.

  • Button Text — the label, for example "Get started". Supports dynamic content.
  • Button Link — the destination URL. Supports dynamic content, so it can pull from a post or custom field.
  • Button Link Target — open in the same tab or a new tab.

Connector

The connector sits between the two buttons. It is what turns two buttons into a single "choose one" control.

  • Connector TypeNo Connector for a plain gap, Text for a word, or Icon for a symbol.
  • Connector Text — the word shown between the buttons. Defaults to OR.
  • Connector Icon — any icon from the Divi icon library, used instead of text.

Secondary

The second button, with the same three options as the primary: Button Text, Button Link, and Button Link Target.

Design

General

  • Button Alignment — left, center, or right. This is a responsive option, so you can center the pair on desktop and left-align it on phones.
  • Button Gap — the space between the two buttons, from 0 to 250px. Defaults to 40px.

Primary Button and Secondary Button

Each button gets its own complete set of Divi button controls — text size and colour, background, border width and colour, border radius, icon and icon placement, padding, plus full Border and Box Shadow groups. Because the two are styled separately, the standard pattern works out of the box: a solid primary button and a ghost or outline secondary.

Connector

  • Text Size and Text Color — typography for the connector word or icon.
  • Background — fill colour behind the connector.
  • Size and Radius — set both to make a circular badge; a radius of half the size gives a perfect circle.
  • Border Width and Border Color — outline the connector badge.

Tip

Give the two buttons different visual weight rather than making them identical. A filled primary and an outlined secondary tells visitors which action you actually want them to take, and it reads faster than two matching buttons that force people to stop and compare both.

Frequently asked questions

Is the Dual Buttons module free?

Yes. Dual Buttons is included in Divi Torque Lite, which is free on WordPress.org. No licence key and no Pro upgrade are needed to use it.

How do I stack the two buttons on mobile?

The buttons already wrap onto separate lines when the row gets too narrow. To control the result, switch Button Alignment to the phone view and set it to centre, then reduce Button Gap on phone so the stacked buttons sit closer together.

Can I put an icon between the two buttons instead of text?

Yes. Set Connector Type to Icon and pick any icon from the Divi library. Style it with the connector's size, radius, background, and border options to turn it into a circular badge sitting between the buttons.

Does Dual Buttons work in Divi 5?

Yes. Dual Buttons is built natively for Divi 5 and also runs in Divi 4. Existing Divi 4 layouts that use the module convert automatically when you open them in the Divi 5 Builder.

Can I use more than two buttons?

No — the module is built for exactly two, and that constraint is deliberate. Two options is a choice; more than two is a menu that slows people down. If you genuinely need three or more actions in a row, place individual Divi Button modules in separate columns instead.