Home / Widgets

Submit Button Widget

Customer Success Team

Last updated on May 06, 2024

The Submit Button widget is a clickable component on a registration or sign-up form. It allows your customers to complete the process and submit their details to create an account. Upon clicking the button, the system processes the provided data, checks for validity and completeness, and then proceeds to create a new user account based on the provided information.

Adding a Submit Button Widget

To add a Submit Button widget:

  1. Access the Visual Editor from Channels on the Dashboard Left Panel and navigate to the Sign Up system page.
  2. Go to the Widgets list on the Visual Editor Left Panel.

  3. Type the widget name in the search bar, or expand the User Account group to access the Submit Button widget.

  4. Drag and drop the Submit Button widget onto the the desired area.

After the widget placement, you can customize its styling for two widget-specific states: Normal and Loading. 
It is useful to design the button appearance and behavior for the Loading state as it helps visually communicate to users that their action has been acknowledged and the system is processing their request.

Configuring the Submit Button Widget

To design the appearance and behavior of the Submit Button widget, activate the Property Panel of the widget by clicking to access the widget Styles, Content, and Settings.

  1. Go to widget Styles to configure the general styling features (see Global Styles) to achieve the desired visual and functional outcomes.
    • Customize the element-specific stylistic feature General to set its display (Label Only, Left Icon, Right Icon, and Icon Only).

Note: You can access the UI Elements in the Design System from the upper-right corner of the Property Panel and choose one as a base for the Submit Button widget, or create a new UI Element and style it accordingly.

You can use the Dotted Menu on the Property Panel:

  • to access Reset Styles to discard the changes made to the Submit Button widget and restore its default style.
  • to access Override Styles to apply the changes made to the Submit Button widget (font, size, alignment, etc.) to the base element and its derived elements.
  1. Go to the widget Content to:
    • select the icon to be displayed to your customers: either from General Icons or My Icons, the latter inheriting the Vectors uploaded in the Media section;
    • write the label text to be displayed to your customers.
  2. Go to the widget Settings to set its visibility (see Visibility Settings) on the website based on criteria such as your customers' location, session status, device type, browser, language preference, etc., to tailor it to specific user segments or conditions.

💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.