Template Pages

Change the design of your Quick View Cart Page

Purpose: The "View Cart Preview" is a feature that shows the shopper a summary of their cart without having to leave the product page. It functions as each item is added to the cart and the setting may be enabled in the Online Store Manager's Settings ->General ->Store Settings area.

Notes: The design elements present in the template are virtually identical to the regular "view_cart.html" template.

Note: It is important to preserve the commented tags to ensure the software performs correctly.

For example:

        [TITLE]
        [META]
        [template]
        [stylesheet]
        [viewcart_quick-header]
        [shoppingcart_items]
        [shoppingcart_quantity]
        [shoppingcart_price]
        [shoppingcart_total]
    <!--START: SHOPPING_CART_ITEM-->
        [ITEM_CATALOGID]
        [THUMBNAIL]
        [ITEM_NAME]
      <!--START: itemoptions-->
        [ITEM_ID]
        [OPTIONS]
      <!--END: itemoptions-->
        [ITEM_QUANTITY]
        [ITEM_PRICE]
        [ITEM_SUBTOTAL]
    <!--END: SHOPPING_CART_ITEM-->
        [shoppingcart_updatecart]
        [viewcart_quick-title]
        [viewcart_quick-itemsincart]
        [CARTSUBTOTAL]
        [viewcart_continue-shopping]
        [continue_url]
        [viewcart_checkout-button]
    <!--START: FEATURE_MENU-->
        [viewcart_feature-header]
      <!--START: CATEGORY_ITEMS-->
        <!--START: ITEM_TEMPLATE_0-->
          [catalogid]
          [THUMBNAIL]
          [name]
          <!--START: ITEMPRICE-->
            [product_yourprice]
            [ITEMPRICE]
          <!--END: ITEMPRICE-->
          <!--START: SALEPRICE-->
            [product_yourprice]
            [ITEMPRICE]
            [product_onsale]
            [ITEMSALEPRICE]
          <!--END: SALEPRICE-->
        <!--END: ITEM_TEMPLATE_0-->
      <!--END: CATEGORY_ITEMS-->
    <!--END: FEATURE_MENU-->

Note: Code blocks and their respective variables will only work with specific template pages.

Note: Some of these variables are used in multiple places on the page, with their dynamic content controlled by the code block used in each instance. Also, many of the variables are dynamically inserted from your cart's Settings ->Design ->Store Language section.

  • [TITLE] - Dynamically inserts and references the individual page titles during navigation.
  • [META] - Dynamically inserts and references the individual page META tags during navigation.
  • [template] - This Variable dynamically inserts the design Theme's folder name wherever a path to the theme folder needs to be specified. (Settings ->Design ->Themes & Styles)
  • [stylesheet] - Dynamically inserts the Theme's applicable CSS file. (Settings ->Design ->Themes & Styles)
  • [viewcart_quick-header] - Displays the Title of the "The following item(s) has been added to your cart:" heading of the modal. (See Settings ->Design ->Store Language)
  • [shoppingcart_items] - Displays the Title of the "Items" header column. (See Settings ->Design ->Store Language)
  • [shoppingcart_quantity] - Displays the Title of the "Qty" header column. (See Settings ->Design ->Store Language)
  • [shoppingcart_price] - Displays the Title of the "Price" header column. (See Settings ->Design ->Store Language)
  • [shoppingcart_total] - Displays the Title of the "Total" header column. (See Settings ->Design ->Store Language)
  • [ITEM_CATALOGID] - Used by the Software to reference the item database ID information.
  • [THUMBNAIL] - Inserts the thumbnail image of the product(s).
  • [ITEM_NAME] - Inserts the Item Name information.
  • [ITEM_ID] - Used by the Software to reference the the item SKU information.
  • [OPTIONS] - Used by the Software to insert selected product options. (A link will be provided to show or hide selected options)
  • [ITEM_QUANTITY] - Inserts the total number of item units added to cart.
  • [ITEM_PRICE] - Inserts the individual item unit price.
  • [ITEM_SUBTOTAL] - Inserts the added item subtotal.
  • [shoppingcart_updatecart] - Displays the Title of the "Update Cart" link/button. (See Settings ->Design ->Store Language)
  • [viewcart_quick-title] - Displays the Title of the "Quick Cart" heading of the modal. (See Settings ->Design ->Store Language)
  • [viewcart_quick-itemsincart] - Displays the Title of the "X item(s) in your shopping cart" section of the modal. (See Settings ->Design ->Store Language)
  • [CARTSUBTOTAL] - Inserts the entire cart's subtotal.
  • [viewcart_continue-shopping] - Displays the Title of the "Continue Shopping" link/button. (See Settings ->Design ->Store Language)
  • [continue_url] - Used by the Software to insert the applicable "Continue Shopping" action destination. (See Settings ->General ->Store Settings)
  • [viewcart_checkout-button] - Displays the Title of the "Proceed to Checkout" link/button. (See Settings ->Design ->Store Language)
  • [viewcart_feature-header] - Displays the Title of the View Cart page's "You May Also Like" section. (See Settings ->Design ->Store Language)
  • [catalogid] - Used by the Software to reference the product Database ID information for the Featured Items section.
  • [name] - When multiship to is enabled and applicable, this variable will insert the shipping destination's name into the view cart page. (Items will be listed with their respective destinations.)
  • [product_yourprice] - Displays the Title of the "Your Price" heading for the featured items area. (See Settings ->Design ->Store Language)
  • [ITEMPRICE] - Inserts the Feature Item price information.
  • [product_onsale] - Displays the Title of the "On sale" heading for the featured items area. (See Settings ->Design ->Store Language)
  • [ITEMSALEPRICE] - Inserts the Item On Sale Price information.

Download this Template     (Save as a backup or edit to customize)

Screenshot of the view_cart_quick.html Template