EKM Tag Documentation - ekm:minicart

This tag is used to output a brief summary of the users shopping cart within your template. The minicart typically outputs the total and number of items within the users cart but sometimes outputs an item breakdown.

Tag Information
Nesting This Tag

Basic Use - Style 1

This tag, when placed in basic form, outputs the minicart as STYLE1 by default. This shows you all total information, product breakdown, product prices and product qty.


[ekm:minicart]style='STYLE1';[/ekm:minicart]

This outputs the following.

Item

Qty

Price

Intempo IDS01 Unplugged iPod Dock in Black

£39.95

Intempo Inconcert iPod Dock in Black

£75.95

Intempo Insession iPod Dock in Black

£59.95

Panasonic SCPM38DB Micro system - with iPod Dock &

£149.95

Sub Total:	£325.80
Delivery:	£0.00
Tax:	£57.02
Total:	£382.82

Basic Use - Style 2

When set to output STYLE 2 the minicart will display a breakdown of products and product qty and a sub-total of the cart's content.


[ekm:minicart]style='STYLE2';[/ekm:minicart]

This outputs the following.

1 x

Intempo IDS01 Unplugged iPod Dock in Black

1 x

Intempo Inconcert iPod Dock in Black

1 x

Intempo Insession iPod Dock in Black

1 x

Panasonic SCPM38DB Micro system - with iPod Dock &

Sub Total:

£325.80

Basic Use - Style 3

When using STYLE3 the minicart will output a total cart value and a link to the 'Shopping Cart' page.


[ekm:minicart]style='STYLE3';[/ekm:minicart]

This outputs the following.

View Cart

4 Item(s) in Cart

Advanced Use

You can specify your own minicart layout using the tags attributes and your own HTML/CSS.


<style type="text/css">
	#mini-cart .element-header {background: #adadad; color: #fff; padding: 7px; border-radius: 4px 4px 0 0; font-size: 13px;}
	#mini-cart .element-cont {background: #efefef; border: solid 1px #adadad; border-radius: 0 0 4px 4px; padding: 3px; font-size: 11px; color: #404040;}
	#mini-cart .cart-item-total {text-align: right; font-size: 12px; margin: 5px 4px;}
</style>

[ekm:minicart]
	style='custom';
	nocartmessage=' ';
	maxcharacters='15';
	imagewidth='50';
	imageheight='50';
	output_start='
	<div class="element" id="mini-cart">
		<div class="element-header">Shopping Cart - ([ekm:currency_symbol][/ekm:currency_symbol])</div>
		<div class="element-cont cf">
	';
	output_end='
		</div>
	</div><!-- #mini-cart -->
	';
	output_contents_start='';
	output_contents_end='';
	output_cart_contents='<div>[product_image] [product_name_link] - <strong>[product_price]</strong></div>';
	output_totals='<div class="cart-item-total">[total]</div>';
[/ekm:minicart]

This outputs the following.

Shopping Cart - (£)

Intempo IDS01 U - £39.95

Intempo Inconce - £75.95

Intempo Insessi - £59.95

Panasonic SCPM3 - £149.95

£382.82

Tag Attributes

Style

style='custom';

This attribute allows you to choose one of 3 predefined minicart styles, or define your own.

Value

Description

STYLE1

Displays the cart as shown in example 1 above.

STYLE2

Displays the cart as shown in example 2 above.

STYLE3

Displays the cart as shown in example 3 above.

custom

Turns off any predefined formatting and allows you to customise the minicart yourself.

No Cart Message

nocartmessage='Updating Cart...';

Set a message to be output instead of the minicart on the full cart page.

Value

Description

neverhide

Tells the minicart to stay visible throughout the checkout process and on the shopping cart page.

Note: On the final step of the checkout process, order confirmation, the user will still see a full cart as it has not yet been emptied at this stage. Going back to the main site will clear the cart.

{user defined}

Specify your own message to be displayed when the minicart is hidden throughout your checkout process and shopping cart page.

Cart Message: Empty Cart

cart_totals_message_empty='Your Cart Is Empty';

Define your own message to be output in place of the [total_message] attribute tag when there are zero items in the cart.

Value

