Upgrade Your Shopify Store to Bread 2.0

Bread Pay™ 2.0 is here and we’ve enhanced our platform with your business in mind. This upgrade will unlock enhancements designed to drive conversion for your business.

📘

This platform upgrade is required in 2023.

Upgrade Steps:

Step 1: Locate your 2.0 api key, api secret, and integration keys

In order to Upgrade you will need 2.0 Access Keys. These keys are available in your new Merchant Portal. Sandbox versions of these keys are located in the Preview portal and can be used to run test transactions. It is recommended to work with the preview keys first. Access to the Merchant Portals will be setup by the Integration Manager supporting you during the upgrade. You can learn more about logging into the Merchant Portal here.

Bread 2.0 Live Credentials: https://merchants.platform.breadpayments.com
Bread 2.0 Preview Credentials: https://merchants-preview.platform.breadpayments.com

Once logged in, first click on "Account Settings". Then click on the Account Settings drop down and select "Access Keys" to view your credentials. Keep this page open as you will need to reference these keys shortly.

📘

Previous Button Customization

Our enhanced platform renders the Bread buttons differently. Previously configured CSS Styling will not apply to the new buttons. If you have any custom CSS it is recommended that you copy it before switching over to Bread 2.0. You may need to reference the previous CSS when styling the new button.

• Custom CSS for classic buttons can be located in the Bread Pay Messaging App before upgrading to Bread 2.0.

Step 2: Configure the Bread Pay™ App for 2.0

From your store admin page, navigate to settings > payments and find Bread Pay under “supported payment methods”.

Click “manage”

• Note: If you will be using preview keys for test transactions, check the box to "Enable test mode".

Click "manage" again in the Account Status section.

Set your Bread version to "Bread 2.0"

Copy the keys you located in step 1 into the corresponding fields.

• Note: When using preview keys, enter them into the Sandbox fields and check the box "Use sandbox (test) mode". Ensure that you also enabled test mode for the Payment App on the previous page.

Click save in the top right.

The checkout experience has been upgraded to Bread Pay™ 2.0. All new Orders will be created on our enhanced platform.

🚧

Customizing the New Bread Pay™ Button

The new default Bread Pay™ Button on Product and Cart pages will appear as a string of text. Additional configuration will be required if you wish to add customization.

Code changes will also be needed if you have a manual integration of Bread buttons on financing pages, banners, or category pages.

Follow the steps below to learn more.

Step 3: Configure Product Page and Cart Button Styling

Navigate to the Bread Pay™ Messaging App Settings.
From your Shopify Admin, Click Apps. Locate and click on the Bread Pay™ Messaging App.

Under the Default Button Layouts you will find multiple options for Button Styling.

Recommended: You can choose one of the pre-styled Bread Pay™ Buttons by simply clicking on it. This will automatically apply the customization to all of the corresponding Bread Pay™ Buttons. These buttons are pre-approved and compliant with Bread requirements.

Alternatively, you can open the Advanced Button Styling section and use the Custom CSS fields to manually style your button. You will need to customize the base button and the mouse-over hover styling separately. Manual customizations of the button will need to be submitted to Bread for a compliance review.

Step 4: Update any Custom Integrations (Financing & Category Pages, or Banners)

Any aspects of your integration that directly referenced Bread JavaScript will need to be updated to use the Bread 2.0 SDK. General guidance on working with the Bread SDK can be found here.

When updating your financing Page, we have an HTML template that can be used. Financing template found here.

When updating Bread language on category or other custom pages, we have a document outlining the implementation steps which can be found here.