Quick Start

The Custom Forms Widget provides a powerful way to collect information from your Users, allow them to register for Events, or volunteer for Opportunities. Bonus: The Custom Forms Widget supports conditional logic. See the Quick Start Guide to start using simple, relevant forms!

If the shared script hasn't been added to your website, add it to your desired webpage. Be sure to replace "{your platform domain}" in the following code with your church's base MP URL.

<script id="MPWidgets" src="https://{your platform domain}/widgets/dist/MPWidgets.js"></script>

There are two ways to display a custom form, and the one you pick depends on your needs. You can allow access to multiple standalone forms, which is great if you need to send an email with a link to the form. Or you can get your web team involved and add each form to your website.

Standalone Forms

With standalone forms, you don't have to add each form as a page on your website. But you still need to set up a "Widget Page" so it has a place on your website to display your forms. To do that, create or identify the page on your website, then add the Custom Forms Widget to it by placing this code snippet in the body of that "Widget Page":

<mpp-custom-form></mpp-custom-form>

Note: If you want to apply custom CSS to standalone forms, use the Widget Configurator below and use that generated code snippet instead.

Once the page is in place, you can send your users the URL of the form you want them to fill out. To create the link, grab the Form GUID from the Form record and tack it onto the end of your URL, formatted as https://{your church website}/{WidgetPage}/?id={Form_GUID}.

You can then place that link in an email with instructions. When the user clicks the link, the form displays on the "Widget Page" of your website, and they can complete the form. Note: If a user tries to change the Form GUID in the URL, they will not be directed to another form.

Website Forms

You can display each form on your website for users to fill out. Create or identify the page on your website where you want to display the form. Use the Widget Configurator below to insert the Form GUID for the form you want to display. Then add the the Custom Forms Widget to the chosen page using the generated code snippet.

Your users can then locate the form on your website (either by browsing or via a link), and complete the form.

Widget Configuration

Configure your Custom Form Widget!

Simply fill out the Widget Configurator below, copy your generated Widget, and paste it into your website.

Platform Configuration

Any Form can be configured as a Custom Form Widget. But the Form must meet the following criteria to display and accept new Form Responses:

• End Date: Today's date is less than the End Date (or the End Date is undefined). 
• Fields: Any Fields selected for Depends On values must be part of the same Form. See Conditional Logic for more information.

Want to see your form before it goes live on your website? Replace  your church's webpage where the forms widget is located and the Form GUID in the link below to check it out!

https://{church webpage forms widget}/?id={Form_GUID}

Customization

Make sure your forms match your Church's branding by customizing their look and feel!

CSS: Every Widget accepts the Custom CSS attribute. Include it before the opening Widget tag is closed and customize backgrounds, button colors, and more!

Application Labels: Widgets rely on Application Labels to store and populate values for fields, buttons, headers, and instructions. These can be reworded as desired by navigating to System Setup > Application Labels.

• mpp-custom-form.completeMessage - The default is "Thank you! Your form has been submitted."