Description

{user defined}

Define your own Text or HTML.

Cart Message: Single Item

cart_totals_message_single_item='Your Cart Contains [item_count] Item';

Define your own message to be output in place of the [total_message] attribute tag when there is a single item in the cart.

Value

Description

{user defined}

Define your own Text or HTML.

Within this attribute there are a number of attribute tags you can use to output various types of cart information.

Value

Description

[item_count]

Outputs the total number of products taking into account the quanitity.

[product_count]

Outputs the total number of unique products ignoring quanitity.

[total_discount]

Outputs the total discount value for this cart.

[total_sub]

Outputs the sub-total. This is the value before delivery and tax are added.

[total_delivery]

Outputs the total delivery charge for this cart.

[total_tax]

Outputs the total tax amount of this cart.

[total]

Outputs the grand total of this cart.

[total_weight]

Outputs the total weight of all products within the cart.

Cart Message: Multiple Item

cart_totals_message_multiple_items='Your Cart Contains [item_count] Items';

Define your own message to be output in place of the [total_message] attribute tag when there are multiple items in the cart.

Value

Description

{user defined}

Define your own Text or HTML.

Within this attribute there are a number of attribute tags you can use to output various types of cart information.

Value

Description

[item_count]

Outputs the total number of products taking into account the quanitity.

[product_count]

Outputs the total number of unique products ignoring quanitity.

[total_discount]

Outputs the total discount value for this cart.

[total_sub]

Outputs the sub-total. This is the value before delivery and tax are added.

[total_delivery]

Outputs the total delivery charge for this cart.

[total_tax]

Outputs the total tax amount of this cart.

[total]

Outputs the grand total of this cart.

[total_weight]

Outputs the total weight of all products within the cart.

Cart Message: Item Count Type

item_count_type='item';

Specify how items are counted when cart_totals_message_empty, cart_totals_message_single_item and cart_totals_message_multiple_items are displayed.

Value

Description

item

Counts the number of individual items in the cart. The quantity of items are counted in the total used to display the message.

product

Counts the number of unique products in the cart. The quantity of the product is not counted to display the message.

Maximum Product Name Characters

maxcharacters='20';

In some cases you may want to reduce the length of the product title to a specific value. This could be to prevent space issues or just to ensure titles look a consistent length. By entering a value in this attribute the system will only output this amount of characters.

Value

Description

{user defined}

Define an integer value and which truncating will begin.

Image Width

imagewidth='150';

Specify the size of the product image to be output in the minicart. The image will never exceed this size.

Value

Description

{user defined}

Define an integer value for the image width.

Image Height

imageheight='150';

Specify the size of the product image to be output in the minicart. The image will never exceed this size.

Value

Description

{user defined}

Define an integer value for the image height.

Output Start

output_start='';

Insert any code or text you would like to be inserted when the minicart is displayed. Typically here you would open your minicart HTML conatiners (div) and insert the title of the minicart.

Value

Description

auto

By default auto will output the following code.

<table border="0" cellspacing="5" width="100%">

{user defined}

Define your own opening HTML code to be output when the minicart first loads.

Output Contents Start

output_contents_start='';

Here you insert any code you would like to display before the cart's content is output. Again this can be used to output any opening HTML tags which are to surround the cart's content.

The cart's content is the section where a product breakdown will be output if you choose to design your cart like this. Here people typically insert table heading cells.

Value

Description

auto

By default the minicart will output a table layout with the following code

<tr><td><font face="verdana" size="1"><b>Item</b></font></td><td><font face="verdana" size="1"><b>Qty</b></font></td><td><font face="verdana" size="1"><b>Price</b></font></td></tr><tr>

{user defined}

Define your own opening HTML code to be output when the minicart begins outputting products.

Output Cart Contents

output_cart_contents='';

Here is what will be output each time a new product is output within the minicart. There are a number of attribute tags you can insert into this section to output different product information.

Value

Description

auto

By default the system will output the following code and attribute tags.

<font face="verdana" size="1">[product_name_link]
		</font></td><td><font face="verdana" size="1">
		[product_qty]</font></td><td>
		<font face="verdana" size="1">[product_price]</font>
		</td></tr>

