How to Build a Simple Contact Form

This is a simple step-by-step tutorial on how to make a simple Contact Form for your website using Motion 2. This exercise also aims to let the user understand how Motion 2 works on the back end. The form we are going to build will have the First Name, Last Name, Email, and Message Box fields. The form will also; let the applicant submit the form, trigger an e-mail notification to a group on the admin side responsible for monitoring these submissions, and redirect the user to the home page.

  1. Create an Entity

    • Click the CRM component and click the Configuration tab.
    • Under Entities, click Add Entity Group.
    • Name the Group (e.g. Contact Form).
    • Right-click the Group added and click Add Entity.
    • Name the Entity (e.g. Contact Form Entities), and select the Is Repeatable checkbox.
    • Right-click the Entity added and click Manage Fields.
    • Click Add and select the type Text Area.
    • Type Message on the Label field and Save & Close.

  2. Create a Group that will get notifications for this form

    • Click the Users component and click the Groups tab.
    • Right-click the Groups folder and click New.
    • Name the folder (e.g. Form Admin) and click Save & Close.
    • Add the email/s that will be getting the form notifications.

  3. Create a Workflow in Motion 2

    • Right-click on the Workflows icon and click Add Workflow.
    • Name the Workflow (Ex. Contact Form).
    • On the right side of the window, right-click Primary and click Add Role.
    • Check the User Default checkbox and click Save & Close.
    • Right-click on Secondary and click Add Role.
    • Name it (e.g. Form Admin), select the User Group Form Admin, and click Save & Close.
    • Under the Workflows Window, Right-click the Workflow (Contact Form) and click Manage Statuses.
    • Click Add and Name the status Default and click the default checkbox then Save & Close.
    • Right-click the Version and click Add Task.
    • Name it (e.g. Contact Form), check the Is Kickoff checkbox, Select Form as Task Type, and type Title.
    • Type 'hide' on the Cancel Button field (This will hide that button).
    • Right-click the Contact Form task and click Manage Form Fields.
    • Right-click the Default Stage and click Add CRM Field.
    • Select Applicant as Role.
    • Select Basic Information for the Field Selection field.
    • Delete the Basic Information on the Label.
    • Check the Required checkbox.
    • Uncheck the Title and Gender and click Save & Close.
    • Right-click on the Default Stage again and click Add CRM Field.
    • Select Applicant for Role and select Email for Field Selection.
    • Check the Required checkbox and Save & Close.
    • Right-click on the Default Stage for the third time and click Add CRM Field.
    • Select Applicant for Role, Contact Form for Entity Group, and Entity field.
    • Select Message on Field Selection, click Save & Close, and close the window.
    • Right-click the Contact Form task and click Add Trigger.
    • Name the trigger Email Notification, select Task Completion for the Source field, and Send Notification for the Action field.
    • Select Form Admin for the Recipient Role field and type in the Notification Subject you want.
    • Click the Applicant variable located on the right-side of the window. Double-click firstname, lastname, and reword the notification body (e.g. {$Applicant.0.firstname}{$Applicant.0.lastname} has submitted a form) and click Save & Close.
    • Right-click on the Contact Form task again and add another trigger.
    • This time name it Redirect, select Task Completion for Source, select Redirect on Action, and select the home page for the Site Page field. Save & Close.
    • Make sure to click the task (Contact Form) and check the checkbox 'Applicant' under the 'Assigned To' column in the roles section (Right side) before you publish the form.

  4. Set up Module in Site Planner

    • Click the Site Planner component.
    • Right-click the Modules folder and click Add Item.
    • Select Task Sequence on the Module field.
    • Name it Contact Form and click Save.
    • Select Contact Form for the Workflow.
    • Select Contact Form for the Tasks.
    • Select the Home Page as your Default Page and check the Redirects checkbox. Save & Close.

The Contact Form is now ready to be published on any page on your website.

Modified on Thu, 28 Sep 2023 at 11:43 AM

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article

Make sure these features are added to your Site Stacker installation by learning how to run updates here!