Saturday , April 20 2024
Home > Magezon News > Product Releases & Updates > [Important Updates] Blue Form Builder 2 Release

[Important Updates] Blue Form Builder 2 Release

Blue Form Builder 2 Release

Dear Magezon customers,

Today, we would like to announce a very important update related to Blue Form Builder. That is Blue Form Builder has been updated from version 1 to version 2. This update includes an extensive change in both UI and UX along with new functions to optimize form building and managing process.

So let’s explore what’s new in Blue Form Builder 2 (BFB 2).

1. New builder interface: Magezon Core Builder
2. 2 new elements with 4 updates
3. Improved performance
4. Success message
5. New functions for 3 plugins
6. Multi-language support
7. Save form progress
8. View submissions on frontend

1. New builder interface: Magezon Core Builder

The biggest change is a completely new form builder interface built based on Magezon Core Builder.

Magezon Core Builder is the one based on which we developed our builder extensions including Magezon Page Builder and Single Product Page Builder.

So the builder interface of BFB 2 now looks like this:

Blue Form Builder 2 Release _ New builder interface
Image 1: New builder interface

2. 2 new elements with 4 updates

Basically, BFB 2 has all elements that you can find in Blue Form Builder 1 (BFB 1). However, there are some changes as follows:

Element settings: Besides custom options that you can find in BFB 1, there are new options to extend the element’s functionality. The settings popup of an element now looks like this:

Blue Form Builder 2 Release _ Element settings interface
Image 2: Element settings interface

Multi page form:

As you know in BFB 1, you have to turn on a toggle button to enable multi page form function. However, in BFB 2, we have a new element called “Pages” that you need to add into the builder section to create a multi page form. Besides, you can flexibly customize top bar style and Next/Previous buttons.

Blue Form Builder 2 Release _ Pages element
Image 3: Pages element
Blue Form Builder 2 Release _ Multi page form in backend
Image 4: Multi page form in backend

4 types of top bar in multi page form:

>> View demo: Frontend Backend

Field Set element: this is a new element.

Blue Form Builder 2 Release _ Field Set element
Image 9: Add Field Set element
Blue Form Builder 2 Release _ Field Set element in backend
Image 10: Field Set element

Phone element: has a new appearance and you can choose the country, like this:

Blue Form Builder 2 Release _ Phone element
Image 11: Phone element

>> View demo

File Upload element: has a new appearance like this:

Blue Form Builder 2 _ File Upload element with no drag drop interface
Image 12: File Upload element with no drag-drop interface
Blue Form Builder 2 Release _ File upload element with drag drop interface

Image 13: File Upload element with drag-drop interface

>> View demo

Radio List / Checkbox List elements: With these elements, you can now add images as options instead of simply adding text like BFB 1.

Blue Form Builder 2 Release _ Upload images as options in radio list element
Image 14: Add images as options in Radio List element

>> View demo: Frontend Backend

3. Improved performance

In BFB 2, the speed of submitting a form as well as sending email notifications is much faster than that in BFB 1. Therefore, the function Send email after in Email Notifications settings for Admin and Customer no longer exists.

Blue Form Builder 2 Release _ No Send email after field
Image 15: ‘Send email after’ field no longer exists in Email Notifications settings

4. Success message

In BFB 2, you can customize not only the content of success message but also its header and footer as well as style, like this:

Blue Form Builder 2 Release _ Success message in backend
Image 16: Customize success message

Note: The Footer Content in success message is related to the function of redirecting customers after submission.

If you open Settings > Advanced, then fill out Redirect on Submit and Redirect X seconds after form submit fields, the footer content will appear in success message on frontend.

Blue Form Builder 2 Release _ Customize redirect function
Image 17: Customize redirect function

Enter [redirect_time] variable in Footer Content field and it will be replaced with the value filled in Redirect X seconds after form submit with redirect countdown.

Enter [redirect_link] variable and it will be replaced with the link filled in Redirect on Submit.

Let’s see how success message looks on frontend:

Blue Form Builder 2 Release _ Footer content in success message
Image 18: Success message on frontend

5. New functions for 3 plugins

3 plugins of Blue Form Builder has also been updated with new functions.

5.1 Smart Conditional Logic plugin

We add 2 new conditions including:

– is empty

– is not empty

Blue Form Builder 2 Release _ Conditional Logic plugin
Image 19: Smart Conditional Logic plugin

>> View demo

5.2 Mailchimp plugin

With MailChimp plugin, you can now add multiple conditions to assign customers to a specific group.

Blue Form Builder 2 Release _ Mailchimp plugin
Image 20: MailChimp plugin

>> View demo

5.3 Report plugin

Report plugin has a new interface like this:

Blue Form Builder 2 Release _ Report plugin _ new interface
Image 21: New interface of Report plugin

– In case the form has a field with multiple choices, you can view report on this field by clicking Get Insights button.

Blue Form Builder 2 Release _ Get insights into form field report
Image 22: Report on specific form fields

– Submissions Grid: There is a grid where you can view submissions of a form for specific store views and time period you have chosen. You can export them to CSV or Excel XML. Also, you can filter wanted submissions quickly with advanced filter.

Blue Form Builder 2 Release _ Submission grid in Report plugin
Image 23: Submission grid

6. Multi-language support

BFB 2 now can support multi-language forms. Specifically, when customers switch between languages on frontend, your form will change its language accordingly.

7. Save form progress

With this new function, users’ form data would be auto-saved as they fill the form. It means the data that users filled in the form would still remain after they refresh the page, and they just need to continue filling out the form instead of filling from scratch.

To enable this function, just navigate to Settings > Advanced and turn on the toggle button Auto Save Form Process.

Blue Form Builder 2 Release _ Auto save form progress
Image 24: Auto save form progress

To have a clearer view on how this function works, please click this link to open a contact form. Type something in some form fields. After a few seconds, refresh the browser; the information would still be here.

8. View submissions on frontend

After submitting the form, customers can view their submission right on frontend by clicking the link in success message. Just insert [track_link] variable in success message in backend like this:

Blue Form Builder 2 Release _ View submission on frontend _ Customize in backend
Image 25: Customize success message for viewing submission on frontend

The [track_link] variable will then be replaced with the link by clicking on which, customers can view their submission on frontend.

Blue Form Builder 2 Release _ Link to view submission on frontend
Image 26: Link on success message to view submission on frontend
Blue Form Builder 2 Release _ View submission on frontend
Image 27: View submission on frontend

———————-

We hope that the release of BFB 2 can meet more of your demands and bring you a better experience. Please feel free to contact us if you have questions or need support.

About Trang Vu

Trang Vu
Min is a content marketer with more than 2-year experience in Magento. She has great patience and high concentration ability to deal with every pressure at work.

Check Also

smart code editor banner

Page Builder 3.0 Sneak Peek: Smart Code Editor

Hi everyone, in this sneak peek, we’re excited to reveal one of the brand-new features …

Leave a Reply