Amazon.co.uk Widgets

Log in

X

Integrating Stripe into Joomla by creating a subscription plugin involves creating a custom Joomla plugin that utilizes the Stripe PHP library to handle payments, setting up a subscription using the Stripe API, and connecting that subscriptio to a Joomla User.

Here’s a step-by-step guide to help you achieve that integration. It will require installing the Stripe CLI – an essential tool that gets you command line access to your Stripe integration. Then the Stripe PHP server-side SDK to get access to Stripe APIs from applications written in PHP. Lastly it will integrate the SDK with the Joomla plugin framework to enable Stripe payments within Joomla! 

Note: – This step by step integration of Stripe with Joomla requires a working knowledge of terminal commands, PHP, and the Joomla CMS plugin technologies. 

Set up the Stripe Command Line Interface (CLI) 

Install the CLI

From the command-line, use an install script or download and extract a versioned archive file for your operating system to install the CLI. 

  • On a Mac the easiest way is to use homebrew (The Missing Package Manager for macOS).
% brew install stripe/stripe-cli/stripe
  • Login and authenticate your Stripe user Account using your web browser to generate a set of restricted keys.
% stripe login
Your pairing code is: xxxx-xxxxx-xxxxxx-xxxxxx
This pairing code verifies your authentication with Stripe.
Press Enter to open the browser or visit https://dashboard.stripe.com/stripecli/confirm_auth?t=xxxxxxxxxxxxxxxxxxxxxxx (^C to quit)
> Done! The Stripe CLI is configured with account id acct_xxxxxxxxxxxxxxxxx

Please note: this key will expire after 90 days, at which point you'll need to re-authenticate.
% 
Allow Stripe CLI to access your account information (screenshot)
Allow Stripe CLI to access your account information (screenshot)
 Stripe CLI access granted to your account information (screenshot)
Stripe CLI access granted to your account information (screenshot)

Optionally you might now want to learn more about the Stripe CLI and API keys.

Install the Stripe PHP Library

The next step is to install the Stripe PHP library. You can do this by downloading the library and placing it inside your plugin directory.

  • The easiest way to do this is by using Composer (PHP's dependency manager). Create a folder for your plugin on your Mac and run
% composer require stripe/stripe-php

This will download and install the Stripe PHP library in a folder called vendor. It creates 57 folders and 391 files.

├── composer.json
├── composer.lock
└── vendor
    ├── autoload.php
    ├── composer
    └── stripe

Create the Joomla plugin manifest file

This XML file tells Joomla how to install the plugin and what files it uses. Create a file called payment.xml in the yourpluginname/ folder. The manifest includes plugin metadata and configuration fields for the Stripe Secret Key and Publishable Key.

TODO

Create the Joomla plugin PHP File

Create the plugin file, payment.php, where the plugin logic will be coded. This code will use the Stripe library to handle payments.

  • The plugin hooks into Joomla's onAfterInitialise event.
  • It checks if a request to process a payment is made (based on an action parameter).
  • The processStripePayment() function initializes Stripe, creates a PaymentIntent, and returns the clientSecret needed to complete the payment on the frontend.
  • The API keys are stored safely in the plugin's configuration and retrieved using $this->params->get().
 kk

Add Stripe to the Joomla Frontend (HTML + JavaScript)

You need to add the Stripe Checkout form and JavaScript to your Joomla site’s frontend to allow users to complete a payment.

For this demonstration you can create a Custom HTML module to do this but if you are producing a finished product you'll perhaps want to develop an installable module to go alongside the plugin to integrate the frontend payment process. In which case you'd need to create a package, a special type of Joomla extension which would allow more than one extension to be installed at the same time.

  • Name the module
  • Set a module posiiton, not a module position from your template because it is going to be loaded directly into an article
  • Enable the Menu Assignment to ensure the module appears. This often trips me up - check it if your module doesn't load!
Joomla Custom HTML Module (Screenshot)
Joomla Custom HTML Module (Screenshot)

Load the Module into an article to test your plugin

Make sure that the Content - Load Modules plugin is enabled.

  • Search for "Load Modules" in Extensions > Plugins
  • Check that it is enabled and enable it if it is not
Enabling Joomla plugin Content - Load Modules (Screenshot)
Enabling Joomla plugin Content - Load Modules (Screenshot)
  • Now you can use the shortcode \{loadmoduleid 123\}, where 123 is your module ID, in an article to load your module.
  • Make sure you remove the '\' as I had to add these to get the braces around the shortcode to display.

Your Stripe payment module should look like this

Please select a valid subscription plan.
 
 
Bootstrap

The form is a responsive form using Bootstrap.

  • form-control is applied to the card input.
  • btn btn-primary w-100 styles the submit button to be full-width of its container and in primary color.
  • invalid-feedback is used to show errors if the payment fails.
  • The needs-validation class and novalidate attribute are added to disable native HTML form validation but keep Bootstrap’s styling available.
  • mb-3 ensures margin between form elements.
  • mt-3 for spacing under the status message after the button.

 

Create a Joomla plugin

You need a precise structure to install the plugin on a Joomla site using the Joomla Admin console.

  • Zip up all the content in all the folders downward from the yourpluginname folder.
  • Navigate to the parent directory of your stripepayment plugin folder, and then run:
  • zip -r foldername.zip pluginname/
  • This command will:
    • -r: Recursively include all files and directories inside pluginname/.
    • Create a foldername.zip file that contains all the plugin's files.
  • Ensure that the stripepayment.xml manifest file is at the top level of the ZIP archive. This is important for Joomla to correctly install the plugin.
  • The ZIP file should contain all necessary files like PHP scripts, the vendor/ directory (for Stripe PHP), and any other assets.
yourpluginname/payment.php
yourpluginname/payment.xml
yourpluginname/vendor/stripe/ 

Install your plugin

  • Once the ZIP file is created, you can install it in Joomla via Extensions > Manage > Install.
  • You should see a confirmation that the installation was successful.
Extensions, Install success (screenshot)
Extensions, Install success (screenshot)
  • Now you can find the plugin in Plugins - search for 'stripe'.
  • Click on the plugin name to open it and see its configuration parameters.
  • Set the parameters for your test key and enable the plugin then save to test it.
  • Go to the frontend of your site, fill in the payment form, and ensure the payment process works as expected.
Payments for Stripe plugin successfully installed (screenshot)
Payments for Stripe plugin successfully installed (screenshot)
Payment by Stripe plugin configutation parameters (screenshot)
Payment by Stripe plugin configutation parameters (screenshot)

Setting up credentials to test

You can set up subscription in test mode in Stripe. Test mode is exactly what it sounds like. No transactions go through, but you can try out all the various possible conditions you might encounter with your subscription form. Stripe also lets you set up sandboxes which are completely isolated from your live account  but these are beyond the scope of this article so grab the test API keys (Publishable key and Secret key), add them to your plugin parameters and test away.

  • Log in to your Stripe Dashboard
  • Set the toggle to 'Test mode'
  • Set up a subscription product for your testing.
  • You'll need to add the Product ID to your subscription form!
  • Optionally set more than one level of subscription
Stripe Dashboard screenshot
Stripe Dashboard screenshot
A Stripe subscription in Test mode (screenshot)
A Stripe subscription in Test mode (screenshot)