Financing Page

Creating a dedicated Bread Pay™ financing page is critical to maximizing financed sales. For easy implementation, Bread Pay™ has created a financing page HTML template for you to leverage on your site. You can view the template code and a preview below.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Financing</title>
    <script src="https://connect-preview.breadpayments.com/sdk.js"></script>
  </head>
  <body>
    <!--
  Install Checklist

  Skip these directions if you are integrating on any of the following eCommerce platforms with a Bread app or plugin: BigCommerce, Shopify, WooCommerce, or Volusion

  1. Replace the your-integration-key-here text on line 434 with your integration key
  2. Replace     <script src="https://connect-preview.breadpayments.com/sdk.js"></script>
with     <script src="https://connect.breadpayments.com/sdk.js"></script>
  3. Copy and paste the contents from line 22 to 442

 -->
 <!-- UPDATE DISCLOSURE AT THE BOTTOM TO MATCH YOUR LOAN PROGRAM -->
    <style>

      <!--
          /* ADJUST YOUR PRIMARY AND SECONDARY FONTS HERE */
          @import url("https://fonts.googleapis.com/css?family=stalematelf:400");
          @teximport url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,600,700,800");
          @import url("https://fonts.googleapis.com/css?family=play:400,600,700");


          /* SET UNIVERSAL COLORS AND IMAGE HERE */

            :root {
          --brand-color-medium: #59bec9;
          --buttons-hover-color: #007dba;
          --header-color: #13294b;
          --background-photo-url: url('https://i.imgur.com/7wWlEcZ.png');
          --brand-font-family: 'Poppins',Arial,sans-serif;
          --font-color:#13294b;


          }

          body {
            margin: 0;
            padding: 0;
          }


          .bread-content-inner {
            position: absolute;
            width: 90%;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
          }

          .bread-points {
            margin-top: 50px;
          }

          .bread-section {
            position: relative;
            width: 100%;
            text-align: center;
          }


          .bread-style {
            box-sizing: border-box;
            font-family: var(--brand-font-family);
            font-size: 16px;
          }

          .bread-main p {
            color: var(--font-color);
          }

          .bread-header {
          min-height: 300px;
          background: var(--header-color);
          color: #fff;
          background-size:cover;
          background-position: center;
          background-repeat: repeat;
          background-image:  /* linear-gradient( rgba(0, 0, 0, .7), rgba(0, 0, 0, 0.7) ), */ var(--background-photo-url);--> */
  
  
        }

        .bread-header h6 {
          margin: 0;
          font-family: var(--brand-font-family);
          font-size: 50px;
          line-height: 50px;
          font-weight: 800;
          color:#fff;
        }

          .bread-header h1 {
            margin: 0;
            font-family: var(--brand-font-family);
            font-size: 50px;
            line-height: 50px;
            font-weight: 800;
            color:#fff;
          }

          .bread-header p {
            margin: 2em 0;
          }


          .bread-style h2 {
            font-family: var(--brand-font-family);
            font-style: normal;
            font-weight: 800;
            font-size: 40px;
            line-height: 49px;
            color: var(--font-color);
          }


          .bread-style h3 {
            margin: 0;
            font-family: var(--brand-font-family);
            font-size: 1em;
            color: var(--font-color);
          }


          .bread-main {
            background: #fff;
            color: #333;
          }


          .bread-check-your-rate {
            color: #FFFFFF;
            font-family: var(--brand-font-family);
            margin-bottom: 20px;
            font-size: 23px;
            line-height: 40px;
            font-weight: 800;
            margin-bottom: 6px;
            max-width: 625px;
            width: 80%;
            margin: 0 auto;
          }

          /* 'CHECK YOUR RATE' BOX */
          .bread-rate-box {
            height: 250px;
            background: var(--buttons-hover-color);
            color: #333;
          }

          .bread-footer {
            background: #edeeef;
            color: #333;
            overflow-wrap: break-word;
            margin: auto;

          }

          .bread-contact {
            margin-bottom: 50px;
          }

          .bread-disclosure {
            font-size: 14px;
            margin: 0 auto;
            width: 70%;
            padding: 10px 0;
          }

          a,
          .bread-contact-info {
            text-decoration: none;
            color: var(--brand-color-medium);
          }
          .bread-promo.one {
          background: var(--brand-color-medium);
          border-radius:25px;
          font-family: var(--brand-font-family);
          font-style: normal;
          font-weight: bold;
          font-size: 16px;
          line-height: 22px;
          display: flex;
          align-items: center;
          text-align: center;
          color: #FFFFFF;
          width: 100%;
          height: 50px;
          max-width: 280px;
          justify-content: center;
          border: 1px solid var(--brand-color-medium);
          text-transform: uppercase;
          cursor: pointer;
          margin: 30px auto 0px auto;
          border: 1px solid #FFFFFF;
          border-radius:25px;
          padding: 0px, 21px, 0px, 21px;
  
        }

          .bread-promo.one:hover {
            background-color: var(--brand-color-medium);
            border: 1px solid #fff;
            text-decoration: none;
            color: #fff;
            transition: all 0.4s ease;
          }




          .bread-promo.bread-promo-two {
          background: var(--buttons-hover-color);
          border: 1px solid #FFFFFF;
          border-radius: 25px;
          padding: 0px, 21px, 0px, 21px;
          min-width: 15px;
          width: 100%;
          max-width: 250px;
          font-style: normal;
          font-weight: bold;
          font-size: 16px;
          line-height: 22px;
          display: flex;
          margin: auto;
          text-align: center;
          height: 50px;
          justify-content: center;
          color: #FFFFFF;
          margin: 30px auto 0px auto;
          align-items: center;
          font-family: var(--brand-font-family);
  
        }


          .bread-promo.bread-promo-two:hover {
            color: #fff;
            border: 1px solid #FFFFFF;
            transition: all 0.4s ease;
            background: var(--brand-color-medium);
            transition: all 0.4s ease;
          }

          .bread-learn-more {
            font-family: var(--brand-font-family);
            font-style: normal;
            font-weight: 800;
            font-size: 18px;
            line-height: 28px;
            color: var(--brand-color-medium);
            text-transform: uppercase;
            position: relative;
            width: 100%;
            text-align: center;
          }

      #subhead-terms {
        color: black !important;
      }

      .bread-three-col div {
        margin: 50px 20px 0;
      }

      .bread-three-col img {
        margin-bottom: 15px;
      }

      p{
        padding: 5px 0;
        line-height: 1.3;
      }

      @media ALL and (min-width: 768px) {

        .bread-three-col {
          display: flex;
          padding: 0px 15px;
          justify-content: space-between;
        }

        .bread-three-col div {
          width: 30%;
          margin: 0;
        }

        .bread-points {
          margin-top: 75px;
        }

        .bread-style h3 {
              font-size: 1.25em !important;
        }

        p {
          padding: 0;
        }


      }

      -->
    </style>
    <body>
      <div class="bread-header bread-section bread-style">
        <div class="bread-content-inner">
          <h6>Financing Available</h6>
          <p>
            Clear, transparent terms. Fair rates. No prepayment penalties.<br /><br />
          </p>
          <div class="bread-promo one" id="bread-placement-1"></div>
        </div>
      </div>
      <div class="bread-main bread-section bread-style">
        <h2>Pay Over Time</h2>
        <p>
          Through
          <b
            ><a
              href="https://www.breadpayments.com/shoppers/"
              target="_blank"
              rel="noopener noreferrer"
              ><u>Bread Pay&trade;</u></a
            ></b
          >,  we offer easy and affordable financing options so you can pay for your purchase over time.

        </p>
        <div class="bread-points">
          <div class="bread-three-col">
            <div>
              <img
              src="https://i.imgur.com/FyifnXZ.png"
              alt="calendar icon"
              style="width: 80px"
            />
              <h3>Affordable Monthly Plans</h3>
              <p>
                Buy now and pay for your purchase over time at competitive
                interest rates.
              </p>
            </div>
            <div>
              <img
              src="https://i.imgur.com/6MmfxfK.png"
              alt="payment icon"
              style="width: 80px"
            />
              <h3>No Prepayment Penalties</h3>
              <p>
                Pay for your purchase with monthly payments and prepay at any
                time without penalty.
              </p>
            </div>
            <div>
              <img
              src="https://i.imgur.com/5OBv9tM.png"
              alt="calendar icon"
              style="width: 80px"
            />
              <h3>Easy Application</h3>
              <p>
                Get a decision in seconds with no obligation to buy. Checking
                your rate won't affect your credit score. Your data is safe and
                encrypted.
              </p>
            </div>
          </div>
          <br />
          <div class="bread-section bread-learn-more">
            <br />
            <a
              href="https://www.breadpayments.com/help-center"
              target="_blank"
              rel="noopener noreferrer"
              >LEARN MORE ► </a
            ><br /><br />
          </div>
        </div>
      </div>
      <br />
      <div class="bread-rate-box bread-section bread-style">
        <div class="bread-content-inner bread-check-your-rate">
          <p>
            Check your rate in seconds <br />
            without leaving our site <br />
          </p>
          <div class="bread-promo bread-promo-two" id="bread-placement-2"></div>
        </div>
      </div>
      <div class="bread-section bread-style">
        <div
          class="bread-check-your-rate"
          style="color: #0f233f; margin-top: 40px"
        >
          <div class="bread-section bread-style">
            <center>
              <div
                class="bread-check-your-rate"
                style="color: #0f233f; margin-top: 40px"
              ></div>
              Questions? Visit
              <a href="https://www.breadpayments.com/help-center"
                >Bread Pay™ help center.</a
              ><br /><br />
            </center>
          </div>
        </div>
      </div>
      <div class="bread-footer bread-section bread-style">
        <p class="bread-disclosure">
        
         <!-- -->
         Subject to approval of credit application. Bread Pay™ loans are made by Comenity Capital Bank, a Bread Financial™ company.
        </p>
      </div>

      <script>
        var placements = [
          {
            allowCheckout: false,
            domID: "bread-placement-1",
          },
          {
            allowCheckout: false,
            domID: "bread-placement-2",
          },
        ];

        BreadPayments.setup({
          integrationKey: "your-integration-key-here",
        });

        BreadPayments.registerPlacements(placements);
        
        BreadPayments.on("INSTALLMENT:APPLICATION_CHECKOUT", () => {});

        BreadPayments.on("INSTALLMENT:APPLICATION_DECISIONED", () => {});
        
      </script>
    </body>
    <!-- END FINANCING PAGE CODE -->
  </body>
</html>
Financing
Financing Available

Clear, transparent terms. Fair rates. No prepayment penalties.

Pay Over Time

Through Bread Pay™, we offer easy and affordable financing options so you can pay for your purchase over time.

calendar icon

Affordable Monthly Plans

Buy now and pay for your purchase over time at competitive interest rates.

payment icon

No Prepayment Penalties

Pay for your purchase with monthly payments and prepay at any time without penalty.

calendar icon

Easy Application

Get a decision in seconds with no obligation to buy. Checking your rate won't affect your credit score. Your data is safe and encrypted.



Check your rate in seconds
without leaving our site

Questions? Visit Bread Pay™ help center.