Page Linking Options (Linking to Your FastSpring Store)

Overview

This article will teach you about the different ways that you can link your website to your secure, hosted FastSpring order pages.

Page Linking Options

You can link from your website to the FastSpring order process in six different ways. Page linking options represent different order flows, designed to suit a variety of business needs. Details for each option are provided below.

To see the different page linking options, go to SpringBoard's Store Home » Products and Pages » select a product » View Additional Page Linking Options

productsandpages.pngviewadditional.png

Simply copy and paste the HTML code for one of the link options into the web page that will host the purchase button / link. While you may use your own graphics to link to FastSpring, we have created several purchase buttons which you are welcome to use.

Option 1: View Product Detail Page

This option links to the product detail page (your product's name, price, description, image, etc).

When a customer clicks Order Now, the second page will ask for the customer's information and the payment method.

When a customer clicks Next, the third page will review the order (and allow a customer to make changes) and is where credit card or other payment information is entered by the customer.

When a customer clicks Complete Order, the fourth page will display a receipt with any web-based fulfillment information, such as license codes or download links, that you have set up.

option1_1.png option1_2.png option1_3.png

Sample Code

In these examples, the company ID is julie and the product's Partial URL Path Name is fontmaker.

HTML that may be embedded into an existing web page:

<a href="http://sites.fastspring.com/julie/product/fontmaker" target="_top">Purchase</a>

URL that may be linked to from an existing web page:

http://sites.fastspring.com/julie/product/fontmaker

Option 2: Add Product to Order and Checkout

This option provides a shorter order process and skips the page which shows the product details (your product's name, price, description, image, etc.).

When a customer clicks Order Now, the second page will ask for the customer's information and the payment method.

When a customer clicks Next, the third page will review the order (and allow a customer to make changes) and is where credit card or other payment information is entered by the customer.

When a customer clicks Complete Order, the fourth page will display a receipt with any web-based fulfillment information, such as license codes or download links, that you have set up.

option2_1.png option2_2.png

Sample Code

In this example, the company ID is julie and the product's Partial URL Path Name is fontmaker. This order flow utilizes a form with POST method rather than a simple hyperlink.

HTML that may be embedded into an existing web page:

<form method="POST" action="http://sites.fastspring.com/julie/product/fontmaker?action=order" target="_top">
<input type="submit" value="Purchase" /></form>

Option 3: Short Order Process

This option is the shortest order process that FastSpring offers.

It combines everything into one page, including the product details (your product's name, price, description, image, etc), the customer's information and customer's payment information.  

When a customer clicks Next, the second page will review the order (and allow a customer to make changes) and is where credit card or other payment information is entered by the customer.

When a customer clicks Complete Order, the third page will display a receipt with any web-based fulfillment information, such as license codes or download links, that you have set up.

option3_1.png option3_2.png

Sample Code

In these examples, the company ID is julie and the product's Partial URL Path Name is fontmaker.

HTML that may be embedded into an existing web page:

<a href="https://sites.fastspring.com/julie/instant/fontmaker" target="_top">Purchase</a>

URL that may be linked to from an existing web page:

https://sites.fastspring.com/julie/instant/fontmaker

Option 4: Shopping Cart - Add Product to Order

This option skips the page which shows the product details (your product's name, price, description, image, etc.). This option is used with a “Continue Shopping” button on the order page, so that your customers can go back to your site and add more products to their cart.

When a customer clicks Order Now, the second page will ask for the customer's information and customer's payment information. 

When a customer clicks Next, the third page will review the order (and allow a customer to make changes) and is where credit card or other payment information is entered by the customer. 

When a customer clicks Complete Order, the fourth page will display a receipt with any web-based fulfillment information, such as license codes or download links, that you have set up.

option4_1.png

option4_2.png

option4_3.png

Sample Code

In these examples, the company ID is julie and the product's Partial URL Path Name is fontmaker. This order flow utilizes a form with POST method rather than a simple hyperlink.

HTML that may be embedded into an existing web page:

For display as button:

<form method="POST" action="http://sites.fastspring.com/julie/product/fontmaker?action=add" target="_top">
<input type="submit" value="Add to Order" /></form>

For display as link:

<form method="POST" action="http://sites.fastspring.com/julie/product/fontmaker?action=add" target="_top">
<a href="http://sites.fastspring.com/julie/product/fontmaker?action=adds" onclick="this.parentNode.submit();
return false;">Add to Order</a></form>

5: Shopping Cart - View Product Detail Page

This option is very similar to option 4, but it links to the page which shows the product details (your product's name, price, description, image, etc.). This option is used with a “Continue Shopping” button on the order page, so that your customers can go back to your site and add more products to their cart.

When a customer clicks Add to Order, the second page will allow the customer to remove a product or update the quantity to be purchased.

When a customer clicks Order Now, the third page will ask for the customer's information and customer's payment information. 

When a customer clicks Next, the fourth page will review the order (and allow a customer to make changes) and is where credit card or other payment information is entered by the customer. 

When a customer clicks Complete Order, the fifth page will display a receipt with any web-based fulfillment information, such as license codes or download links, that you have set up.

option4_1.png

option4_1.png

option5_3.png

option5_4.png

Sample Code

In these examples, the company ID is julie and the product's Partial URL Path Name is fontmaker.

HTML that may be embedded into an existing web page:

<a href="http://sites.fastspring.com/julie/product/fontmaker?action=adds" target="_top">Add to Order</a>

URL that may be linked to from an existing web page:

http://sites.fastspring.com/julie/product/fontmaker?action=adds

Option 6: Create Order API (Advanced)

The create order API may be used to pass one or more products to the shopping cart, finally landing on either the order contents page (shopping cart), or the checkout / customer information page. For each call, any existing order is either cleared and its contents are completely replaced or modifies existing contents. This is a useful option if you have your own forms where the customer is choosing multiple products and/or quantity.

Parameter Notes

  • operation: Use the value "create" to always replace the order contents, or the value "update" to add or modify order contents

  • destination: Controls the landing page and may be either "contents" or "checkout" (see images on right)

  • product_X_path, product_X_quantity: Increment the value of X to pass in more than one product

  • mode: Optionally use a hidden input field with the name "mode" and value of "test" to activate test purchases; this will allow you to run a real test payment by entering in your SpringBoard username and password

  • Optional Customer Information: Customer information may be optionally passed in via these specific parameters: 
    • contact_fname: customer's first name
    • contact_lname: customer's last name
    • contact_company
    • contact_email
    • contact_phone

Note: These are the only optional parameters. There are no parameters for address or payment information.

Contents Landing Page:

option4_1.png

Checkout Landing Page:

option5_3.png

Sample Code

In these examples, the company ID is julie and the product's Partial URL Path Name is fontmaker. More often than not, you would not directly be using the example HTML forms below, but instead you would be generating their equivalent with some dynamic programming language, like PHP, JavaScript, C#/.NET.

Example Form with Quantity Box:

<form method="POST" action="http://sites.fastspring.com/julie/api/order">
<input type="hidden" name="operation" value="create"/>
<input type="hidden" name="destination" value="contents"/>
<p>
<input type="hidden" name="product_1_path" value="/fontmaker">
<input type="text" name="product_1_quantity" value="1"/> Font Maker 1.0
</p>
<p>
<input type="submit" value="Order Now"/>
</p>
</form>

Example Form with Checkbox:

<form method="POST" action="http://sites.fastspring.com/julie/api/order">
<input type="hidden" name="operation" value="create"/>
<input type="hidden" name="destination" value="contents"/>
<p>
<input type="checkbox" name="product_1_path" value="/fontmaker"/> Font Maker 1.0
</p>
<p>
<input type="submit" value="Order Now"/>
</p>
</form>
Have more questions? Submit a request

Comments

Powered by Zendesk