menu

Ecommerce Template Test Page

Welcome to the ecommerce template test. On this page you can find a bunch of information on making smart e-commerce templates. We have just highlighted some options, not all of them are listed.

Customers

Current User
$EcomConfig.Customer.ID
Current User
$EcomConfig.Customer.Email
Is Shop Admin?
$EcomConfig.Customer.IsShopAdmin
FALSE
Customer Linked to current order?
$EcomConfig.CustomerForOrder.ID
0

The Cart

The Cart can be accessed from any ContentController using, for example:

<% if Cart %>
    <% with Cart %>
        <% include Sidebar_Cart %>
    <% end_with %>
<% else %>
    <p>No cart was found!</p>
<% end_if %>

No cart was found!

Cart Info

Useful if you would like to display some information about the current cart ...

Link to display order
$Cart.Link
/cart/showorder/0/
Display Page
e.g. $Cart.DisplayPage.Title
Cart
Number of products in cart
$Cart.TotalItems
0
Number of items in cart
$Cart.TotalItemsTimesQuantity
0
More than one item in cart?
$Cart.MoreThanOneItemInCart
NO
Link to load unsubmitted order as current order
$Cart.RetrieveLink
http://silverstripe-ecommerce.com/shoppingcart/loadorder/0/
Sub-Total as currency object
$Cart.SubTotalAsCurrencyObject.Nice
$0.00
Sub-Total as money object
$Cart.SubTotalAsMoney.NiceDefaultFormat
$0.00
Extras as currency object
$Cart.ModifiersSubTotalAsCurrencyObject.Nice
$0.00
Extras as money object
$Cart.ModifiersSubTotalAsMoneyObject.NiceDefaultFormat
$0.00
Total as currency object
$Cart.TotalAsCurrencyObject.Nice
$0.00
Total as money object
$Cart.TotalAsMoney.NiceDefaultFormat
$0.00
Total Paid as currency object
$Cart.TotalPaidAsCurrencyObject.Nice
$0.00
Total Paid as money object
$Cart.TotalPaidAsMoney.NiceDefaultFormat
$0.00
Total Oustanding as currency object
$Cart.TotalOutstandingAsCurrencyObject.Nice
$0.00
Total Oustanding as money object
$Cart.TotalOutstandingAsMoney.NiceDefaultFormat
$0.00
Country for current order
$Cart.Country / $Cart.FullNameCountry
/ [COUNTRY NOT FOUND]

Submitted Order Info

Useful if you would like to display some information about the a Submitted Order. For this example, we have created a method SubmittedOrder in the Controller. This method returns a random submitted order for the use of displaying the information below. Some links and other methods may not work as they are unavailable for the Order at hand.

Order Title
$SubmittedOrder.Title
Email Address for communication with customer
$SubmittedOrder.OrderEmail
Link for submitted order that can be used in Emails
$SubmittedOrder.EmailLink
Link for submitted order for printing
$SubmittedOrder.PrintLink
Link for submitted order for packing slip
$SubmittedOrder.PackingSlipLink
Link for submitted order for sharing
$SubmittedOrder.ShareLink
Link for submitted order to delete it
$SubmittedOrder.DeleteLink
Link for submitted order to copy it
$SubmittedOrder.CopyOrderLink
Current Step
e.g. $SubmittedOrder.MyStep.Title
Is Paid
e.g. $SubmittedOrder.IsPaid
Is Cancelled
e.g. $SubmittedOrder.IsCancelled
Last step visible to customer (i.e. some steps are hidden, e.g. Check customer credit rating)
e.g. $SubmittedOrder.CurrentStepVisibleToCustomer.Title

Ecommerce Configurations

These configurations are set in a special DataObject in the database. They contain lots of settings, but here are the onest most useful for templates. These can be accessed from anywhere.

Shop Address
$EcomConfig.ShopPhysicalAddress
The Shop
1 main street
Coolville 123
Landistan
Receipt Email
$EcomConfig.ReceiptEmail
"Silverstrip E-comerce Demo" <sales@silverstripe-ecommerce.com>
PostalCodeURL
$EcomConfig.PostalCodeURL
http://tools.nzpost.co.nz/tools/address-postcode-finder/APLT2008.aspx
Postal Code Label
$EcomConfig.PostalCodeLabel
Check Code
Currency
$EcomConfig.Currency - you can also use Currencies for a list
NZD
Account Page Link
$EcomConfig.AccountPageLink
/checkout/my-account/
Checkout Page Link
$EcomConfig.CheckoutLink
/checkout/
Cart Page Link
$EcomConfig.CartPageLink
/cart/
Order Confirmation Page Link
$EcomConfig.OrderConfirmationPageLink
/checkout/confirmorder/
Default Image Link
$EcomConfig.DefaultImageLink
/assets/randomimages/img_252_116_170.png
Default Image @ Width = 100px
$EcomConfig.DefaultImage.SetWidth(100)
img_252_116_170.png
Current Customer Name
$EcomConfig.Customer.Title, instead of Title, you can also use Email, FirstName, etc...
Is E-commerce Page? (This will be TRUE (YES) for the Product and Checkout type pages only.)YES

