Overview
When creating a Quickclick button you may link the specific button to an item in order for the end customer to add the product to the Quickclick Shopping cart. By default once the submit button has been selected the Quickclick button will automatically redirect the customer to the checkout page. If the customer was hopping to purchase additional items this may become tedious as the customer will need to redirect back and forth to add multiple products or they may need to checkout multiple times.
However, with Quickclick you may edit your auto generated buttons to simply add a product to the cart without redirecting the customer to the checkout page, until they are ready to checkout!
Editing the Button Code
Upon creating a Quickclick button you are provided the Quickclick button code, which may appear like this by default:
<form action="https://secure.nmi.com/cart/cart.php" method="POST"> <input type="hidden" name="key_id" value="Key ID will automatically be added here" /> <input type="hidden" name="action" value="process_fixed" /> <input type="hidden" name="amount" value="1.00" /> <input type="hidden" name="order_description" value="Test Item" /> <input type="hidden" name="language" value="en" /> <input type="hidden" name="customer_receipt" value="true" /> <input type="hidden" name="hash" value="action|amount|order_description|312d27d7f2a13bd53c5dd1faeafd7f1c" /> <input type="submit" name="submit" value="Buy Now" /> </form>
When selecting the submit button on this generated Quickclick button, customers will add the item to their cart and be redirected for checkout automatically.
If you are hopping to allow the customer to add multiple items to their shopping cart, you will need to make some changes to the default button code provided by Quickclick. The edit includes changing the Process value shown as <input
type="hidden" name="action" value="process_fixed" />
.
This process_fixed
value will need to be changed to process_cart
. The process_cart
value will add one or more products to the customer's cart.
action | show_cart: Displays the customer's shopping cart. |
process_cart: Adds one or more products to the customer's cart. | |
process_variable: This processes a variable amount transaction. During the checkout process, the cardholder is given the ability to specify the amount. This is useful for donations. | |
process_fixed: This processes a fixed amount, single item transaction. This is basically a "Buy Now" type transaction. The customer is not able to specify an amount during checkout. |
For a full list on all of the Quickclicks action values, you may find this within the Quickclick section of the integration guide.
In addition to changing the value for the cart you will also need to create a "dummyframe" better known as an iframe which will be added to the button code. This is important as this will prevent the cart from posting and redirecting directly to the Quickclick checkout page.
To do so you will need to create the "dummyframe", which would follow the standard rules of creating an iframe. Here is an example of setting a "dummyframe":
<iframe name="dummyframe" id="dummyframe" style="display: none;"></iframe>
Note: For more information on iframes and how to create them, we would recommend reviewing HTML documentation from your preferred site.
Once you've created the "dummyframe" you will then need to add a target (The target attribute specifies where the linked document will open when the link is clicked) to the Quickclick form action at the top of the Quickclick button code. Here is an example of how it should look:
<form action="https://secure.nmi.com/cart/cart.php" target="dummyframe" method="POST">
Once you have made the needed changes your Quickclick button code will appear as:
<form action="https://secure.nmi.com/cart/cart.php" target="dummyframe" method="POST">
<input type="hidden" name="key_id" value="Key ID will automatically be added here" />
<input type="hidden" name="action" value="process_cart" />
<input type="hidden" name="amount" value="1.00" />
<input type="hidden" name="order_description" value="Test Item" />
<input type="hidden" name="language" value="en" />
<input type="hidden" name="customer_receipt" value="true" />
<input type="hidden" name="hash" value="action|amount|order_description|312d27d7f2a13bd53c5dd1faeafd7f1c" />
<input type="submit" name="submit" value="Add to Cart" />
</form>
Create a Go to Cart Button
Once you have set up your Quickclick buttons as shown above, you will now need to work on a "show cart" button. This button will be used to bring customers to the Quickclick checkout page in order to confirm their information and complete their transaction.
In order to do this you will need to create a HTML form and use this form to post to the Quickclick Shopping Cart endpoint. Additionally you will need to provide three input types, one for the key id, another for the cart type (i.e process_cart
, show_cart
) and finally a submit button.
For this specific button type you will need to use the value show_cart
as this value displays the customer's shopping cart. Here is an example of how this button code should appear:
<form method=post action="https://secure.nmi.com/cart/cart.php">
<input type="hidden" name="key_id" value="Key ID will automatically be added here">
<input type="hidden" name="action" value="show_cart">
<input type="submit" value="View Cart">
</form>
Once this button is selected you will then be redirected to the Quickclick checkout page in order to complete the transaction, with all the added items in your cart.