Speak to our experts today 0333 004 0333
Speak to one of our experts today
User Guides

EKM Tag: [ekm:sort_by]

This tag is used to output filtering controls for narrowing down a list of products. Product attributes are used to allow a customer to filter through all products on a category page.

Information Note

You will need to select attributes to be displayed on the sort_by from the “Edit Category” interface.

  • Tag Information
Basic Use
In it's basic use the tag will output any filterable options with the default HTML and CSS.

[ekm:sort_by][/ekm:sort_by]
								
Advanced Use
In it's advanced use you can specify your own surrounding HTML and CSS enabling you to fully customise how the sort_by tag looks.

[ekm:sort_by]
  target_tag_id='some-element-id';

   unsorted_text='Most popular';
   latest_in_text='What's new';
   price_ascending_text='Price low to high';
   price_descending_text='Price high to low';
   name_ascending_text='Name A to Z';
   name_descending_text='Name Z to A';

   include_list='latest-in, price-ascending, price-descending, name-ascending, name-descending';

  output_start='<div>';
  output_end='<button>Filter</button></div>';
[/ekm:sort_by]
								
Tag Attributes
Include Javascript
include_javascript='yes';

Allows you to prevent the ekm product sort javascript from being output when parsing the tag.

Without the javascript you will need to provided a button to allow users to submit the form.

Value
Description
yes
Recommended Default Javascript will be used.
no
Javascript is disabled and you will need to provide a button.
Target Tag ID
target_tag_id='cat_products';

Define the showdata tag ID that will be sorted. If the "include_javascript" attribute has a value of "no" then this attribute has no effect.

Value
Description
{user defined}
Define the ID of a showdata tag you wish to filter by.
Loading Image URL
loading_img_url='/ekmps/shops/username/resources/design/loading.gif';

The URL of the loading image that is displayed during sorting.

Value
Description
{user defined}
A path to an image.
auto
Outputs the default image.
Unsorted Text
unsorted_text='Most Popular';

Specify the text you wish to output for the default option.

Value
Description
{user defined}
Specify the text label you wish to output.
Latest In Text
latest_in_text='Latest In';

Specify the text you wish to output for the latest in option in the sort by.

Value
Description
{user defined}
Specify the text label you wish to output.
Price Ascending Text
price_ascending_text='Price: Low to High';

Specify the text you wish to output for the price low to high option in the sort by.

Value
Description
{user defined}
Specify the text label you wish to output.
Price Descending Text
price_descending_text='Price: High to Low';

Specify the text you wish to output for the price high to low option in the sort by.

Value
Description
{user defined}
Specify the text label you wish to output.
Name A-Z Text
name_ascending_text='Name: A-Z';

Specify the text you wish to output for the name a-z option in the sort by.

Value
Description
{user defined}
Specify the text label you wish to output.
Name Z-A Text
name_descending_text='Name: Z-A';

Specify the text you wish to output for the name z-a option in the sort by.

Value
Description
{user defined}
Specify the text label you wish to output.
Include List
include_list='latest-in, price-ascending';

Specify which options you would like to output in the sort by list.

Value
Description
latest-in
Outputs the 'Latest In' option in the list
price-ascending
Outputs the 'Price Ascending' option in the list
price-descending
Outputs the 'Price Descending' option in the list
name-ascending
Outputs the 'Name Ascending' option in the list
name-descending
Outputs the 'Name Descending' option in the list
Output Start
output_start='<div class="sort-by">';

Define any HTML you wish to be output before the sort by dropdown.

Value
Description
{user defined}
Define any opening HTML or Titles to go before the tag output.
Output End
output_end='</div>';

Define any HTML you wish to be output after the sort by dropdown.

Value
Description
{user defined}
Define any closing HTML to be displayed after the saving has output.
Change Callback
change_callback='doChange';

Define a javascript function in global scope to be called when the sort by has changed.

Value
Description
{user defined}
Define a javascript function at global scope.
Request Start Callback
requeststart_callback='beginRequest';

Define a javascript function in global scope to be called when the sort by has begun calling the reordered products.

Value
Description
{user defined}
Define a javascript function at global scope.
Request End Callback
requestend_callback='endRequest';

Define a javascript function in global scope to be called when the filter has finished calling the reordered products.

Value
Description
{user defined}
Define a javascript function at global scope.