{user defined}

Define any HTML you would like to be output with each product in the minicart.

Within this attribute there are a number of attribute tags you can include to output various types of product information within the minicart.

Value

Description

[product_name]

Outputs the product name in plain text. This will also be truncated by the maxcharacters attribute.

[product_name_link]

Outputs the products name in plain text with a link to the product page. This will also be truncated by the maxcharacters attribute.

[product_qty]

Outputs the number of these products currently added to the cart.

[product_price]

Outputs the price of the product.

[product_image]

Outputs the image of the product.

Output Contents End

output_contents_end='';

Here you should define any closing HTML tags that were opened in the output_contents_start attribute.

Value

Description

auto

The default output for this attribute when set to auto is

</tr><tr><td colspan="3"><hr size="1" width="100%">
		</td></tr>

{user defined}

Define your own code to close any opened HTML tags or output a message following your list of products.

Output Totals

output_totals='';

Here you can output any total information about your visitors shopping cart. Typically you would use this section to output a subtotal or grand total for your shopping cart.

Value

Description

auto

The default output for this attribute, when set to auto, is the following code

<tr><td align="right" colspan="3"><table border="0">
		<tr><td align="right">
		<font face="verdana" size="1">SubTotal:
		</font></td><td>
		<font face="verdana" size="1">
		[total_sub]</font></td></tr><tr>
		<td align="right">
		<font face="verdana" size="1">Delivery: </font>
		</td><td><font face="verdana" size="1">
		[total_delivery]</font></td></tr>
		<tr><td align="right">
		<font face="verdana" size="1">Tax:
		</font></td><td>
		<font face="verdana" size="1">
		[total_tax]</font></td></tr><tr>
		<td align="right">
		<font face="verdana" size="1">Total:
		</font></td><td><font face="verdana" size="1">
		[total]</font></td></tr></table></td></tr>

{user defined}

Define your own HTML for the totals section, you can output information using any of the attribute tags below.

Within this attribute there are a number of attribute tags you can use to output various types of cart information.

Value

Description

[item_count]

Outputs the total number of products taking into account the quanitity.

[product_count]

Outputs the total number of unique products ignoring quanitity.

[total_discount]

Outputs the total discount value for this cart.

[total_sub]

Outputs the sub-total. This is the value before delivery and tax are added.

[total_delivery]

Outputs the total delivery charge for this cart.

[total_tax]

Outputs the total tax amount of this cart.

[total]

Outputs the grand total of this cart.

[total_weight]

Outputs the total weight of all products within the cart.

[total_message]

Outputs the message defined in cart_totals_message_empty, cart_totals_message_single_item or cart_totals_message_multiple_items depending on the number of items in the cart.

[ekm:custom_tax]

In some cases you may wish to show tax within your minicart, but in some cases tax may not be applicable to some items. In this case you would want to hide the tax tag and this can be done by surrounding the [total_tax] tag and any HTML with the [ekm:custom_tax] tag.

This can be done like this [ekm:custom_tax][total_tax][/ekm:custom_tax]

Output End

output_end='';

Here you will close any HTML tags that were opened within the output_start attribute.

Value

Description

auto

When set to auto the tag will output the following default code </table>

{user defined}

Define your own closing HTML tags.

On Update Callback

on_update_callback='cartUpdateFunction';

Specify a globally scoped Javascript function to be called whenever the cart is updated. This function is passed an object as the first parameter which contains information about the updated cart.

Value

Description

{user defined}

Define your own globally scoped function.

On Add To Cart Callback

onaddtocartcallback='cartAddedFunction';

Specify a globally scoped Javascript function to be called whenever something is added to the cart. This function is passed an object as the first parameter which contains information about the updated cart.

Value

Description

{user defined}

Define your own globally scoped function.

On Add To Cart Error Callback

onaddtocarterrorcallback='cartAddedFunction';

Specify a globally scoped Javascript function to be called whenever an attempt to add something to the cart fails.

Value

Description

{user defined}

Define your own globally scoped function.

The EKM system allows for some tags to be nested within other tags.

This tag cannot be nested within other tags

EKM Tag: [ekm:minicart]