What would you like to know more about?

Show Page Sections

Quick Start for Widgets

Note: Widgets can be added to a website with very little coding knowledge, but widgets do live on websites! You will need to work closely with your web staff/team/vendor to successfully integrate widgets into your existing website ecosystem. Be sure to check out Specific CMS Tips for your Content Management System.

Ready to start using widgets?

You can configure widgets on your website by completing the steps for Shared Configuration (script and permitted URLs), and then check out the steps for configuring each specific Widget (code snippet and attributes).

Tip: Want to walk through the initial setup and see how to add a widget? Check out the Adding Widgets webinar in the MinistrySmart Academy!

Steps to Set Up Shared Configuration

1. Set Permitted URLs

Important: Permitted URLs are case-sensitive, so make sure you add both uncapitalized and capitalized versions of your URLs to your permitted URL list (for example, both www.ministryplatform.com and www.MinistryPlatform.com as permitted URLs).

Any website where a Widget is placed must be included in your "permitted URLs" list. Contact Support to add, change, or remove permitted URLs.

Looking for more details? See Enabling Widgets for an in-depth description.

2. Enable Widgets on Your Website

All widgets are powered by a shared script that needs to be added to any page where you want to use a Widget.

Tip: If you add the shared script to your website header, widgets will be available on all pages.

Add the shared script in three steps:

  1. Find your church's base MinistryPlatform URL. For example, if your MinistryPlatform URL is https://example-church.ministryplatform.net/mp, your Platform base URL would be https://example-church.ministryplatform.net.
  2. Create your shared script by replacing "{your website domain}" in this script with your base MinistryPlatform URL.
    <script id="MPWidgets" src="https://{your website domain}/widgets/dist/MPWidgets.js"></script>
  3. Add your shared script to the website header using your church's website management software (CMS). If this isn't possible in your CMS, add the script to any page that will contain Widgets.

3. Identify (or Create) Your Webpage

Widgets live on websites, so figure out where they should appear. Some widgets are foundational (for example, Login and Languages & Locale). It would be helpful to have these on every page. Other widgets will live on a specific page. In the example, we'll put the Event Finder widget on an Events page.

4. Configure Your Widget

While some widgets allow for additional (optional) elements, like filtering by attributes or a URL, you can get a widget up and running with the same basic steps: Add, Configure, and Review.
  1. Add the Event Finder element to the page.
  2. Configure the Event Finder with the target URL.
  3. Review and configure the other options for this widget.

Widget Code Generator

Want to know more about customizing your widget? See the Configuration page under each widget's help topic for more about filtering by attributes and URLs.

Note: Ready to get started? Select the Widget you want to set up in the Widget Code Generator below. Then, add the required attribute information, add optional attributes (if you want), copy the code, and add it to your website!

5. Configure Your Platform Records

Now that your widget is happily living on its webpage, take some time to make sure it's accurate. Each widget will need its own Platform configuration, but for our Event Finder example, it's useful to filter by Congregation and/or Ministry. Want users to be able to filter by campus? Make sure the Congregations have the Available Online field set to Yes. Want to allow filtering by Ministry? Set the Available Online field to Yes for the appropriate Ministries.

Other Considerations

The information displayed on your widget comes directly from the Platform. Make sure the relevant Platform records are correct and up-to-date (with names, titles, dates, descriptions, and so on). For our Event Finder example, make sure the start and end dates are correct (and within the next 120 days), that the visibility allows the event to be viewed online, and that it has been approved. Attaching a compelling image to your Event will significantly up the widget wow-factor.

thumb_upYes thumb_downNo