Your Knowledge Base has moved to the new Help Center.  Check out the release notes for details. And don't forget to update your bookmarks and in-house documentation before May 28.

Configuring Event Details & Registration

 

Quick Start

The Event Details & Registration Widget is used in tandem with the Event Finder Widget. Use both to help people find the event they want to attend. Then the Invoice & Payment Widget summarizes the transaction and sends it to the desired payment vendor. See Quick Start to get them up and running. 

See the Quick Start Guide to get the Event Detail & Registration Widget up and running ASAP.

Note: Because the Event Details & Registration and Invoice & Payments Widgets work together, they must be set up at the same time to function correctly. See Finder Widgets + Details Widgets to learn more about how they interact.

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>

Add the Event Details & Registration Widget to your church website by placing this snippet of code in the body of your chosen webpage, modifying the required attributes discussed below.

<mpp-event-details
     returnurl="/events"
     checkouturl="https://www.ministryplatform.com/index.php/checkout/"
     opportunityfinderwidgettargeturl="https://www.ministryplatform.com/volunteer/">
</mpp-event-details>

Tip: While not mandatory, this snippet would typically be placed inside a <div> element with the class "container."

Widget Configuration

Required attributes must be included for the widget to function.

  • Return URL: The return URL defines the path back to the Event Finder and is required for the Event Detail & Registration Widget to function correctly. It can be a relative or fully qualified url.
<mpp-event-details returnurl="https://www.ministryplatform.com/events"></mpp-event-details>
<mpp-event-details returnurl="/events"></mpp-event-details>
  • Checkout Target URL: The navigation path to the Invoice & Payment Widget. Provides a summary of the invoice and total amount due. Important: Double-check to make sure you're working with one of our verified vendors so people can register for your Events.
    • Attribute: checkouturl

<mpp-event-details checkouturl="https://www.ministryplatform.com/index.php/checkout/"></mpp-event-details>
  • Opportunity Finder Target URL: The navigation path to Opportunity Finder when “Volunteer” is enabled. The Event ID is appended to this path to filter for the specific Event.
    • Attribute: opportunityfinderwidgettargeturl
    • Valid Values: relative or fully qualified url

<mpp-event-details opportunityfinderwidgettargeturl="https://www.ministryplatform.com/volunteer/"></mpp-event-details>

 

Update Configuration Parameters

Setting Name
My Value
Description

Preview & Copy

Platform Configuration

Events may be selected from the Event Finder Widget whenever they meet the following criteria:

  • Today's date is equal to or less than the Start Date. 
  • For featured events, the Start Date is within the next 360 days. For all other events, the start Date is within 120 days.
  • The Visibility Level is either:
    • Staff: Visible only for authenticated users with at least (1) current Group Participant Record where Employee Role = True (belonging to any Group of any Group Type).
    • Staff & Church: Shows on the Widget with or without logging in.
    • Public: Visible for any user.
  • Your event has been approved.

Review your eligible Events to ensure they display as expected.

Events
  • Title: Event Title
  • Date & Time: Event's Event Start Date and Event End Date
  • Event Contact: Event's Primary Contact. If there is an image attached to the Primary Contact's contact record, it displays.
  • Meeting Instructions: Event's Meeting Instructions
  • Location: Event's Location. If there is a latitude and longitude associated with the Location, a map displays.
  • Event Registration: Online Registration Product and Registration Form associated with the Event.
  • External Registration URL: If there is a value in this field, a "Register" button displays and directs users to the URL. Clear this field to prevent that.
  • Force Login: If set to true, no registration options display until the user logs in.
Note: Registration confirmation is handled differently for paid and free events. For paid events, Participants will be sent a receipt from your payment vendor. If you want Participants to receive a registration confirmation for free events, add a template to the Registrant Message field. 
Registration Considerations
  • Product Option Group Note Label: Displays before each option price.
  • Payment Vendor: You'll select your desired payment vendor to process transactions and will no longer use an authorize.net account. Important: To use the Event Details & Registration Widget, you have to work with one of our verified vendors. Check out the list of our verified vendors and, if you don't already work with one, reach out to get started.
  • Payment Details, Invoice, Invoice Detail, and Payment records will be created. 

Attach a compelling image to the Event, which shows in the widget. If there is no image, a stock image displays. Images can be added to use as the Event image by attaching as a file to the Event record via the Platform. File formats supported both by browsers and the Platform are: bmp, gif, jpg, and png. The ideal ratio is 59/32. For reference, the finder images are 800x433 intrinsically but resized to fit at 295x160.

Customization

You can customize the Event Details & Registration. Widget (or any Widget!) to be consistent with your branding, 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: Want to change "Register" to "Sign Up"? You can do that! Navigate to System Setup > Application Labels and update the label to fit your context (note that churches are responsible for all translations if the default is not used).

  • mpp-event-details.registerButtonText - Text on the Register button. Default is "Register."
  • mpp-event-details.registrationAddressLabel2 - Address Line 2 Field label. Perhaps "Apt. or Suite #" suits you better? Default is "Address Line 2."