To add a donation form to a JupiterX site, install the free Donor Merchant plugin, edit your Donate page with Elementor, drag in the Shortcode widget and paste [donor_merchant]. For a Donate button in the header, edit your header in JupiterX > Layout Builder and add a button that links to that page.
What do I need before I start?
JupiterX's documentation lists two required plugins, Jupiter X Core and Elementor, and says Jupiter X does not provide its own widgets for the block editor. So on a JupiterX site you will almost always place the form in Elementor. You also need WordPress 6.2 or newer, PHP 7.4 or newer and HTTPS for Donor Merchant.
Install Donor Merchant from Plugins > Add New, then connect Stripe or PayPal. If you will take recurring gifts, set up the webhook too, because renewals are recorded through it.
Where do I put the form in JupiterX?
These are the steps from JupiterX's own help article on shortcodes, applied to Donor Merchant:
- Go to Pages, create a page called "Donate" and click Edit with Elementor.
- In the left panel, search for "Shortcode" and drag the Shortcode widget into a section.
- In the widget's Shortcode box, paste
[donor_merchant]. - Click Update or Publish.
JupiterX points out that the Shortcode widget renders the shortcode live in the editor, unlike the Text Editor widget, so you can see the form while you lay out the page. Card fields from Stripe still need the published page to load properly, so do a final check logged out.
Useful variations:
[donor_merchant campaign="3"]ties gifts to a campaign. IDs are listed under Donor Merchant > Settings > Shortcodes.[donor_merchant title="Support our work"]changes the form heading.[donor_merchant_progress campaign="3"]in a second Shortcode widget shows a goal thermometer. See campaigns.
How do I add a Donate button to the JupiterX header?
JupiterX builds headers in the Layout Builder:
- Go to JupiterX > Layout Builder and choose Header from the side tabs.
- Click Edit next to your current header, or Add New to start one. The header opens in Elementor.
- Add a Button widget beside your menu and link it to your Donate page.
- Publish. For a new header, open the Publish button's dropdown, choose Display Conditions and add a condition so it shows on the whole site.
Check the mobile view in Elementor's responsive mode. If your button is hidden on phones, add Donate as a regular menu item too, in Appearance > Menus.
Jupiter X 4.5 (June 2026) also added floating elements: sticky bars and floating buttons that stay on screen while visitors scroll. Artbees lists calls to action among their uses, so a floating "Donate" button linking to your form page is another option on long pages.
Should the form go in a JupiterX popup?
JupiterX has a Popup Builder, so it is tempting to open the form in a popup. We recommend a full Donate page instead. A dedicated page gives Stripe's card fields, Apple Pay and the PayPal window a normal page to work in, it can be linked from emails and social posts, and it works with caching without special handling. We have not tested the form inside JupiterX popups. If you want a popup, use it to show a short appeal with a button that goes to the Donate page.
Does JupiterX include its own donation system?
No. JupiterX's guide to its bundled plugins covers Jupiter X Core, Elementor, SellKit for WooCommerce, Advanced Custom Fields, JetEngine and slider plugins, and none of them is a donation system. Its template library does include charity and environmental NGO designs with Donate buttons and "monthly givers" sections. Those are layouts, and figures such as the charity template's "Raised" total are fixed text. Import one if you like the design, point its buttons at the page holding your Donor Merchant form, and swap any static total for [donor_merchant_progress campaign="3"] in a Shortcode widget so the number stays current. Monthly giving in Donor Merchant is covered in recurring donations.
How do I match the form to my JupiterX design?
Take your brand color from your Elementor global colors and enter it in Donor Merchant > Settings > Forms > Form style as a custom color. The live preview shows the result before you save. Then choose a button shape (pill, rounded or sharp) that matches the Button widgets you use elsewhere. The form's CSS is scoped under .dm-form, so it does not restyle the rest of your site. Elementor's global styles can still reach the form, so check the Donate page after changing them. All options are in form settings.
Which JupiterX speed settings affect the form?
Jupiter X 4.5 added a Performance section to its control panel. Artbees lists its options as CSS print method, optimized image loading, Gutenberg asset optimization, lazy loading of background images and local Google Fonts. As Artbees describes them, none of those change how JavaScript loads.
Two other JupiterX recommendations are worth a look:
- Disabling unused features. JupiterX suggests turning off modules you do not use in JupiterX > Settings > Modules, and unused widgets in Elementor > Element Manager. Keep the Shortcode widget enabled, since your form depends on it.
- Caching plugins. Artbees recommends WP Rocket, W3 Total Cache, WP Super Cache, Autoptimize and LiteSpeed Cache. Page caching is safe for the donation page because the form has no nonce, and the donor portal and receipt links send no-cache headers automatically. Several of those plugins can also minify, combine, defer or delay JavaScript. If the card fields or PayPal button do not appear, exclude
js.stripe.com,www.paypal.com/sdk/jsandwp-content/plugins/donor-merchant/assets/js/donor-merchant.jsfrom those options, or switch them off for the donation page. Our cache exclusions guide has the details.
After any change, JupiterX's Cache section (also new in 4.5) can clear Jupiter X assets, Elementor CSS and cache plugins in one place, which saves hunting through each plugin.
Anything else to check?
- Donor portal. Put
[donor_merchant_portal]in a Shortcode widget on its own page so donors can see their giving history and print receipts. Donors with a Stripe recurring gift can also update their card or cancel there. See donor portal. - Thank-you page. Optional, set in Donor Merchant > Settings > General. Build it in Elementor like any other page.
Sources
- JupiterX Help Center: How to Use a Shortcode in JupiterX with Elementor
- JupiterX Help Center: Building a Customizable Header with JupiterX
- JupiterX Help Center: What is JupiterX Layout Builder
- JupiterX Help Center: A Complete Guide to Jupiter X Bundled Plugins
- JupiterX Help Center: Disabling Unused Features for Optimal Performance
- JupiterX Help Center: Introduction to Speed Optimization with Caching Plugins
- JupiterX Help Center: Optimizing JupiterX for Maximum Speed
- Artbees: Jupiter X v4.5 release notes (Performance and Cache sections, floating elements)
- Jupiter X templates: Charity
- Elementor: Shortcode widget