Ajax Definitions

Ajax definitions are used to add IDs and Classes to html tags. When the cart updates the content of these HTML elements will be updated at the same time. An example would be a div with an ID like "number_of_items". The content of this div would automatically change when the number of items in the cart is updated. NOTE: many of these ajax definitions are meant to be used within the control (context) of an order, order item, or order modifier.

Updating a page ...

To update a page, you can use the following Javascript, EcomCart.getChanges, defined as follows in the EcomCart object:

    /**
     * get JSON data from server
     * @param String url: URL for getting data (ajax request)
     * @param Array params: parameters to add to ajax request
     * @param Object loadingElement: the element that is being clicked or should be shown as "loading"
     */
    getChanges: function(url, params, loadingElement) {

EcomCart.getChanges will automatically update the elements on your page as defined below. You can view a sample of the response here: /shoppingcart/ajaxtest/ (you need to be logged in as Admin).

The key variable in the JSON is the cart that is being returned. The templates used, and the IDs / Classes loaded into, are set in the yml configs. This is the default (KEY: name of AJAX variable (loaded into); VALUE: template used):

CartResponse:
  cart_responses_required:
    TinyCartClassName: CartTinyInner
    SmallCartID: CartShortInner
    SideBarCartID: Sidebar_Cart_Inner

Available variables for your templates

without context (can be used at root level in any template)
$AJAXDefinitions.SideBarCartID Side_Bar_Cart
The sidebar cart. See CartResponse.cart_responses_required to see if it is being used and what template is being used.
$AJAXDefinitions.SmallCartID small_cart_id
The small cart. See CartResponse.cart_responses_required to see if it is being used and what template is being used.
$AJAXDefinitions.TinyCartClassName tiny_cart_class
The tiny cart. See CartResponse.cart_responses_required to see if it is being used and what template is being used.
$AJAXDefinitions.TotalItemsClassName number_of_items
The total number of items in the order. Use in the following context: AjaxDefinitions.TotalItemsClassName
$AJAXDefinitions.TotalItemsTimesQuantityClassName number_of_items_times_quantity
The total number of items times their quantity in the order. Use in the following context: AjaxDefinitions.TotalItemsClassNameTimesQuantity
without context, ajaxified product list

The way this works is as follows:

        <div class="$AJAXDefinitions.ProductListItemClassName" id="$AJAXDefinitions.UniqueIdentifier">
            
      ... add to cart button goes here
      ... remove from cart butto goes here
      ... etc
</div>

When an item is added to cart, it will look at all the .productActions elements and add the in cart OR not in cart class. You can then hide / show the right buttons.

$AJAXDefinitions.HiddenPageTitleID HiddenPageTitle
The ID used to identify a (hidden) element that contains the title of the page. This can be used for ajax updates of the product list. It will be used to update the title of the page. For example, we can change the PageTitle to MyPage - sorted by Price.
$AJAXDefinitions.ProductListHolderID ProductGroup
The ID used to identify the product group list holder. This list can be replaced using ajax.
$AJAXDefinitions.ProductListAjaxifiedLinkClassName ajaxifyMyProductGroupLinks
The class name use for sections that contain links for showing alternative views of the product group list.
$AJAXDefinitions.UniqueIdentifier Product_DB_522_Button
Unique identifier for the buyable (product). Use in the following context: Buyable.AjaxDefinitions.UniqueIdentifier
$AJAXDefinitions.ProductListItemClassName productActions
The class used to identify each LI item in the list of product items on the product group page (or elsewhere).
without context, products in cart (or not in cart)
$AJAXDefinitions.ProductListItemInCartClassName inCart
The class used to identify the product actions of each LI list item of the list of products that is in the cart right now.
$AJAXDefinitions.ProductListItemNotInCartClassName notInCart
The class used to identify each LI item of the list of products that is NOT in the cart right now.
without context, country and region related
$AJAXDefinitions.ExpectedCountryClassName expected_country_selector
The class used to identify the product actions of each LI list item of the list of products that is in the cart right now.
$AJAXDefinitions.CountryFieldID Country
The class used to identify the product actions of each LI list item of the list of products that is in the cart right now.
$AJAXDefinitions.RegionFieldID Region
The field used for selecting the region. Use in the following context: AjaxDefinitions.RegionFieldID
within context of order, order item or order modifier
$AJAXDefinitions.TableID Page_DB_-1
The main definition on which a lot of others are based. Use in the following context: Order.AjaxDefinitions.TableID OR OrderModifier.AjaxDefinitions.TableID OR OrderItem.AjaxDefinitions.TableID
$AJAXDefinitions.TableTotalID Page_DB_-1_Total
The total cost. Use in the following context: Order.AjaxDefinitions.TableTotalID OR OrderModifier.AjaxDefinitions.TableTotalID OR OrderItem.AjaxDefinitions.TableTotalID
within context of order
$AJAXDefinitions.TableMessageID Page_DB_-1_Message
The cart message (e.g. product added). Use in the following context: Order.AjaxDefinitions.TableMessageID
$AJAXDefinitions.TableSubTotalID Page_DB_-1_SubTotal
The sub-total for the order. Use in the following context: Order.AjaxDefinitions.TableMessageID
within context of order item or order modifier
$AJAXDefinitions.TableTitleID Page_DB_-1_Title
The title for the item in the checkout page. Use in the following context: OrderItem.AjaxDefinitions.TableTitleID OR OrderModifier.AjaxDefinitions.TableTitleID
$AJAXDefinitions.CartTitleID Page_DB_-1_Title_Cart
The title for the item in the cart (not on the checkout page). Use in the following context: OrderItem.AjaxDefinitions.CartTitleID OR OrderModifier.AjaxDefinitions.CartTitleID
$AJAXDefinitions.TableSubTitleID Page_DB_-1_Sub_Title
The sub-title for the item in the checkout page. Use in the following context: OrderItem.AjaxDefinitions.TableSubTitleID OR OrderModifier.AjaxDefinitions.TableSubTitleID
$AJAXDefinitions.CartSubTitleID Page_DB_-1_Sub_Title_Cart
The sub-title for the item in the cart (not on the checkout page). Use in the following context: OrderItem.AjaxDefinitions.CartSubTitleID OR OrderModifier.AjaxDefinitions.CartSubTitleID
$AJAXDefinitions.QuantityFieldName Page_DB_-1_Quantity_SetQuantityLink
The quantity field for the order item. Use in the following context: OrderItem.AjaxDefinitions.QuantityFieldName

Ajax Shopping Cart

To add a cart anywhere, you can create a custom ajax request for shoppingcart/showcart/?ajax=1 ($shoppingcart/showcart/?ajax=1): shopping cart.

Product

The following product has been randomly selected product for this exercise: Product 176

You can reload this page to view another product.

Image Controllers

$Image.Linkimg_232_203_219.png /assets/randomimages/img_232_203_219.png
$BestAvailableImage.Linkimg_232_203_219.png /assets/randomimages/img_232_203_219.png
$DefaultImage.Linkimg_252_116_170.png /assets/randomimages/img_252_116_170.png
$DummyImage.Link /assets/
$DefaultImageLink.Link/assets/randomimages/img_252_116_170.png

Links

$AddVariationsLink/shop/browse-products/product-group-carrot/product-group-vanilla/product-group-coconut/product-coconut-434/selectvariation
$AddLink/shoppingcart/additem/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$IncrementLink/shoppingcart/additem/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$DecrementLink/shoppingcart/removeitem/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$RemoveLink/shoppingcart/removeitem/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$RemoveAllLink/shoppingcart/removeallitem/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$RemoveAllAndEditLink/shoppingcart/removeallitemandedit/90/Product/?SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$SetSpecificQuantityItemLink - adding eleven here/shoppingcart/setquantityitem/90/Product/?quantity=11&SecurityID=8e208846c38e0c0c2736efe3cde220302367b1e4
$EcomConfig.NotForSaleMessage

Not for sale, please contact us for more information.

Status and Price

$IsInCartNO
$Price267.65
$Price.Nice$267.65
$CalculatedPrice.Nice$267.65
$CalculatedPriceAsMoney.NiceDefaultFormat$267.65

Fields

The e-commerce quanity field provides the ability for the customer to change the quantity for a product in the cart (this is ajaxfied)

$EcomQuantityField

Only Available on Product Page (through controller so not visible here ...)

$AddProductForm
$PreviousProduct
$NextProduct