In the spring of 2025, we tried this with StJoe-Middle and minstry platform had conflict with Joomla in that they would append id=123 for a respective event and it would pull up a menu item with that ID.
A year later, here we are and ministry platform seems to have fixed the issue: it is now mpevent=7333 or mpopportunity=2
1. Place the script in the head of the site. Use a raw tags module, in the ganalytics position only assigned to the needed pages.
<script id="MPWidgets" src="/https://stjosephmiddletown.ministryplatform.com/widgets/dist/MPWidgets.js"></script>
2. Per Alex's suggestion, nest these menu items (single article) under a text seperator with the alias /eventapp
3. Either work in code mirror and use articles or create blank single article menu items and assign raw tag module to content top or bottom on that page.
Opportunity Finder:
<mpp-opportunity-finder targeturl="/opportunity-details"></mpp-opportunity-finder>
Event Finder:
<mpp-event-finder targeturl="/details"></mpp-event-finder>
Event Details:
<mpp-event-details returnurl="/events" opportunityfinderwidgettargeturl="/opportunities" checkouturl="invoices"></mpp-event-details>
Invoice and Payment:
<mpp-checkout paymentprocessortargeturl="paymentprocessortargeturl="https://sample.com/paymentform"" backtoeventtargeturl="/events"></mpp-checkout> (REPlACE WITH VANCO URL)
<mpp-user-login></mpp-user-login>
Note the target and return URLS in the respective widgets that will work with the script. Update respectively.
4. Instead of copying every single URL a response back to the client, give them a landing page of sorts: https://www.stjosephmiddletown.com/resources
OR GO ABOVE AND BEYOND LIKE STM-MAN:
https://stmmanhattan.com/my-parish-profile
Option 1: Update the id name in the ministry platform system
The client would need to login to ministry platform and go to the configuration settings. In the configuration settings there are 5 settings that need the value updated. You can find them on their help page:
https://help.acst.com/en/ministryplatform/help-topics/widgets/widgets-release-notes/may-2025#widget-urls-0
Search for them in the configuration settings by "key name" and set the value of each one to "mpid". From there you should be able to add ministry platform widgets to any page as long as the head code is added to that page already.
Here is an example of the head code:
<script id="MPWidgets" src="https://stmmanhattan.ministryplatform.com//widgets/dist/MPWidgets.js"></script>
*This next process should work still but I would try the previous option first
Option 2: Setting Up a Ministry Platform Widget
To integrate a ministry platform widget, all pages hosting the widget (except the homepage) must be nested under the /eventapp URL. This ensures proper functionality for event-related routes, such as:
- example.com/eventapp/checkout
- example.com/eventapp/details
- example.com/eventapp/events
For reference, see ticket: https://catholicwebsiteexperts.freshdesk.com/a/tickets/29196
Implementation Steps
1. Configure Menu Items and URLs
- Create new menu items for pages hosting the ministry platform widget (e.g., Events, Event Details).
- Ensure all widget-related pages are created under the /eventapp/ URL structure, e.g., /eventapp/example-page.
- Add a hidden menu item for /eventapp as the parent.
- Nest subpages (e.g., /eventapp/events) as menu items under the hidden /eventapp parent.
- If the client wants these pages in the main menu, create an additional "Menu Item Alias" type menu item that redirects to the corresponding hidden /eventapp page, preserving the /eventapp URL structure.
2. Share Updated URLs with the Client
- Provide the client with the new /eventapp-based URLs for their widget-related pages.
- Instruct them to update these URLs in their widget settings.
3. Obtain Widget Code from the Client
- Request that the client generates the ministry platform widget code and sends it to you.
4. Insert the Widget Code
- Use a "Raw Tags" module to embed the widget code on the appropriate page. Avoid pasting the code directly into an article, as TinyMCE may strip out custom HTML tags required by the widget.
- Position the module on the page using module positions or load it dynamically with the {loadmoduleid: 123} syntax (replace 123 with the actual module ID and remove the : ).
5. Verify Functionality
- Ask the client to review the implemented widget and confirm that it works as expected.