Application setup
Application configuration
Install the Binkey Pay application from the BigCommerce app store
In BigCommerce, open the Binkey Pay application by clicking on it
Enter the API key
Choose the pages to show eligibility labels
Click the Save settings button
The application is configured.
Binkey payment creation
In the Bigcommerce configuration, click Settings → Payments → Offline Payment Method
In the Check section, click the Setup button
In the opened page, set
Payment display name: Binkey
Payment information: Binkey Payment
Country: USA
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
Open Themes -> Active Template -> Edit theme files
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)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)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)