1. Home
  2. Docs
  3. Happy Elementor Addons Fr...
  4. Widgets
  5. Dual Button

Dual Button

How To Use A Dual Button Widget Of Happy Elementor Addons

The Dual Button widget lets you add two flexible and trendy buttons to your webpage. These buttons will make your webpage more classy and sleek.

Using the Dual Button:

You can see the below video to get an insight into how you can use the  Dual Button Widget to create beautiful designs. Or you can follow the documentation, whichever you find convenient.

Step 1:

Select the Dual Button widget from the menu bar on the left-hand side of your screen then drag and drop it in the selected area.ss1 2

Step 2:

You can set the texts of your buttons and connector. You will get options for ‘Left Button’, ‘Connector’, ‘ Right Button’. You can also set or upload an icon for your buttons.

ss2 2

If you want to you can hide the connector. There is also an option for that. You also can set the connector type to an icon or text.

ss3 3

Step 3:

Clicking on the ‘Style‘  button you will get options to edit the buttons and the connector. The ‘Common’ options are to edit the general design of the buttons and the connector.

Then you have options for each of the buttons and the connector.

ss4 3

You can give space between buttons, you can place the button left, right, and center using the ‘Horizontal Alignment’ in the Common section. There are also options for ‘Typography’ and ‘Box Shadow’.

ss5 3

For the buttons, you can design the ‘Left Button‘ and ‘Right Button‘ separately. But options for both of them are the same.

You can set the padding, give a border set of different colors for the background of the button. You can set the text color as well. There is also a ‘hover‘ option in case you want to make your button more stylish and fun.

ss6 2

For the connector, you can set text color and background color.

ss9 1

Step 4:

If you want to add motion effects, happy effectsbackground, or make it responsive and more intriguing, click on ‘Advanced‘ to explore those options. the ‘Advanced‘ is a default feature of Elementor. Give a read to this Document to know more about Advanced features and its uses.

ss7 3

Finally, if you click on publish you will see a beautiful button on your page.

ss8 2

Watch this video tutorial also.


That’s it!.

How can we help?