top of page

Adding MinistryPlatform Widgets to Wix Websites

Wix can use its Custom Elements to host MinistryPlatform widgets.  These instructions illustrate illustrate how this is accomplished.

Prerequisites

  1. Your Wix site must have a premium plan with no advertising. This sample site uses the cheapest tier premium plan.

  2. You must have a custom domain for your Wix website.

  3. Your Wix website must be configured in the permitted URL list for your MinistryPlatform site.

Wix Site Configuration

  1. From your Wix Dashboard go to Settings > Custom Code.

  2. In the Head section press the Add Code button.

  3. Paste the script code (See step 2 in the Preparation section below) in the "Paste the code snippet here".

  4. For the name enter MPWidgets.

  5. In the Add Code to Pages section choose All pages.

  6. Select the option for Load code on each new page.

  7. On the Code Type tab, choose the Essential option.

  8. Press the Apply button.

Preparation

You can't simply copy/paste the html code from the documentation. You'll need to lookup settings from the documentation to be used in the next step.

  1. From the MinistryPlatform online help, locate the configuration documentation for the associated widget. For example: Configuring Event Finder.

  2. Make note of the Script src where the MPWidgets.js file is located.

  3. Make note of the widget name.

  4. Make note of the attribute name/value pairs that may be available. (What is listed before and after the equal sign).

​​Wix Pages Configuration

  1. Create Wix pages for each widget.

  2. ​Add a new Custom Element to each page. From the Embed Code section choose Custom Element

  3. With the Custom Element selected click Choose Source.

  4. Select the Server URL option.​

  5. For the Server URL enter the address of your MPWidgest.js file (for example: https://yourservername.ministryplatform.com/widgets/dist/MPWidgets.js). 

  6. Scroll down to the bottom of that window and for Tag name enter the name of the widget (for example mpp-event-finder).

  7. With the Custom Element selected click Set Attributes.

  8. Click the Set Attributes button

  9. For Attribute Name enter the first paramater name (for example: targetURL).

  10. ​For Value enter the parameter value (for example: event-details).

  11. ​Click the Set button.

  12. If the widget has multiple parameters, click the New Attribute button and repeat steps 9-11 above.

  13. Repeat steps for each desired widget.

Wix Finalization

  1. Publish the Wix website​

bottom of page