Home > Infusionsoft > Custom Storefront for the Infusionsoft Shopping Cart

Custom Storefront for the Infusionsoft Shopping Cart

March 21st, 2010

The Infusionsoft shopping cart is one of the weakest parts of Infusionsoft!

Fortunately, there is a work around that let’s you use their checkout and still have the other great parts of Infusionsoft — Marketing automation and email marketing. Here’s what you do:

  • Code your own custom storefront and cart
  • When the customer clicks Checkout, pass their shopping cart to Infusionsoft’s cart checkout
  • Lock Infusionsoft’s cart to prevent the customer from changing quantities

Code your own Storefront and Cart

You can modify one of the open source shopping cart solutions or create your own. This is potentially a broad topic, so if you want to know more, please leave me a question or a comment. The key things that are required are:

  • Ways for customers to find the products they want and add them to their cart
  • A way to store the products and quantities they have selected
  • A shopping cart page that let’s them see the items they are purchasing and add or remove items
  • A checkout button that will take them to the Infusionsoft checkout page.

Pass the Shopping Cart Information to Infusionsoft

Now, we have to get the products and quantities from your custom cart into Infusionsoft. Essentially, all you have to do is pass the products and quantities to Infusionsoft via URL parameters. Here is the base URL.

https://YourApp.infusionsoft.com/cart/?update=true&l=n&cart_skin=1&clear=true&Order0_OrderID=123

In this case, I’m also passing in an OrderID which is a custom order field I created in Infusionsoft. Then, add the following for each product:

&product_id=456 &p456_qty=2

I highlighted in red the values that have to be dynamically inserted. Now, when the user clicks checkout, you build this URL, and send them to the URL.

Lock the Infusionsoft Shopping Cart

There’s just one problem. You may not want the customer to change the quantities on the Infusionsoft side. Here’s a trick that let’s you lock the Infusionsoft checkout page. Enter the following javascript in HTML Area-1 in your shopping cart skin:

[cce_js]
<script type="text/javascript" language="javascript">
	var elem = document.getElementById('theOneForm').elements;
	for(var i = 0; i < elem.length; i++) {
		if ( right(elem[i].name, 4) == '_qty' ) {
			elem[i].disabled=true;
		}
	}

	//Overrides the remove(key) function
	function remove(key) {
		alert('Please Click Continue Shopping to modify quantities or remove items.');
	}

	function right(str, n){
		if (n <= 0)
			return "";
		else if (n > String(str).length)
			return str;
		else {
			var iLen = String(str).length;
			return String(str).substring(iLen, iLen - n);
		}
	}
</script>
[/cce_js]

This script will:

  • Find all the quantity fields on the form and disable them
  • Override the remove link

It’s not a perfect solution, but it does work!

If you need a better, more complete shopping cart, the best thing is to use a 3rd party shopping cart (Like Volusion or many others), and then use the Infusionsoft API to get relevant data into Infusionsoft.

Please leave me a comment below if this is helpful!

Clarke Bishop Infusionsoft ,

  1. March 21st, 2010 at 16:32 | #1

    And the other alternative you now have is to use the Infusionsoft Shopping Cart Integrator from http://www.dmatechnology.com, allowing you to use many 3rd party carts with Infusionsoft

  2. June 11th, 2010 at 11:28 | #2

    Clarke Bishop you are the man! We’ve recreated the order process on our site so clients can order from our site and then it puts them over to Infusion to finish the order. However, we were looking for a solution so that clients couldn’t change the quantity once they were in Infusion’s Shopping cart.

    Your solution worked like a charm! Thank you for sharing this information with everyone!

  3. July 7th, 2010 at 14:54 | #3

    Clarke – Your solutions has been really helpful. One small problem. In Firefox the shopping cart displays this: [cce_js] [ /cce_js]

    Is there any way to hide these opening and closing tags?

  4. August 14th, 2010 at 15:53 | #4

    Chad, the tags you mentioned, [cce_js] [ /cce_js], are actually for code coloring on my blog. They aren’t really part of the script. You can safely delete them from your Infusionsoft shopping cart.

    Sorry for the confusion!

  5. August 23rd, 2010 at 19:35 | #5

    I have questions about the order number. Is the value generated locally? How are new order numbers generated for the same user?

  6. August 27th, 2010 at 08:35 | #6

    In this example this order number was generated by my storefront code.

    I passed it to Infusionsoft via the URL like this Order0_OrderID=12345. Infusionsoft will automatically add the information to the custom order field I had already created.

  7. Patrick
    November 8th, 2010 at 08:19 | #7

    Question: why do you not want people to adjust quantities on the InfusionSoft shopping cart side?

  8. Patrick
    November 8th, 2010 at 08:38 | #8

    Another question: by doing it this way will my product Action Sets get called automatically by the InfusionSoft check-out function?

  9. December 6th, 2010 at 16:10 | #9

    There are times you might not want someone to adjust the quantities.

    For example, a quantity other than 1 wouldn’t make sense. A company that sells business coaching wouldn’t want to sell multiple subscriptions — It just wouldn’t make sense.

    Or, you might have a one per customer special.

    Or, you have your own storefront and shopping cart, and just want to use Infusionsoft for checkout.

  10. December 6th, 2010 at 16:13 | #10

    Yes, from Infusionsoft’s perspective, it is the same as any other checkout. So, if you have Successful Purchase actions, or product purchase actions, they would still run.

  1. No trackbacks yet.