It is Dual Button Widget documentation. On the basis of the section, I’ll give you some instructions and pictures detailed to help you get started.
So, let’s start.
To Insert widget
Inserting the widget is just a matter of drag and dropping. As you see in the screenshot above, drag the Elementor Dual Button Widget inside your current page.
Using the content tab, you’ll be able to make a layout of a particular part of a website(such as a dual button). And in this regard, some handy sections in the tab will assist you a lot with the creative buttons.
Here, in this section, you can set button size, alignment, and width. Specially, you can add text between the buttons.
Go to the Content tab > Button.
This section will allow you to shape or modify the first button. You could add text, link, alignment, and icon. In addition, you on/off the two switcher buttons on the button widget.
Simply go to the Content tab > Button A. Here, you can customize the first button of the Dual Button Widget using logo, text, spacing, link, etc.
It is as similar as Button A. Just go to the Content tab > Button B. Here, you can customize the second button of the Dual Button Widget using logo, text, spacing, link, etc.
Now, let’s work with the Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you require to design.
Styling with the Style tab in Elementor will always give you a fantastic experience.
Let’s have a look.
Both in the Normal mode and Hover mode, you could style the button widget. Go to the Style tab > Button and have a look at the screenshot below.
Apply some padding & border-radius to make the button appear unique.
Do the same thing for the hover mode. Just add some deeper color to get a hover effect on the Elementor Dual Button Widget.
This section will let you set a few Effects and work in both Normal and Hover mode.
Pick a brighter color for the text and an image for the background. It’s possible.
Just, go to the Style tab > Button A and see what happens.
It is quite similar to Button A to style Button B. Simply go to the Style tab > Button B and look at the screenshot below.
Same thing as Button A but with no image in the background. Instead, use gradient color for the second button of the button widget.
Button A Icon & B Icon
These sections are pretty similar to Button A and Button B.
Come to the Style tab > Button A Icon & Button B Icon.
Go to the Middle Text Section and check them all.
Finally, I hope you’ve noticed that all the sections are pretty similar and easy to control. If you need more support you can watch the video embed above and furthermore to get ideas, you can visit our demo page linked here.