{"id":2481,"date":"2021-12-13T10:25:48","date_gmt":"2021-12-13T10:25:48","guid":{"rendered":"https:\/\/helptest.mainbrainer.com\/knowledge-base\/landing-page-builder-widgets\/"},"modified":"2022-06-09T07:45:18","modified_gmt":"2022-06-09T07:45:18","slug":"landing-page-builder-widgets","status":"publish","type":"ht_kb","link":"https:\/\/www.mainbrainer.com\/hc\/landing-pages\/builder\/widgets\/","title":{"rendered":"Landing Page Builder Widgets"},"content":{"rendered":"
\n

The landing page builder widgets<\/strong> offer you all the design elements you might need to create a landing page<\/a>.<\/p>\n

Let’s look at the different widgets <\/strong>available and the purpose they serve.<\/p>\n

Before we proceed, Here\u2019s a quick look at what our landing page builder looks like:<\/strong><\/p>\n

<\/div>\n

\"MainBrainers<\/p>\n

<\/div>\n

The area marked as the Work area<\/strong> is where you create your landing page. You can build your landing page by dragging and dropping the required widgets <\/strong>from the tools area into the Work area.<\/p>\n

<\/div>\n

\"The<\/p>\n

<\/div>\n

Let\u2019s now look at the different widgets available and the design purpose they serve!<\/strong><\/p>\n

1. Button Widget<\/h2>\n

The Button widget<\/a> is used for adding a clickable button to your landing page. You can configure various click actions for the button, such as redirecting the clicks to an external web URL, a landing page, or trigger a file download, etc.<\/p>\n

<\/div>\n

2. Text Widget<\/h2>\n

As the name suggests, the Text widget<\/a> helps you add text (including special characters and emoticons) to your landing page and format the text according to your design.<\/p>\n

<\/div>\n

3. Image<\/h2>\n

The Image widget<\/a> is used for adding images to your landing page. You can also hyperlink the image to an external web link.<\/p>\n

<\/div>\n

4. Image + Text<\/h2>\n

The Image + Text widget<\/a> is used for adding an image and text combination to your landing page. You can edit the text’s relative position with respect to the image according to your design requirements.<\/p>\n

<\/div>\n

5. Video<\/h2>\n

The Video widget<\/a> is used to add a video to your landing page. Currently, we support video addition via Youtube, Vimeo, and direct uploads.<\/p>\n

<\/div>\n

6. Signup Form<\/h2>\n

The Signup Form widget<\/a> is used to add a signup form to the landing page. The data captured via this signup form is auto-updated in the CRM in accordance with our platform\u2019s data import rules.<\/p>\n

<\/div>\n

7. Social<\/h2>\n

Use the Social widget<\/a> to add social media profile links to your landing page. You can add links to your Facebook page, Instagram profile, Twitter handle, Youtube channel, and LinkedIn profiles using this widget.<\/p>\n

<\/div>\n

8. Footer<\/h2>\n

An optimized footer section is a marker of a well-designed landing page. The Footer widget<\/a> helps you add a well-designed and optimized footer section to your landing page.<\/p>\n

<\/div>\n

9. Columns<\/h2>\n

The Columns widget<\/a> is used to split the work area into columns. You have the option of splitting the workspace into 2,3, or 4 columns. Then, you can proceed to drag and drop any other widget onto the created columns.<\/p>\n

<\/div>\n

10. Spacer<\/h2>\n

The Spacer widget<\/a> is used for adding a negative space between two widgets. Negative space allows you to create focus areas in your marketing campaigns and make your campaigns easier to read and visually attractive.<\/p>\n

<\/div>\n

11. Map<\/h2>\n

As the name suggests, the Map widget<\/a> is used to add a map to your landing page. This widget can mark up to 5 addresses on the inserted map. You can use it to add roadmaps\/satellite maps\/terrain maps or hybrid maps.<\/p>\n

<\/div>\n

12. Coupon<\/h2>\n

If you are planning to offer limited-time discounts to your customers, use the coupon widget<\/a> to incorporate such offers into your landing page.<\/p>\n

<\/div>\n

13. Countdown<\/h2>\n

The Countdown widget<\/a> adds a countdown timer to your landing page which displays to your campaign recipients exactly how many days, hours, minutes, and seconds are remaining until a specific time and date.<\/p>\n

<\/div>\n

14. Section<\/h2>\n

If you wish to add a horizontal design element to your landing page that merges with and transcends across the background space, use the Section widget<\/a> to do so. This widget adds a uniform colored\/transparent row on your landing page. You can then drag and drop the required widget onto this row.<\/p>\n<\/div>\n