EKM Tag: showdata

show='yes';

Sets whether the tag will be output. Set this to no and the tag will not output. Useful for turning off seasonal offers.

tag_hide_toggle='yes';

Sets whether the showdata tag can be turned on or off in the editor.

Specify an ID for the showdata tag which will be targeted by the filterby or sortby tags.

Allows you to specify the type of data you wish to output. This could be products, categories, special offers or related products.

Here you can specify which category or product you wish the data to be relative to. This is defined by either specifying a category or product ID (found in the address bar) or auto which will load data relative to the page you're viewing.

Example: If you were in the "Audio Systems" category with the id 21 and the location was set to auto then only products or subcategories would load in the showdata

Define the number of products or categories you wish to output per row in the showdata output.

Define the number of rows of products/categories you wish to display before pagination is shown. If pagination is set to auto.

Define the number of columns will be output before the [counter] tag is reset to 0. This is typically used to define the last column of a row to remove CSS margin and border. You will normally set this value to be the same as the cols attribute

Page Navigation or Pagination as it's often known, allows you to limit the number of products/categories that are displayed on a page but have extra pages to display any remaining products.

Example: If you had 100 products, your rows set to 10 and your columns set to 1 - You would see your first 10 products followed by page navigation links with pages 1 to 10.

You can choose the order of the information output in a showdata tag using this attribute. It will allow you to order by name, price, lastmodified, productweight, id or orderlocation

Note: Remember if you change this from auto you will be unable to use the 'Order' controls in the front end of EKM.

You are also able to change the direction of the order for this attribute by appending DESC or ASC to the end of each value.

Example: Order by price from lowest to highest orderby='price ASC'; or to order highest to lowest use orderby='price DESC';

You are also able to select two orderby values to use one as a callback.

Example: If you wanted to order from lowest to heighest in price, but have some products the same price, you may want to then order by ID. To do this you comma seperate values like orderby='price ASC, id DESC';

The skip record attribute is used in cases where you want the showdata to begin outputting data from a specific record number.

Example: For example you may wish to start outputting data after the 200th entry. So in the skip record attribute you would put 200 and the first 200 records would be skipped.

Here you can specify the IDs of products or categories you wish to exclude from the output. All records will then be output, apart from the IDs listed.

Here you can specify a list of items to ONLY be included in the showdata output.

During the output of products or categories you can decide whether or not you wish to output edit buttons for each of the items.

The EKM shop has a powerful image resizing feature that allows you to upload high resolution images and have the system resize them to a smaller size for displaying on your online shop.

The image_ratio attribute, when set to a specific value, will ensure that neither the width or height of the image exceeds the value you've set.

Example 1: You have a product image, like the one above, with a width of 150px and a height of 100px and your image_ratio attribute is set to 50px. Because the width is larger than the height the image scaling system will ensure that the width of this image will not exceed the value of image_ratio, in this case 50px.

Example 2: You have a product image, like the one above, however the height is 150px and the width of 100px and you have set the image_ratio attribute to 50px. Because the height is larger, this time, than the width the image scaling system will ensure that the height of this image will not exceed the value of image_ratio, in this case 50px.

NOTE: The image scaling system will never make an image bigger. So if you have an image smaller than your image_ratio the image will remain unchanged at it's original size.

This works in the same way as image ratio however there is one key difference, instead of limiting both height and width by the same value, you can specify to only limit the width. This means your images can exceed whatever height you like, but will never exceed the defined width.

Example 1: You have a portrait image of your product. The image is 300 high and 150 wide. You set your image_width to 100 because you want the width to never be more than 100 pixels width. When the image system does this the height will remain unrestrained and only the width will be reduced.

Example 2: You have a landscape image of a product. The image is 150px wide with 100px high. You set your image_width to 100. The image system will now resize this image so the width is no wider than 100px but disregards the height as this can be anything.

NOTE: The image scaling system will never make an image bigger. So if you have an image width smaller than your image_width the image will remain unchanged at it's original size.

This works exactly like the image_width attribute however instead of reducing the width to the specified value it will reduce only the height leaving the width to be anything regardless of whether it is greater or less than the value you set.

Example 1: You have a portrait image of one of your products, you want the height to never exceed 250 pixels, so you set the image_height to 250. Now when your image is resized the width will be ignored but the height will be forced down to 250 pixels.

NOTE: The image scaling system will never make an image bigger. So if you have an image height smaller than your image_height the image will remain unchanged at it's original size.

This attribute allows you to specify whether you want EKM to specify font sizes, font names and font colours for your text or whether you would like to define them yourself using CSS. If set to no the system will not output <font> tags within its output.

add_to_cart_text='Add To Cart';

Set the text for the [add_to_cart_link] attribute tag.

header_title_text='Products';

Set the text to be output for the [header_title_text] attribute tag.

filter_results_always_output='yes';

When set to yes the output_start and output_end will always be output even if no products are returned. Useful if your output start or output end contain filter controls.

output_no_items='No Items To Output';

