Binkey Bigcommerce Setup

Application setup

Application configuration

  1. Install the Binkey Pay application from the BigCommerce app store

  2. In BigCommerce, open the Binkey Pay application by clicking on it

  3. Enter the API key

  4. Choose the pages to show eligibility labels

  5. Click the Save settings button

The application is configured.

Binkey payment creation

  1. In the Bigcommerce configuration, click Settings → Payments → Offline Payment Method

  2. In the Check section, click the Setup button

  3. In the opened page, set

    1. Payment display name: Binkey

    2. Payment information: Binkey Payment

    3. Country: USA

  4. Click the Save button

Binkey payment method is created.

Custom Themes Support

If the shop has some custom theme applied that doesn't allow modifying the theme's blocks. Because of that, you are not able to see eligibility labels on pages. To fix it you can use the "script solution" described below but only for the three pages: PDP, cart, and checkout

First, you need to find source files that could be named and placed based on a custom theme applied. For example, for the “cornerstone” theme these files are placed and named:

  • compononents/products/product-view.html

  • pages/cart.html

  • pages/checkout.html

Next, you should paste the scripts below into the appropriate files respectively.
Please note: You are responsible for pasting the scripts above in the appropriate place within the files' code. If labels display in the wrong place try to move scripts within the files

  1. Open Themes -> Active Template -> Edit theme files

  2. Open the PDP-related file and paste the script below

    <script
         defer
         src="https://bc.bursment.dev.binkey.com/selfHosted.js"
         data-product-id="{{product.id}}"
         data-label-size="32"
    ></script>

    data-product-id - important for this case and should be found manually in the developer tools
    data-label-size - optional (by default 32 for that case)

  3. Open the cart-related file and paste the script below

    <script
        defer
        src="https://bc.bursment.dev.binkey.com/selfHosted.js"
        data-label-size="24"
        data-page="cart"
        data-class-name="cart-item-name"
    ></script>

    data-page - important for this case and should be found manually in the developer tools (show page which will show labels)
    data-class-name - important for this case and should be found manually in the developer tools (show className of elements which need to contain label)
    data-label-size - optional (by default 24 for that case)

  4. Open the checkout-related file and paste the script below

    <script
        defer
        src="https://bc.bursment.dev.binkey.com/selfHosted.js"
        data-label-size="16"
        data-page="checkout"
        data-class-name="product-title"
    ></script>

    data-page - important for this case and should be found manually in the developer tools (show page which will show labels)
    data-class-name - important for this case and should be found manually in the developer tools (show className of elements which need to contain label)
    data-label-size - optional (by default 16 for that case)

Troubleshooting the refund flow

Please note: In case a refund isn’t done successfully the system logs that information in Staff Notes (could be reachable via Orders → View, find the appropriate order and click the human icon next to Total or Action menu → View notes)