Search results for "{{ search.query }}"

No results found for "{{search.query}}". 
View All Results

Setting up a BuyNow Hosted Payment Page

Follow these steps to set up a Hosted Payment Page:

  1. Build the payment page with the required parameters
  2. Define the look & feel of your page
  3. Set up the Callback URL (redirect after purchase)
  4. Launch & get paid

1. Build the payment page with the required parameters

To generate the payment page, you'll send a GET request to the URL of the relevant BlueSnap environment (see below for the URL format). The steps in this section describe how to build the payment page URL. If you would rather generate the payment page by sending a POST request, click here.

Sandbox: https://sandbox.bluesnap.com/buynow/checkout?enc={encrypted token}&merchantid={merchant ID}
Production: https://www.bluesnap.com/buynow/checkout?enc={encrypted token}&merchantid={merchant ID}

Prerequisites

1.1: Get the encrypted token

The Encrypt Parameters API allows you to generate an encrypted token for various BuyNow parameters, such as the order amount, so you can transmit sensitive information securely in the URL and protect against shopper manipulation. Follow the example below to generate an encrypted token for the order amount.

Specifying currency

By default, the amount is shown in USD. If you wish to specify a different currency, append the three-letter currency code to the end of the amount parameter value. For example: 128.25GBP

curl -v -X POST https://sandbox.bluesnap.com/services/2/tools/param-encryption \
-H 'Content-Type: application/xml' \
-H 'Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=' \
-d '
<param-encryption xmlns="http://ws.plimus.com">
  <parameters>
    <parameter>
      <param-key>amount</param-key>
      <param-value>125.00</param-value>
    </parameter>
  </parameters>
</param-encryption>'
curl -v -X POST https://ws.bluesnap.com/services/2/tools/param-encryption \
-H 'Content-Type: application/xml' \
-H 'Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=' \
-d '
<param-encryption xmlns="http://ws.plimus.com">
  <parameters>
    <parameter>
      <param-key>amount</param-key>
      <param-value>125.00</param-value>
    </parameter>
  </parameters>
</param-encryption>'

If successful, the response includes an encrypted token, as shown in the example below. Grab the token from the response and proceed to the next step.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<param-encryption xmlns="http://ws.plimus.com">
    <encrypted-token>KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D</encrypted-token>
</param-encryption>

1.2: Add the token to the payment page URL

Add the encrypted token to the payment page URL in the enc parameter. In addition, include your merchant ID in the merchantid parameter.

For example:

https://sandbox.bluesnap.com/buynow/checkout?enc=KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D&merchantid=500801
https://www.bluesnap.com/buynow/checkout?enc=KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D&merchantid=500801

You can pass additional parameters in the checkout page URL if you wish. For example, you might use metadata parameters to display tax and shipping amounts.

1.3: Connect the payment page to your website

To launch the payment page, send a GET request to the payment page URL that you just built. You can do this by either linking the payment page to your website or by embedding it on your website within an iFrame.

Linking payment page to your website
Typically, your website will have a "Check Out" (or similar) button, and when the shopper clicks on this button, they will be directed to the payment page. One way to accomplish this is to create an <a> element and set its href attribute to the payment page URL.

For example:

<a href="https://sandbox.bluesnap.com/buynow/checkout?enc=KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D&merchantid=500801">Check Out</a>

Embedding payment page on your website
You can embed the payment page on your website to give the shopper the feeling of never leaving your site. To do this, create an <iframe> element and set its src attribute to the payment page URL.

For example:

<iframe src="https://sandbox.bluesnap.com/buynow/checkout?enc=KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D&merchantid=500801"></iframe>

Generating payment page using a POST request

To generate the payment page using a POST request, you'll send the request to the URL for the relevant BlueSnap environment:

Sandbox: https://sandbox.bluesnap.com/buynow/checkout
Production: https://www.bluesnap.com/buynow/checkout

In the request body, you must pass the merchantid and amount parameters, with the values set to your merchant ID and the amount to charge on the payment page. For example: merchantid=500801&amount=125

By default, the amount is shown in USD. If you wish to specify a different currency, append the three-letter currency code to the end of the amount parameter value. For example: amount=126.84GBP

The response will be the HTML page (the checkout page).

