WooCommerce Plugin Integration User Guide

Integrating, Configuring and Testing

1. Have your WordPress site ready with demo/testing/sandbox environment for testing purposes.

Tip: We recommend using a test environment to test the integration before launching on your live website.

2. In case WooCommerce has not been installed, you can do so within WordPress by going to Plugins > Add New Plugin > searching WooCommerce and installing the plugin.

Screenshot 2025-02-05 at 10.18.21 AM

3. Search for the BlueTape payment gateway in Plugins > Add New Plugin > "BlueTape Pay 
Integration for WooCommerce"

It should look like this:

Screenshot 2025-02-05 at 10.18.53 AM

4. Click the Install Now button next to the BlueTape Pay plugin.
5. Once the installation is complete, click the Activate button. (It should now say “Deactivate” beneath the plugin name.)
6. The plugin is now installed and ready for configuration.


7. Under WooCommerce in the WordPress settings menu, press Settings > Payment tab. In the far bottom right of the BlueTapePay option, press the Manage button.

Screenshot 2025-02-05 at 10.19.03 AM

Screenshot 2025-02-05 at 10.19.12 AM

Screenshot 2025-02-05 at 10.19.21 AM

8. Contact the BlueTape team for test keys for your demo environment and production keys when you are ready to go live with the new updated payment systems. They will issue guidance on setting up all required fields.

9. Once all necessary fields are filled out, go to the top left corner and press "Visit Site." Go to the Checkout page, then press Edit Site.

 

Tip: If BlueTape payment options don't automatically show up on your checkout page, you may need to update the check out page. In this case, the default checkout page must be deleted since the payment method is not connected to WooCommerce payment. Click 3 dots at top of block > Delete.

You will then need to add the checkout via shortcode. Go to Pages tab > Checkout > Options dots > press Edit, then under the Blocks options, search and select [/] Shortcode and enter [woocommerce_checkout] > Transform into blocks > Refresh

Screenshot 2025-02-05 at 3.18.48 PM

Screenshot 2025-02-05 at 3.21.10 PM


10. Now we are ready to test the integration. View the site, add items, and go through the checkout flow as if you were a customer.

You can see in Pay > Invoices that the status will update in real time in your BlueTape account.

As mentioned, you can also see this within Wordpress by going to the Orders tab beneath WooCommerce:

Screenshot 2025-02-05 at 3.22.11 PM

If you need help with test credit card information, please reach out to our team for assistance.
Once your testing is complete, use the live keys to update your main website.
Any questions? Feel free to reach out to us at support@bluetape.com or book a meeting with us here.
 
For a demonstration of what your customers will experience while using the BlueTape Pay plugin on your Wordpress site, please view the following video: