Customers don’t always provide enough details to answer their question on the first attempt, so wouldn’t it be great to see what they have in their shopping cart?

With just a few lines of JavaScript code, you can!

In this post we’ll show you how to include a link to the customer’s shopping cart in a Contact form, but we’re going to assume you already have a working contact form on your site.  If you don’t, start with this blog post before moving on:

ShopSite Tip – Add a Contact Us Page
https://www.lexiconn.com/blog/2014/08/shopsite-tip-add-a-contact-us-page/

Step 1 – Grab The Cookie

The shopping cart contents are saved on the server and linked to the customer by a browser cookie, which saves the shopping basket ID number.  In order to view the cart that cookie value must be obtained.

We’re going to add our own cookie to save that value, and to do that copy the code below and paste it into the “Text at the top of the shopping cart” field on the Commerce > Order System > Shopping Cart screen:

<script language="javascript" type="text/javascript">
    /** Save SBID in cookie **/
    var d = new Date();
    d.setTime(d.getTime() + (365*24*60*60*1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = "lex_sbid="+ss_sbid+"; "+expires+"; path=/"; 
</script>

What this does:  This creates a cookie on the user’s computer which saves their SBID value so we can get it later on the contact form.

Step 2 – Build Your View Cart Link

Before we can update the contact form, we need to build your View  Cart link.  As with most topics, we have a blog post showing how to do that:

ShopSite Tip – The View Cart Link
https://www.lexiconn.com/blog/2011/11/shopsite-tip-the-view-cart-link/

Go ahead and follow those details and make your view cart link.  When you’re done it should look like this:

https://www.lexiconn.com/cgi-lexiconn/sb/order.cgi?storeid=*1e719a74e60519d9acb1d407e39fd4ab5c&function=show

Got it?   Now add “&sbid=” on the end, so it looks like this:

https://www.lexiconn.com/cgi-lexiconn/sb/order.cgi?storeid=*1e719a74e60519d9acb1d407e39fd4ab5c&function=show&sbid=

Done?  Great, keep that handy and move on to the next step.

Step 3 – Add A Contact Form Field

In your contact form code, right before the closing </form> line insert this code:

<script language="javascript" type="text/javascript">
 /** Get cookie and build link **/
 function lexgetsbid() {
 var name = "lex_sbid=";
 var ca = document.cookie.split(';');
 for(var i=0; i<ca.length; i++) {
 var c = ca[i];
 while (c.charAt(0)==' ') c = c.substring(1);
 if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
 }
 return "";
 }
 var lex_sbid = lexgetsbid();
 var lex_viewcartbase = '*** Your Shopping Cart Link Goes Here ***';
 if (lex_sbid.substr(0,5) == 'SSMSB'){
 document.write('<input type="hidden" name="View Cart" value = "' + lex_viewcartbase + lex_sbid + '">');
 }
 </script>

Replace the “*** Your Shopping Cart Link Goes Here ***” text with your View Cart url, the one ending in “&sbid=”.

When finished, that line of code will look like this, but with your values:

var lex_viewcartbase = ‘https://www.lexiconn.com/cgi-lexiconn/sb/order.cgi?storeid=*1e719a74e60519d9acb1d407e39fd4ab5c&function=show&sbid=';

Don’t forget to publish your contact page if the form is made by ShopSite.

What this does:  This adds a hidden field to your contact form called “View Cart” and fills it with the URL to your view cart link, with the user’s shopping basket ID on the end.  This allows you to follow that link to view their cart contents.

NOTE: The link will only be included in the form code if they have viewed the cart on your site.  If they have not gone to the shopping cart screen the field will not be added to the form.

Step 4 – Test Your Form

You’re done, but be sure to test everything.  To test this you will need to add a product to your shopping cart and view the cart, which will create the cookie.  Then fill out your contact form and it will now include the View Cart link in the email it sends.

Now if a customer has an error in the shopping cart, or has a question that viewing what they are trying to order will help answer you can click the link and see what they see!

TIP:  Be careful, don’t add/remove items from their cart unless you tell them, otherwise that could be surprising for the customer.

TIP:  You may want to open the View Cart link in a Chrome Incognito or Firefox Private Browsing window, so your own computer doesn’t save the customer’s cookie.