POST https://sandbox.bluesnap.com/buynow/checkout HTTP/1.0
User-Agent: HTTPTool/1.0
Content-Type: application/x-www-form-urlencoded
Content-Length: 106

merchantid=500801&amount=128.25&name1=Product&value1=$100&name2=Tax&value2=$8.25&name3=Shipping&value3=$20
POST https://www.bluesnap.com/buynow/checkout HTTP/1.0
User-Agent: HTTPTool/1.0
Content-Type: application/x-www-form-urlencoded
Content-Length: 106

merchantid=500801&amount=128.25&name1=Product&value1=$100&name2=Tax&value2=$8.25&name3=Shipping&value3=$20

To reconcile the transaction amount, use the Charge IPN (Webhook), which will be sent when the purchase has been completed.

Additional supported parameters

In addition to the merchantid and enc parameters, you can also pass the following:

Metadata parameters
You can pass custom metadata parameters in the format: &name1=XXXXX&value1=XXXXX
A maximum of 20 name/value pairs is supported. The name and value will appear in the order information section of the payment page (name in the left column and value in the right column). For example, the order information will appear as shown below if you send these parameters:

enc=KnSMKJI6HMMF%2FXW0XNsHLw%3D%3D&merchantid=500801&name1=Nintendo%20Game&value1=$100&name2=Shipping&value2=$20&name3=Tax&value3=$5

Note: If you send amounts in the metadata parameters, as shown in the example above, these amounts will NOT be added to the total. The total shows only the value you defined for the amount parameter (see Step 1.1: Get the encrypted token).

BuyNow parameters
These are predefined parameters that you can use in order to control aspects of the page, such as the available payment methods, language, and so on. See BuyNow parameters.

Note: Since you are hosting your own product catalog, any BuyNow parameters related to product and contracts are not relevant. These include:

  • addcd
  • cart.open
  • cartvisible
  • cdodvisible
  • couponboxvisible
  • couponcode
  • edwvisible
  • promotionsvisible
  • scid
  • shoppingcarttotalvisible
  • showupsaleprices
  • skinId
  • sku[contractID]
  • sku[contractID]ald
  • sku[contractID]name
  • upsalevisible

2. Define the look & feel of your page

Your checkout page skin determines the look and feel of the checkout page, including fonts, colors, and more. To set up the page skin, follow the steps:

  1. In the BlueSnap Merchant Console, go to Checkout Page > Page Design on the left menu.

  2. The first time you enter this page, you'll see the question "Are you going to host your product catalog on BlueSnap?" Select No.

  3. In the Skin Library, click Select on the Payments Page skin.

  4. Give the skin a name and click Save.
    Your new skin appears in the library and can be customized.

  5. Click Customize.

  6. You can now edit the fonts and colors, upload your company logo, and choose whether to show or hide options like the currency and language menus.

  7. Optionally, you can preview the entire checkout flow by clicking Start Test BuyNow Flow at the bottom of the checkout page preview.

  8. When you have finished customizing the skin, click Save.

3. Set up the Callback URL (redirect after purchase)

When a shopper completes a purchase, you may want to redirect that shopper to a specific URL, like the home page of your website, a product page from your site, or a different page that provides more information or offers to the shopper.

You can do this by configuring a setting called the Callback URL in your BlueSnap account. If you do not set up a Callback URL, the shopper will be redirected to the default BlueSnap sale confirmation page.

How

  1. In the BlueSnap Merchant Console, go to Checkout Page > Page Design in the left menu.

  2. Click Edit Settings.

  3. In the Callback URL field, enter the URL where you want to redirect the shopper, along with any parameters that you want to pass in the URL. For the full list of available parameters, see Callback URL Parameters. Following is an example that shows the format of the Callback URL:
    https://www.domain.com?invoiceId=!{invoice.id}&name=!{shopper.firstName}

  1. From the Auto redirect menu, choose whether you want the shopper to be automatically sent to the CallBack URL when the purchase is complete. If not, the shopper will need to click Continue in order to be redirected.

  2. Click Save.

4. Launch & get paid

There are a few more key items that you'll want to handle before launch, such as the statement descriptor, fraud prevention, and real-time event-tracking via Instant Payment Notifications (IPNs).

Setting up a BuyNow Hosted Payment Page