Creating a BuyNow Hosted Checkout page

With the BuyNow Hosted Checkout solution, we enable you to build and manage your product catalog right in BlueSnap, and then to create checkout pages for your products.

Follow these setup steps:

1. Set up products and contracts

You'll begin by setting up a product and one or more contracts for that product. A product is an item you are selling. For example, if you sell video games, one of your games would be a product.

Each product has one or more contracts. You’ll set up a different contract for each version and price point of your product. In the contract, you'll define the settings such as the price, subscription plan type, or coupon options.

Each contract will have its own unique checkout page, or you can use our "Continue Shopping" skin if you'd like to enable shoppers to keep browsing and adding more items to the checkout page.

Example

If you sell Nintendo and PlayStation versions of a racing video game, you might set up one product for the game and then two contracts for the two versions (e.g. one Nintendo contract and one PlayStation contract). Each of those contracts would have a separate hosted checkout page with a different URL.

How

For details about products and contracts and how to set them up, see:

Tip: Set up just a couple of products in the Sandbox

If you are currently working in the Sandbox, we recommend that you save time by only setting up one or two products for testing purposes. When you are ready to move to Production, you can then set up your full product catalog there.

2. Customize your checkout page skins

Your checkout page skins, or templates, determine the look and feel of the checkout page, including fonts, colors, and more.

It is recommended to set up both a mobile and a desktop skin. BlueSnap will automatically detect the device the shopper is using and will display the relevant skin to the shopper for the optimal checkout experience.

  1. In the BlueSnap Merchant Console, go to Checkout Page > Page Design in the left menu. Click the Preview button on a skin to view it in more detail.

  2. In the Skin Library, click Select on the skin style you'd like to use.

Which skin to choose?

Make sure you choose the right skin according to your needs. Here are some tips:

Want to embed your checkout page within your own website? To enable this, choose the iframe Desktop Detailed skin. If you want the redirect to open in the top frame (i.e. the main window), make sure to select the Top frame redirect option when you set up your iframe skin. See Embedding a checkout page. Note that PayPal is not supported for the iframe.

Want to enable shoppers to keep browsing and adding more items to the checkout page? Use the Continue shopping Desktop skin.

Want to enable easier checkout by collecting minimal shopper info? Use the Desktop Slim and Mobile Slim skins.

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

  2. Click Customize.

  3. 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, quantity selection box, and more.

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

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

3. Apply the skin

To choose which skins will be used for checkout on mobile and desktop, you will need to apply them in the skin settings.

Skins apply to all contracts by default

By default, the skin settings apply across all contracts in your account. You can also apply a specific skin to a specific contract by inserting the skinid parameter in the checkout page URL, with the skin ID number as the parameter value. You can find the skin ID numbers in the Skin Library.

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

  2. Under the preview of your current applied skins, click Edit Settings.

  3. In the Applied skins section, select the desktop and mobile skins you want to use by default for all contracts.

  4. Click Save.

4. Launch and get paid

Nice work — you're almost ready to go!

There are a just few more key items that you'll want to handle before launch, such as the redirect, statement descriptor, fraud prevention, and real-time event-tracking via Instant Payment Notifications (IPNs).
See:
Redirect after a purchase
Statement descriptor
Fraud prevention service levels
About IPNs

Once you are ready to launch, you can either embed your checkout pages, or else connect them via a URL.
See:
Embedding a checkout page
Linking a checkout page to your site

Creating a BuyNow Hosted Checkout page