Woocommerce Integration Steps

STEP 1: Install and Configure Bread Extension

Installation Steps

  1. You can install the Bread Extension by going to Plugins > Add New in your Wordpress Admin dashboard and searching for Bread Pay. You will need to have the Woocommerce plugin installed before installing the Bread plugin. When you see the Bread plugin click “Install Now”
1064
  1. After the plugin is installed it should show up in your Wordpress Admin dashboard under Plugins > Installed Plugins. Click “Activate” to activate the Bread plugin.
550

Plugin Settings And Configuration

In this section we will first walk through the steps to get Bread working on your Woocommerce site. There will be information on the different configuration options found at the bottom of the section.

Find the Bread plugin’s settings in the Wordpress Admin dashboard by:

  1. Going to Plugins > Installed Plugins, finding the Bread plugin and clicking “Settings”
550

Testing Settings:

  1. Check the “Enable this gateway” box
  2. Under “API Settings” the Environment field should be set to Sandbox for testing.
  3. Enter your Sandbox API Key and API Secret Key from your Sandbox Merchant Portal.
  4. Go to the “Checkout Page Options” and ensure the Enable Bread as a payment option on the checkout page. button is checked.
  5. After making these changes click “Save”. No changes to the Bread plugin will go into effect unless you click “Save”.

STEP 2: Style The Bread Button

Bread is highly customizable, and the Bread button and modal can be styled to match your site’s theme.

Button Styling

The Bread button can be styled using custom CSS, however, the CSS must be supplied through the Bread Extension Settings in your Admin Dashboard under the Bread Button Design field. The CSS must be compressed into a single-line string (using a service such as CSS Minifier) before being added to the Bread Button Design field.

Note: Please review the Style The Bread Button for an explanation of the Bread button HTML structure and different button states. All CSS values contained in quotes should use double quotes.

Positioning and Sizing

Positioning of the Bread button is controlled by the settings in the Bread plugin. For category, product, cart and checkout pages you can select whether to show bread on that page and where you want to position it on the page.

STEP 3: Test The Bread Extension

We strongly recommend you test your Bread integration with your sandbox API keys and our sandbox domain before pushing Bread live on your production site. You can leverage the following dummy data when testing Bread in sandbox mode.

  • Any name, address and email
  • Mobile Number: A random sequence of 10 digits – don’t use duplicates or sequential numbers (e.g. 555-555-5555 or 123-456-7890)
  • Birth Date: A birth date before 2000
  • Last 4 Digits of SSN: 07xx (Any 4-digit number starting with 07, such as 0789) to simulate approval, or 0400 to simulate denial
  • Mobile Code / Token: 1234

Note: You will not receive emails nor text messages when testing in sandbox mode. Please refer our Testing documentation for additional guidelines.

STEP 4: Going Live With Bread

In order to go from a sandbox to a live environment you will need to switch to a Production environment and insert the proper API keys from your Production Merchant Portal. Go down to the API Settings section and change the Environment from “Sandbox” to “Production”.

1306

Make sure you have the appropriate Production API and Production API Secret Keys filled in.

1314

Note: If you setup a financing page make sure to follow instructions to prepare for production, including changing the script reference and API keys.


What’s Next