Output a message or block of HTML to be displayed when the showdata returns no products. This is useful for search results or showing a message when a product filter is too specific.

Here you can specify what will be output at the start of the ekm:showdata. Typically you would start to output some HTML and a title for the data to be output.

Example: You would open a containing div at this point inside followed by a h1 tag for the title "Products".

Here you can specify any code that will be output at the beginning of each new row. Typically you would open a container for each row at this point.

Here you can specify the code you want to be output at the start of each column. This is typically used when using a table layout which is not recommended.

When an entry is output from the showdata it is contained within this attribute. Here you can choose what information will be output and in what order.

Within [ekm:tags] you would need to open and close them in the same way you would open and close HTML tags. However with attribute tags, like the ones below, they are self closing and work alone without any need to close them.

Here you need to begin closing your HTML tags that were opened within the output_column_start attribute.

Here you will begin closing any HTML tags that were opened within the output_row_start attribute.

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

output_no_filter_items='';

Define any HTML or text to be output when a filter selection yields no results. Useful if the customer has selected a price range that no products fall within.

This is typically only used for table layouts. This attribute allows you to output content for any remaining column gaps in a row.

Example: If you have 31 products. Your cols attribute is set to 3. This would output 10 rows of 3 products and one row of 1 product. In a table layout however you'd still need to insert the 2 remaining blank table cells to complete a valid table. Using this attribute you can insert blank table cells to correctly finish the table.

active_item_output='active';

Define any HTML or text to be output in place of the [active_item] attribute in output_item.

active_when_child_is_active='yes';

Sets whether or not an item should be treated as active when a child is active. For example when viewing a product page the category that product is in will be set as active.

pagination='[previous][pagenumbers][next]';
										

Allows you to specify the pagination layout.

pagination_pagenumber='[link]';
										

Allows you to specify the HTML for previous page button.

pagination_next='[link]';
										

Allows you to specify the HTML for each next page button.

pagination_seperator='';
										

Allows you to specify what goes between each page button.

pagination_ellipsis='...';
										

Allows you to specify the ellipsis trial that appear between page numbers.

pagination_limit='5';
										

Set the maximum number of page number links that can be output.

pagination_ellipsis_trail='2';
										

Set the number of page number links to be output before ellipsis is shown.

pagination_current_page=' class="current-page" ';
										

Set any HTML attributes to be output on the current page link.

pagination_other_page=' class="page" ';
										

Set any HTML attributes to be output on tall other page links.

load_more_button='on';
										

Set whether the load more button should be used instead of pagination.

load_more_button_endless='yes';
										

Set whether or not the next page of items should automatically load when you reach the bottom of the list. This functionality is disabled on mobile devices.

load_more_title_text='Load More';
										

Set the text to be output on the button.

load_more_class=' .ui-load-more-button ';
										

Set any additional classes to be added to the load more button.

load_more_code='<button [class] [attributes]>[title]</button>';
										

Set any the HTML markup to be used for the load more button.

show_hover_thumbnail='yes';
										

Set whether another product image should be shown when hover over a product in a list.

hover_thumbnail_imagenumber='2';
										

Set the number of the image to be shown. Can range from 2-5. Setting 2 would show the product's first additional image.

hover_thumbnail_fade='yes';
										

Set whether the thumbnail should fade as it changes.

max_image_width='';
										

Allows you to specify the maximum width of the image. If a image is used which is larger than this amount it will be resized to fit.

max_image_height='';
										

Allows you to specify the maximum height of the image. If a image is used which is larger than this amount it will be resized to fit.

category_title_font='';
										

Allows you to specify a font to use for category names.

category_title_size='';
										

Used to specify the font size used when displaying a Category's name.

category_title_style='';
										

Used to specify the font style used when displaying a Category's name.

category_description_font='';
										

Used to specify the font used when displaying a Category's description.

category_description_size='';
										

Used to specify the font size used when displaying a Category's description.

category_description_style='';
										

Used to specify the font style used when displaying a Category's description.

product_title_font='';
										

Used to specify the font used when displaying a Product's name.

product_title_size='';
										

Used to specify the font size used when displaying a Product's Name.

product_title_style='';
										

Used to specify the font style used when displaying a Product's Name.

product_description_font='';
										

Used to specify the font used when displaying a Product's description.

product_description_size='';
										

Used to specify the font size used when displaying a Product's description.

product_description_style='';
										

Used to specify the font style used when displaying a Product's description.

related_output='';
										

Specify whether multiple related products can be added to the basket from the product page.

element_replace='';
										

If any item in the output_item parameter doesnt exist or is empty replace it with this element. So for example if you had the code...

[name] - [description]

And description was empty and your element_replace was set to 'nothing here' you would get the following...

Apple iPod - nothing here

The main use for this tag is when you're using a table layout and instead of an empty cell you could set the element_replace to so you would still maintain a grid style layout.

formatdate='';
										

Allows you to specify how your [lastmodified] will be formated.

Example: Would output 13 - 03 - 1989

formatdate='[day_of_month] - [month] - [year]';