Snippets: How to Add a Shopping Cart Summary to Your Store Design

Last Updated: Jul 10, 2014 02:26PM EDT

Overview


Your customers will appreciate having a quick summary of what they have added to their shopping cart shown on every storefront page, so that they know at all times what the total of their order is at that time.

This useful code snippet shows how many items have been added to the cart, the current order total, a link to view the shopping cart details, and one to start the checkout process.

You can add this dynamic interface element to your store interface by including the following line of code (you will find it in the default footer.asp file):
<!--#include file="smallCart.asp"-->
 

Styling the cart summary


If your store uses a customized graphical interface (very common), copy the following style and paste it into any of the CSS documents loaded by your customized version of header.asp (e.g. pcStorefront.css). Edit the style definition as you wish to change the look of the small shopping cart summary.
#pcShowCart { background-color: #FFFFAA; color: #666666; padding: 5px 5px 5px 10px; margin-bottom: 5px; }
 

Hiding the small shopping cart on the "View Cart" page


If you want to hide the small shopping cart on the “View Shopping Cart” page (viewCart.asp), you can do so with a simple code change to the file smallCart.asp, which is located in the pc folder. NOTE: the following only works if smallCart.asp is included in footer.asp, not if it's included in header.asp (due to the fact that the pcStrPageName is empty when header.asp is first loaded).
  • Download the file using your favorite FTP software and make a back-up copy of it
  • Open it with notepad or your favorite HTML editor
  • Locate the opening ASP code tag at the very top of the page:
    <%
  • Add the following just below it:
    IF pcStrPageName <> "viewcart.asp" THEN
  • Locate the closing ASP code tag at the very bottom of the page:
    %>
  • Add the following just above it:
    END IF
  • Save the file and re-upload it to the storefront
  • This conditional statement makes ProductCart completely ignore the code located inside the statement if the page is the “View Shopping Cart” page, which means that the small shopping cart will be hidden on that page.
647e99095133bd6d1ae916f97dc7f92f@productcart.desk-mail.com
https://cdn.desk.com/
false
desk
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete