> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Functions

> Reference for global WEBSALE template functions used to format strings, round numbers, merge lists or compare dates inside any template.

Global template functions are available in all templates. They are used to process, format, or check values (e.g., adjusting strings, rounding numbers, merging lists, or comparing date values).

This page describes only global functions. Functions that are bound to a module (e.g., methods of `$wsAccount` or `$wsExternalData`) are documented in the respective [module reference](../referenz/module.mdx).

Many functions can alternatively also be used as [modifiers](../referenz/modifiers.mdx) (filters).

***

## Basics

Functions are called with parentheses. Values passed to a function (so-called parameters) are separated by commas. Function names are case-sensitive (capitalization must be observed exactly).

### Notation

To output the result of a function in the template, the output notation is used:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= <functionName>(...) }}
```

The result of the function does not necessarily have to be output in the template immediately; it can also be stored in a separate variable for later reuse.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myVariable = <functionName>(...) }}
```

### Parameter passing and order

By default, parameters are passed positionally (in the order of the signature).

If the order of the parameters is to be changed, named parameters must be used (name per signature + `=`). The parameter names are then decisive, not the position.

**Example**

A voucher is to be renamed via the `replace` function. `GUTSCHEIN_buy10` should become `GUTSCHEIN_sale10`.

The signature is: `replace(content, search, replace)`. With positional passing, the order is therefore:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= replace("GUTSCHEIN_buy10", buy", "sale") }}
```

As soon as parameters are passed by name (`name="..."`), the order is free:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= replace(search="buy", replace="sale", content="GUTSCHEIN_buy10") }}
```

\= In both cases, the result is

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
GUTSCHEIN_sale10
```

### Combining functions (chained processing)

Multiple functions can also be applied in sequence by using the first function as the argument of the second function.

**Example**

The shipping cost ID "versand\_kostenfrei" should be renamed in a more readable way to "VERSAND KOSTENFREI" and the writing changed to uppercase.

The functions `upper` and `replace` are used:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= upper(replace("versand_kostenfrei", "_", " ")) }}
```

\=

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
VERSAND KOSTENFREI
```

### Joining text and lists

With the `+` operator, two texts (strings) can be directly joined into a new string. For lists, `+` can be used as an alternative to `merge()` to combine two listings.

Only values of the same type can be joined with `+`. Numbers or other types must first be converted to text using the `str()` function.

**Examples**\
Compose article number from prefix and ID:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $prefix = "ART-" }}
{{ var $productId = "10452" }}
{{ var $articleNumber = $prefix + $productId }}
{{= $articleNumber }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
ART-10452
```

Embed order quantity in a note text — numbers must be converted to text with `str()` before being joined with a string.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $quantity = $wsCart.info.itemCount }}
{{ var $message = "Number of items in the basket: " + str($quantity) }}
{{= $message }}
```

***

## List of functions

### abs

The `abs` function returns the absolute value of a number — i.e., the value without a sign. A negative number is thereby made positive; a positive number remains unchanged.

**Usage example**\
Useful, for example, to always display discount amounts or price differences in the shop as a positive number — regardless of whether the value has a minus sign in the data.

**Signature**\
`abs(value)`

**Parameters**

* `value` - The number whose absolute value is to be determined.

**Usable as modifier**\
yes

**Example with a negative value**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= abs(-7.5) }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
 7.5
```

**Example with a positive value**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= abs(3) }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
3
```

**Example - always display price difference as positive**\
The current price of a product is stored in the `price` field (here: `79.95`), the original price in the `setOrgPrice` field (here: `99.95`). The difference between the two can turn out negative depending on the calculation direction. With `abs`, it is ensured that the displayed amount is always positive.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProduct = $wsProducts.load("100-12345") }}
<p>You save: {{= currency(abs($myProduct.price - $myProduct.setOrgPrice)) }} €</p>
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
You save: 20.00 €
```

***

### ceil

The `ceil` function always rounds a number up to the next whole number — no matter how small the decimal portion is. So `ceil(1.1)` results in `2`, just like `ceil(1.9)`.

**Usage example**\
Helpful when values in the shop should always be rounded up "in favor of" a whole unit — e.g., quantities, packaging units, or calculated amounts.

**Signature**\
`ceil(value)`

**Parameters**

* `value` – The number to be rounded up.

**Usable as modifier:**\
yes

**Example with a decimal number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= ceil(1.3) }}
```

**Output** (rounded up to the next whole number)

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2.000000
```

**Example with a whole number (integer)**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= ceil(2) }}
```

**Output** (whole number remains unchanged)

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2.000000
```

<Info>
  To adjust the display of decimal places, use `ceil(2) | preparedFormat("name")`
</Info>

\
**Example - round up the calculated product weight**\
The shipping weight of a product (in this case 2.3 kg) is rounded up to full kilograms.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProductWeight = $myProduct.custom.weight }}
<p>Shipping weight: {{= ceil($myProductWeight) | preparedFormat("amount") }} kg</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Shipping weight: 3 kg
```

**Counterpart**\
[floor](#floor)

***

### currency

The `currency` function formats a numeric value as a price according to the [shop currency settings](/en/konfiguration/finance-wahrungen-steuern). This includes in particular:

* Decimal separator (e.g., `,` instead of `.`)
* Number of decimal places (e.g., 2 in many currencies)
* Commercial rounding to the configured number of decimal places

The function does not calculate prices (e.g., taxes, discounts, or shipping costs) but only formats the passed value for output.

**Usage example**\
Suitable for outputting amounts such as unit prices, discounts, subtotals, and totals.

**Signature**\
`currency(price)`

**Parameters**

* `price` - The number to be formatted as a price.

**Usable as modifier**\
yes

**Example with decimal places**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= currency(3.1475) }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
3.15€
```

**Example with integer**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= currency(12) }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
12.00€
```

<Info>
  If a numeric value should be output in a specific format independently of the currency (e.g., with a different number of decimal places), [preparedFormat()](#preparedformat) is the appropriate function.
</Info>

**Example - output product price formatted**\
The price of a product is stored as a decimal number (here: `89.95`). With `currency`, it is formatted according to the shop settings.

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
89.95€
```

***

### dateFmt

The `dateFmt` function brings a date or point in time into a desired display format. The input value must be in ISO 8601 format (e.g., `2018-03-11T11:20:11.000Z`) — this format is used automatically by most systems.

**Usage example**\
With this, e.g., order dates, delivery dates, or campaign periods can be displayed readably in the shop (e.g., as "11.03.2018" or "11:20:11").

**Signature**\
`dateFmt(isoDate, fmt[, tz])`

**Parameters**

* `isoDate` – Date/time in ISO 8601 format (e.g., `2018-03-11T11:20:11.000Z`)
* `fmt` – Format specification that determines what the output should look like
  * The most important placeholders at a glance
    * `%d` = day (01–31)
    * `%m` = month (01–12)
    * `%Y` = year (4-digit)
    * `%H` = hour (00–23)
    * `%M` = minute (00–59)
    * `%S` = second (00–60)
  * You can use this to simply "assemble" the following formats, e.g.:
    * `"%d.%m.%Y"` → `11.03.2018`
    * `"%H:%M:%S"` → `11:20:11`
  * `tz` (optional) – Time zone in which the time should be output (e.g., "`Europe/Berlin`"). Without this specification, the time zone configured in the shop is used (configuration [general.general](https://dokumentation.websale.de/en/konfiguration/general-allgemeine-shopeinstellungen#general-general-allgemeine-basiseinstellungen), also available via [\$wsSubshop.timeZone](/en/frontend/referenz/module/wssubshop#wssubshop-timezone)). Valid values are the names from the IANA time zone database, [a readable overview can be found here](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).

**Usable as modifier**\
yes

**Example for outputting the order date from the "order time"**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= dateFmt("2018-03-11T11:20:11.000Z", "%d.%m.%Y") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
11.03.2018
```

**Example for outputting the time from the "order time"**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= dateFmt("2018-03-11T11:20:11.000Z", "%H:%M:%OS") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
11:20:11
```

**Example with time zone output**\
The same UTC timestamp is output in the `Europe/Berlin` time zone. In March, Central European Time (UTC+1) applies there, so the time is one hour later than the UTC input.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= dateFmt("2018-03-11T11:20:11.000Z", "%H:%M", "Europe/Berlin") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
12:20
```

**Example - output the current year**\
In combination with [\$wsSubshop.currentTime](/en/frontend/referenz/module/wssubshop) (current timestamp in ISO 8601 format), you can, for example, output the current year.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= $wsSubshop.currentTime | dateFmt("%Y") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2026
```

**Example - output order date and time formatted**\
The order date in this example is stored in the following format — `2024-06-15T14:32:05.000Z`. With `dateFmt`, it is converted into a readable date and a separate time for an order confirmation.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{var $myOrder = $wsOrderHistory.load($wsViews.current.params.orderHistorySelect)}
<p>Ordered on: {{= dateFmt($myOrder.general.dateTime, "%d.%m.%Y") }}</p>
<p>Time: {{= dateFmt($myOrder.general.dateTime, "%H:%M") }}</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Ordered on: 15.06.2024
Time: 14:32
```

***

### dateGreaterThan

The `dateGreaterThan` function compares two date values (as strings) with each other and returns `true` if the first date is after the second date.

**Usage example**\
With this, the template can, for example, check whether a delivery date is in the future or whether a period has already been exceeded.

**Signature**\
`dateGreaterThan(firstDate, secondDate)`

**Parameters:**

* `firstDate` – First date (value to be checked)
* `secondDate` – Second date (comparison value)

**Usable as modifier**\
yes

**Example of a date comparison**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= dateGreaterThan("2019-03-11T11:20:11.000Z", "2017-07-11T11:20:11.000Z") }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
true
```

**Example - check whether an order was placed after a certain cut-off date**\
With `dateGreaterThan`, you can check whether the order is after a fixed cut-off date — e.g., to consider only orders from 01.01.2025 onwards for a returns campaign.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myOrder = $wsOrderHistory.load("12345") }}
{{ var $cutoffDate = "2025-01-01T00:00:00.000Z" }}
{{ if (dateGreaterThan($myOrder.general.dateTime, $cutoffDate)) }}
  <p>This order qualifies for the returns campaign.</p>
{{ /if }}
```

**Output if the order date is after 01.01.2025**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
This order qualifies for the returns campaign.
```

**Counterpart**\
[dateLessThan](#datelessthan)

***

### dateLessThan

The `dateLessThan` function compares two date values (as strings) with each other and returns `true` if the first date is **before** the second date.

**Usage example**\
With this, the template can, for example, check deadlines or periods — e.g., whether a date has already been exceeded or whether an event is still ahead.

**Signature**\
`dateLessThan(firstDate, secondDate)`

**Parameters**

* `firstDate` – First date (value to be checked)
* `secondDate` – Second date (comparison value)

**Usable as modifier**\
yes

**Example of a date comparison**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= dateLessThan("2020-03-11T11:20:11.000Z", "2021-07-11T11:20:11.000Z") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
true
```

**Example - display notice if an order was placed before a cut-off date**\
With `dateLessThan`, you can check whether the order is before a fixed cut-off date — e.g., to point out that the return period has already expired.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myOrder = $wsOrderHistory.load("12345") }}
{{ var $deadlineEnd = "2025-01-01T00:00:00.000Z" }}
{{ if (dateLessThan($myOrder.general.dateTime, $deadlineEnd)) }}
  <p>The return period for this order has expired.</p>
{{ /if }}
```

**Output if the order date is before 01.01.2025**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
The return period for this order has expired.
```

**Counterpart**\
[dateGreaterThan](#dategreaterthan)

***

### decode

The `decode` function converts an encoded string back into its original plain text. Supported formats are `base64` and `hex`. If the passed value is not a valid encoded string in the specified format, the function returns `null`.

**Usage example**\
Useful, for example, to decode externally encoded product data, voucher codes, or configuration values before further processing in the template.

**Signature**\
`decode(content, format)`

**Parameters**

* `content` - The encoded string to be decoded.
* `format` - The encoding format to be used during decoding. Valid values: `"base64"`, `"hex"`.

**Usable as modifier**\
yes

**Example - decoding a Base64 string**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= decode("d2Vic2FsZQ==", "base64") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
websale
```

**Example - decoding a hex string**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= decode("776562 73616c65", "hex") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
websale
```

**Example - incorrect input**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= decode("not-a-valid-base64-value!!!", "base64") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
null
```

**Counterpart**\
[encode](#encode)

***

### distinct

The `distinct` function removes duplicate entries from a listing and returns a new listing in which each value appears only once. For listings of data objects (maps), a key can optionally be specified by which the comparison is made. The specification of the key is only considered at the top level of a map.

**Usage example**\
Useful, for example, to remove duplicates from a list of product categories, variant attributes, or filter values before displaying them in the template.

**Signature**\
`distinct(list[, key]`

**Parameters**

* `list` - The listing from which duplicates are to be removed.
* `key (optional)` - Key of a data object used for the comparison.

**Usable as modifier**\
yes

**Example - removing duplicate size specifications from a variant list**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $sizes = ["S", "M", "L", "M", "XL", "S"] }}
{{= distinct($sizes) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
["S", "M", "L", "XL"]
```

***

### encode

The `encode` function encodes a string into a specified format. Supported formats are `base64` and `hex`. The return value is always of type String.

**Usage example**\
Useful, for example, to safely encode voucher codes, product identifiers, or other values for passing to external services or in URLs.

**Signature**\
`encode(content, format)`

**Parameters**

* `content` - The string to be encoded.
* `format` - The target format of the encoding. Valid values: `"base64"`, `"hex"`.

**Usable as modifier**\
yes

**Example - encoding as Base64**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= encode("websale", "base64") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
d2Vic2FsZQ==
```

**Example - encoding as hex**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= encode("websale", "hex") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
776562 73616c65
```

**Counterpart**\
[decode](#decode)

***

### floor

The `floor` function always rounds a number down to the next whole number — no matter how large the decimal portion is. So `floor(4.9)` results in `4`, just like `floor(4.1)`.

**Usage example**\
Helpful when values in the shop should generally be rounded down — e.g., for calculated quantities or intermediate results that may only be processed further as a whole number.

**Signature**\
`floor(value)`

**Parameters**

* `value` – Numeric value to be rounded down.

**Usable as modifier**\
yes

**Example with a decimal number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= floor(4.9) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
4.000000
```

**Example with a whole number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= floor(2) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2.000000
```

<Info>
  To adjust the display of decimal places, use `floor(4.9) | preparedFormat("name")`
</Info>

**Example - round down the calculated product weight**\
The shipping weight of a product (in this case 2.7 kg) is rounded down to full kilograms.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProductWeight = $myProduct.custom.weight }}
<p>Minimum weight: {{= floor($myProductWeight) | preparedFormat("amount") }} kg</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Minimum weight: 2 kg
```

**Counterpart**\
[ceil](#ceil)

***

### ifnull

The `ifnull` function checks whether a value is present or not (`null` means: "no value present"). If the value is `null`, a replacement value is output instead. If a value is present, it is used itself.

**Usage example**\
Suitable, for example, for fallback logic in the shop — e.g., to display a replacement image if no product image is present, or to replace missing product data with default values.

**Signature**\
`ifnull(object, value)`

**Parameters**

* `object` - The value to be checked.
* `value` - The alternative value that is output when `object` has the value `null`.

**Usable as modifier**\
yes

**Example with a** `null` **value**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= ifnull(Null, "sale") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
sale
```

**Example with an existing value**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= ifnull("web", "sale") }}
```

**Output** (the string `"web"` is not `null`, so it is output itself).

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
web
```

**Example with product image fallback**\
The variable `$myProduct` stores all information and data about a product. If no product image is found (`$myProduct.custom.image.normal` is `null`), then the replacement image `noImageNormal.png` is displayed.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProduct = $wsView.info.product }}
<img src="{{= ifnull($myProduct.custom.image.normal, static("images/noImageNormal.png")) }}">
```

***

### int

The `int` function converts a value into a whole number (integer). This is especially necessary when a numeric value is present as text (e.g., `"10"`) and is to be processed further as a true number — e.g., for calculations or comparisons. If the conversion is not possible (e.g., for a word), `null` is returned. Decimal numbers are truncated to the whole number before the decimal point (not rounded).

**Usage example**\
Useful, for example, to convert quantity specifications or article IDs that are present as text (e.g., "1043") into a number before further processing.

**Signature**\
`int(value)`

**Parameters**

* `value` - The value to be converted into an integer.

**Usable as modifier**\
yes

**Example with a string containing a number**

The text "10" is converted into the number 10. With the output, the text was converted into a number with which it is now possible to calculate.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= int("10") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
10
```

**Example with a non-convertible value**

A word (in this case "websale") cannot be converted into a number — the output is `null`.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= int("websale") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
null
```

**Example with a decimal number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= int(10.789) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
10
```

***

### isoToUnix

The `isoToUnix` function converts a timestamp in ISO 8601 format into Unix time, i.e., the number of seconds since 1 January 1970 (UTC).\
\
**Usage example**\
Useful, for example, to bring timestamps into a uniform numeric format for calculations, comparisons, or handover to external services.\
\
**Signature**\
`isoToUnix(isoDate)`

**Parameters**

* `isoDate` - Timestamp in ISO 8601 format (e.g., 2018-03-11T11:20:11.000Z)

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= isoToUnix("2018-03-11T11:20:11.000Z") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
1520767211
```

**Counterpart**\
[unixToIso](https://dokumentation.websale.de/en/frontend/referenz/funktionen#unixtoiso)

***

### join

The `join` function joins all entries of a listing into a string. Optionally, a separator can be specified that separates the elements from one another.

**Usage example**\
Suitable, for example, for outputting product properties, variant attributes, or categories as a continuous text — e.g., comma-separated in one line.

**Signature**\
`join(list[, "separator"])`

**Parameters**

* `list` - The listing whose entries are to be joined.
* `separator` (optional) - Separator between the entries. Default: no separator.

**Usable as modifier**\
yes

**Example without separator**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= join(["S", "M", "L", "XL"]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
SMLXL
```

**Example with separator**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= join(["S", "M", "L", "XL"], ", ") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
S, M, L, XL
```

**Example - output available colors of a product as text**\
The variant data of a product is loaded via `$wsProducts.variantInfo()`. The attribute "color" contains a listing of options (here: `"Red"`, `"Blue"`, `"Green"`). The color names are collected in a loop, gathered in a listing with [push](#push), and joined into a readable text with `join`.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myVariants = $wsProducts.variantInfo("100-12345") }}
{{ var $colors = [] }}
{{ for $myOption in $myVariants.variantAttributes[0].options }}
  {{ push($colors, $option.name) }}
{{ /for }}
<p>Available colors: {{= join($colors, ", ") }}</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Available colors: Red, Blue, Green
```

**Counterpart**\
[split](#split)

***

### json

The `json` function outputs a data object in technical JSON notation — a standardized text format that can easily be processed by machines.

**Usage example**\
Useful for debugging in the template or for passing data to external services (e.g., tracking, analytics).

**Signature**\
`json(object)`

**Parameters**

* `object` - The object to be output as a JSON string.

**Usable as modifier**\
yes

**Example - output of product data for debugging**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $product = $wsView.info.product }}
<pre>{{= json($product) }}</pre>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{"name":"Sneaker Classic","price":89.95,"sku":"SNK-001","sizes":["40","41","42"]}
```

<Info>
  No more than five levels are output. Deeper levels are represented as `"…"`.
</Info>

***

### keys

The `keys` function returns all identifiers (keys) of a data object (map) as a listing. A map consists of pairs of identifiers and values — e.g., `{name: "Topseller", price: 12.99}`. With `keys`, the identifiers can be specifically read out.

**Usage example**\
Useful, for example, to iterate over all entries of a data object and display both the identifiers and the associated values in the template — e.g., for dynamically built product data or configuration settings.

**Signature**\
`keys(object)`

**Parameters**

* `object` - The data object whose identifiers (keys) are to be returned.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= keys({name: "Topseller", price: 12.99, description: "Description"}) }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
["description","price","name"]
```

***

### last

The `last` function returns the last entry of a listing (list).

**Usage example**\
Useful, for example, to specifically display the last order item, the last breadcrumb entry, or the last element of a variant list.

**Signature**\
`last(list)`

**Parameters**

* `list` - the listing whose last entry is to be returned.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= last(["a", "b", "c", "d"]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
d
```

**Example - display the last breadcrumb entry as the current category**\
The category path (breadcrumb) is loaded as a listing via `$wsCategories.loadPath()`. With `last`, the last entry is specifically read out, since it corresponds to the current category.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myBreadcrumb = $wsCategories.loadPath($category.id) }}
<p>Category: {{= last($myBreadcrumb).name }}</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Sneaker
```

***

### len

The `len` function determines the length, i.e., the number of characters for a text, the number of entries for a listing, or the number of key-value pairs for a data object.

**Usage example**\
Useful, for example, to count the number of products in a list, check the character length of an input, or determine how many entries a data object contains.

**Signature**\
**len(sequence)**

**Parameters**

* `sequence` - text, listing, or data object whose length is to be determined.

**Usable as modifier**\
yes

**Example with text**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= len("abc def. XYZ") }}
```

**Output** (number of characters)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
12
```

**Example with a listing**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= len([1, 2, 3]) }}
```

**Output** (number of entries)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
3
```

**Example with a data object**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= len({name: "Product", price: 12.99}) }}
```

**Output** (number of key-value pairs)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2
```

**Example - display the number of products in a category**\
The products of a category are loaded via [\$wsCategories.loadProducts()](/en/frontend/referenz/module/wscategories#\$wscategories-loadproducts) (here: 24 products in the category). With `len`, the number is determined.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $products = $wsCategories.loadProducts("100-12345") }}
<p>{{= len($products) }} products found</p>
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
24 products found
```

***

### lower

The `lower` function converts all letters of a text to lowercase.

**Usage example**\
Useful, for example, to display or compare user input, voucher codes, or product identifiers uniformly in lowercase.

**Signature**\
`lower(content)`

**Parameters**

* `content` - the text to be converted to lowercase.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= lower("TOPSELLER") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
topseller
```

**Counterpart**\
[upper](#upper)

***

### max

The `max` function returns the highest value from a listing of numbers.

**Usage example**\
Useful, for example, to determine the most expensive price within a variant list or the highest available quantity.

**Signature**\
`max(list)`

**Parameters**

* `list` - the listing with numeric values.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= max([5, 13, -1, 3, 2, -7, 12]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
13
```

**Example - determine the highest order value from the order history**\
The customer's most recent orders are loaded via `$wsOrderHistory.loadList()`. Each order contains, among other things, the field `order.total` (total price). The loaded order values are gathered in a separate listing with [push](#push), and then the highest value is determined with `max`.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myOrders = $wsOrderHistory.loadList() }}
{{ var $myTotals = [] }}
{{ for $myOrder in $myOrders }}
  {{ push($myTotals, $myOrder.order.total) }}
{{ /for }}
<p>Your highest order: {{= max($myTotals) | currency }} €</p>
```

**Output** (with order values `49.90`, `129.00`, `89.95`):

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Your highest order: 129.00 €
```

**Counterpart**\
[min](#min)

***

### merge

The `merge` function joins two data objects (maps) together. The entries from the second object (`source`) are taken into the first object (`target`). For lists, the entries of the second list are appended to the first. No new object is created; the first object is directly modified.

For maps, the optional parameter `deep` is available. With `deep=true`, nested maps are also merged instead of being overwritten.

**Usage example**\
Useful, for example, to merge default values for the product display with product-specific values. This way, default texts or fallback images can be defined that are only used when a product does not have its own value.

**Signature**\
`merge(target, source[, deep=false])`

**Parameters**

* `target` - the target object into which the entries are inserted.
* `source` - the source object whose entries are taken over.
* `deep` (optional) - only for maps. With `true`, nested maps are also merged.

**Usable as modifier**\
yes

**Example - merge default values with product-specific data**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $defaults = {"badge": "New", "shipping": "Standard shipping"} }}
{{ var $productData = {"badge": "Sale", "color": "red"} }}
{{= merge($defaults, $productData) }}
```

**Output**

```json theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{"badge": "Sale", "shipping": "Standard shipping", "color": "red"}
```

<Info>
  If both objects contain the same identifier (key), the value from the first object is overwritten by the value from the second object.
</Info>

**Example - merge product data with nested default values** (`deep merge`)

Default values for a product also contain nested image data (`image`). With `deep=true`, these are not completely overwritten during the merge but are also merged — so that only the image paths actually supplied by the product are taken over, but missing ones are preserved by the default value.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $defaults = {"badge": "New", "shipping": "Standard shipping", "image": {"normal": "noImageNormal.png", "thumb": "noImageThumb.png"}} }}
{{ var $productData = {"badge": "Sale", "image": {"normal": "sneaker-normal.png"}} }}
{{= merge($defaults, $productData, true) }}
```

**Output (the thumbnail from the default values is preserved because the product does not supply one)**

```json theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{"badge": "Sale", "shipping": "Standard shipping", "image": {"normal": "sneaker-normal.png", "thumb": "noImageThumb.png"}}
```

***

### min

The `min` function returns the lowest value from a listing of numbers.

**Usage example**\
Useful, for example, to determine the cheapest price within a variant list or the smallest stock.

**Signature**\
`min(list)`

**Parameters**

* `list` - the listing with numeric values.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= min([5, 13, -1, 3, 2, -7, 12]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
-7
```

**Example - determine the lowest order value from the order history**\
The customer's most recent orders are loaded via [\$wsOrderHistory.loadList()](/en/frontend/referenz/module/wsorderhistory#\$wsorderhistory-loadlist). Each order contains, among other things, the field `order.total` (total price). The order values are gathered in a separate listing with [push](#push), and then the lowest value is determined with `min`.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myOrders = $wsOrderHistory.loadList() }}
{{ var $myTotals = [] }}
{{ for $myOrder in $myOrders }}
  {{ push($myTotals, $myOrder.order.total) }}
{{ /for }}
<p>Your lowest order: {{= min($myTotals) | currency }} €</p>
```

**Output** (with order values `49.90`, `129.00`, `89.95`):

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Your lowest order: 49.90 €
```

**Counterpart**\
[max](#max)

***

### preparedFormat

The `preparedFormat` function formats a number with respect to decimal separator and decimal places, based on a [format stored in the shop](/en/konfiguration/general-allgemeine-shopeinstellungen#12-general-numberformat-zahlen-und-preisformatierung).

**Usage example**

Useful, for example, to display quantity specifications, weights, or other numeric values appropriately for the shop.

**Signature**\
`preparedFormat(number, formatName)`

**Parameters**

* `number` - The number to be formatted.
* `name` - Name of the format configured in the shop (e.g., `"amount"`).

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= preparedFormat(3.5, "amount") }}
```

**Output** (`amount` formats here to whole numbers)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
4
```

**Example - output product weight formatted**\
The weight of a product is stored as a decimal number in the field `$myProduct.custom.weight` (here: `2.300000`). With `preparedFormat`, it is output according to the format `"weight"` stored in the shop.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $weight = $myProduct.custom.weight }}
<p>Weight: {{= preparedFormat($weight, "weight") }} kg</p>
```

**Output** (with a weight of `2.300000` and format `"weight"` with one decimal place):

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Weight: 2.3 kg
```

***

### push

The `push` function adds a new element to the end of an existing list and returns the new number of entries in the listing. The list is directly modified; no new list is created.

**Usage example**\
Useful, for example, to specifically collect entries in a loop, such as filtered products, error messages, or dynamically composed output lists.

**Signature**\
`push(list, element)`

**Parameters**

* `list` - The listing to which the new element should be appended.
* `element` - The value to be added.

**Usable as modifier**\
yes

**Example - add element**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myWishlist = ["ART-100", "ART-205"] }}
{{ push($myWishlist, "ART-310") }}
{{= $myWishlist }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
["ART-100", "ART-205", "ART-310"]
```

**Example - use return value**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myWishlist = [] }}
{{ push($myWishlist, "ART-100") }}
{{ var $amount = push($myWishlist, "ART-205") }}
{{= $amount }}
```

**Output (number of entries after adding)**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2
```

**Example - load products of a category and add products from another category**\
The products of a category are loaded as a listing via `$wsCategories.loadProducts()`. With `push`, products from a second category can be appended to the list — e.g., to include cross-selling items in the output.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProducts = $wsCategories.loadProducts("100-12345") }}
{{ var $myCrossSelling = $wsCategories.loadProducts("100-99999") }}
{{ for $item in $myCrossSelling }}
  {{ push($myProducts, $item) }}
{{ /for }}
{{ for $product in $myProducts }}
  <p>{{= $product.name }}</p>
{{ /for }}
```

The listing `$myProducts` now contains all products of the first category plus the products from the cross-selling category.

***

### random

The `random` function generates a random value.

**Usage example**\
Useful, for example, to generate random voucher codes.

**Note**\
The function is planned but is not yet supported at the moment.

***

### range

The `range` function generates a listing of consecutive whole numbers — from the start value to the end value. By default, it counts in steps of one. For descending series, a negative step size must be specified.

**Usage example**\
Useful, for example, to generate page breaks (pagination), quantity selectors, or numbered outputs in the template.

**Signature**\
`range(start, stop[, step=1])`

**Parameters**

* `start` - Start value of the number series.
* `stop` - End value of the number series.
* `step` (optional) - Step size (default: 1). Use a negative value for descending series.

**Usable as modifier**\
no

**Example of an ascending series**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= range(1, 5) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[1, 2, 3, 4, 5]
```

**Example of a descending series**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= range(10, 2, -2) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[10, 8, 6, 4, 2]
```

***

### raw

The `raw` function outputs a value without automatic cleaning of HTML characters, so that contained HTML code is interpreted by the browser as formatting instead of being displayed as plain text.

**Usage example**\
Useful, for example, to display formatted product descriptions or CMS content with HTML markup unchanged in the shop.

**Note**\
The function is planned but is not yet supported at the moment.

***

### replace

The `replace` function replaces all occurrences of a search term in a text with another text.

**Usage example**\
Useful, for example, to make internal designations more readable for display in the shop.

**Signature**\
`replace(string, search, replace)`

**Parameters**

* `content` - The source text.
* `search` - The text to be searched and replaced.
* `replace` - The text to be inserted instead.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= replace("webbuy", "buy", "sale") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
websale
```

***

### reverse

The `reverse` function reverses the order of the characters in a text or the entries in a listing.

**Usage example**\
Useful, for example, to reverse an existing sort order or to output entries in reverse order (e.g., newest entries first).

**Note**\
The function is planned but is not yet supported at the moment.

***

### round

The `round` function rounds a number commercially up or down. Optionally, the desired number of decimal places can be specified. Without specification, it is rounded to a whole number.

**Usage example**\
Useful, for example, to display calculated intermediate values, weights, or quantities commercially rounded in the template.

**Signature**\
`round(number[, precision=0])`

**Parameters**

* `number` - The number to be rounded.
* `precision` (optional) - Desired number of decimal places (default: 0).

**Usable as modifier**\
yes

**Example without decimal places**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= round(3.1415) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
3.000000
```

**Example with 2 decimal places**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= round(1.2345, 2) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
1.230000
```

**Display with two decimal places**

The `precision` parameter controls the mathematical rounding (to how many decimal places the value is rounded). However, the output, by system design, always shows up to six decimal places (e.g., `1.230000` instead of `1.23`). To adjust the display (e.g., only 2 visible decimal places), `round` is used in combination with [preparedFormat](#preparedformat):

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= round(1.2345, 2) | preparedFormat("name") }}
```

***

### sort

The `sort` function sorts the entries of a listing (list). By default, it sorts in ascending order. With the optional parameter `reverse`, however, the sort order can also be reversed.

**Usage example**\
Useful, for example, to sort product lists, variants, or filter options alphabetically or by numeric value.

**Signature**\
`sort(list[, reverse=false])`

**Parameters**

* `list` - The listing whose entries are to be sorted.
* `reverse` (optional) - With `true`, it sorts in descending order.

**Usable as modifier**\
yes

**Example with numbers**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= sort([5, 2, 8, 1, 4]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[1.0, 2.0, 4.0, 5.0, 8.0]
```

**Example with texts**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= sort(["Trousers", "Accessory", "Jacket"]) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
["Accessory", "Jacket", "Trousers"]
```

**Example - sort prices in descending order**

If the list consists only of numbers, all elements will have the type `float` after sorting.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $prices = [49.90, 129.00, 19.95, 89.95] }}
{{= sort($prices, true) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[129.000000, 89.950000, 49.900000, 19.950000]
```

**Example - sort available colors of a product alphabetically**\
The variant data of a product is loaded via `$wsProducts.variantInfo()`. The attribute "color" contains a listing of options (here: `Red, Blue, Green, Beige`). Since the options are present as objects (e.g., `{name: "Red"}`), the names are first collected in a separate listing with [push](#push). Then they are sorted alphabetically with `sort` and output in a loop.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myVariants = $wsProducts.variantInfo("100-12345") }}
{{ var $colors = [] }}
{{ for $myOption in $myVariants.variantAttributes.options }}
  {{ push($colors, $myOption.name) }}
{{ /for }}
{{ var $sortedColors = sort($colors) }}
{{ for $color in $sortedColors }}
  <li>{{= $color }}</li>
{{ /for }}
```

***

### split

The `split` function splits a text into a listing (list) of individual entries based on a separator.

**Usage example**\
Useful, for example, to break down comma-separated values from product data, configurations, or external sources into individual entries and process them separately.

**Signature**\
`split(content, separator)`

**Parameters**

* `content` - The text to be split.
* `separator` - The separator at which the text is split.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= split("vegan,gluten-free,lactose-free,organic", ",") }}
```

**Output**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
["vegan", "gluten-free", "lactose-free", "organic"]
```

**Counterpart**\
[join](#join)

***

### startswith

The `startswith` function checks whether a text begins with a specific character sequence and returns `true` or `false`.

**Usage example**\
Useful, for example, to distinguish article numbers based on their leading characters and react accordingly in the template, e.g., to display products from specific product groups differently (e.g., to mark all article numbers that begin with `"TKK"` as frozen products).

**Signature**\
`startswith(str, prefix)`

**Parameters**

* `str` - The text to be checked.
* `prefix` - The character sequence to check for at the beginning of the text.

**Usable as modifier**\
yes

**Example with a match**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= startswith("TKK-40210", "TKK") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
true
```

**Example without a match**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= startswith("BKL-10050", "TKK") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
false
```

**Example - assign products to a product group based on the article number**

The article number of a product is in the field `itemNumber` (here: `"TKK-40210"`). Article numbers that begin with `"TKK"` belong to the frozen products group. With `startswith`, this is checked and a corresponding badge is displayed.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProduct = $wsProducts.load("100-12345") }}
{{ if (startswith($myProduct.itemNumber, "TKK")) }}
  <span>Frozen product</span>
{{ /if }}
```

**Output** (with article number `"TKK-40210"`)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Frozen product
```

***

### static

The `static` function generates the full path to a static file (e.g., JavaScript, CSS, images). By default, such files are located under `media/themes/default` on the shop's server.

**Usage example**\
Useful, for example, to correctly include paths to static files in the template — even if the storage location changes later.

**Signature**\
`static(path)`

**Parameters**

* `path` - Path to the file, relative to the static directory of the shop.

**Usable as modifier**\
no

**Example**\
Instead of a fixed path:

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<script src="media/themes/default/scripts/core.js"></script>
```

it is recommended to use `static`:

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<script src="{{= static('scripts/core.js') }}"></script>
```

<Info>
  Through consistent use of `static`, the storage location of the static files can be adjusted at any time (e.g., to a media server or a CDN) without the templates having to be changed. For category or product images, `static` is not needed — their paths are generated automatically and correctly.
</Info>

***

### str

The `str` function converts a value into a text (string). For numbers, the result may look identical, but internally it is a string — i.e., no longer a numeric value that could be used for calculations. Instead, the value can subsequently be processed further with text-based functions such as `replace`, `startswith`, or `split`.

**Usage example**\
Useful, for example, to convert an article number that is present as a number into a text so that `startswith` can subsequently check whether it begins with a specific character sequence.

**Signature**\
`str(value)`

**Parameters**

* `value` - The value to be converted into text.

**Usable as modifier**\
yes

**Example with a whole number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= str(42) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
"42"
```

**Example with a decimal number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= str(12.99) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
"12.99"
```

***

### striphtml

The `striphtml` function removes all HTML formatting (tags) from a text and returns only the plain text content.

**Usage example**\
Useful, for example, to output HTML-formatted product descriptions as plain text.

**Signature**\
`striphtml(content)`

**Parameters**

* `content` - The text from which the HTML formatting is to be removed.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= striphtml("<p>Our <strong>top seller</strong> in the shop!</p>") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Our top seller in the shop!
```

***

### take

The `take` function returns the first characters of a text or the first entries of a listing.

**Usage example**\
Useful, for example, to display only the first characters of a product name or the first entries of a product list.

**Signature**\
`take(content, count)`

**Parameters**

* `content` - The text or the listing from which the first elements are to be taken.
* `count` - the number of characters or entries to be taken from the beginning.

**Usable as modifier**\
yes

**Example with text**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= take("websale", 3) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
web
```

**Example with a listing**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= take([1, 2, 3, 4, 5], 3) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[1, 2, 3]
```

**Example - display only the first 4 products of a category**\
The products of a category are loaded as a listing via [\$wsCategories.loadProducts()](/en/frontend/referenz/module/wscategories#\$wscategories-loadproducts) (here: `24 products`). With `take`, in this example, only the first 3 entries are taken and output in a loop as a teaser.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $myProducts = $wsCategories.loadProducts("100-12345") }}
{{ var $myTopProducts = take($myProducts, 3) }}
{{ for $product in $myTopProducts }}
  {{= $product.name }}
{{ /for }}
```

**Output** (with products `"Sneaker Classic"`, `"Laufschuh Pro"`, `"Sandale Sport"`, `"Wanderstiefel"`, …)

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Sneaker Classic
Laufschuh Pro
Sandale Sport
```

**Counterpart**\
[takelast](#takelast)

***

### takelast

The `takelast` function returns the last characters of a text or the last entries of a listing.

**Usage example**\
Useful, for example, to specifically display the last characters of an order number or the last entries of a list.

**Signature**\
`takeLast(content, count)`

**Parameters**

* `content` - The text or the listing from which the last elements are to be taken.
* `count` - The number of characters or entries to be taken from the end.

**Usable as modifier**\
yes

**Example with text**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= takeLast("12345", 2) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
45
```

**Example with a listing**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= takeLast([1, 2, 3, 4, 5], 2) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
[4, 5]
```

**Example - display the last 2 levels of the breadcrumb path**\
The category path (`Breadcrumb`) is loaded as a listing via [\$wsCategories.loadPath()](/en/frontend/referenz/module/wscategories#\$wscategories-loadpath) (here: 4 levels). With `takeLast`, only the last 2 entries are taken — e.g., to display only the current and the parent category in a sub-navigation.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{ var $breadcrumb = $wsCategories.loadPath($category.id) }}
{{ var $lastTwo = takeLast($breadcrumb, 2) }}
{{ for $cat in $lastTwo }}
  {{= $wsViews.url('Category', {id: $cat.id}) }}">{{= $cat.name }}
{{ /for }}
```

**Output** (for a path "Home → Women → Shoes → Sneaker"):

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Shoes
Sneaker
```

**Counterpart**\
[take](#take)

***

### trim

The `trim` function removes superfluous spaces at the beginning and end of a text.

**Usage example**\
Useful, for example, to clean user input, imported product data, or external values of unwanted whitespace before further processing.

**Note**\
The function is planned but is not yet supported at the moment.

***

### type

The `type` function returns the data type of a value as text — e.g., whether it is a text (`string`), a whole number (`int`), a decimal number (`float`), a listing (`list`), or a data object (`map`).

**Usage example**\
Useful, for example, for debugging or to check in the template whether a value has the expected type before it is processed further.

**Signature**\
`type(object)`

**Parameters**

* `object` - The value whose data type is to be determined.

**Usable as modifier**\
yes

**Example using a text**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= type("Websale") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
String
```

**Example using a decimal number**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= type(1.27) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
Float
```

***

### unixToIso

The `unixToIso` function converts a Unix time (number of seconds since 1 January 1970, UTC) into a timestamp in ISO 8601 format.

**Usage example**\
Useful, for example, to bring a Unix time provided by an external system into the ISO 8601 format commonly used in the shop, which can then be formatted with [dateFmt](https://dokumentation.websale.de/en/frontend/referenz/funktionen#datefmt).

**Signature**\
`unixToIso(timestamp)`

**Parameters**

* `timestamp` - Unix time (number of seconds since 1 January 1970, UTC).

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= unixToIso(1520767211) }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
2018-03-11T11:20:11.000Z
```

**Counterpart**\
[isoToUnix](https://dokumentation.websale.de/en/frontend/referenz/funktionen#isotounix)

***

### upper

The `upper` function converts all letters of a text to uppercase.

**Usage example**\
Useful, for example, to display voucher codes, shipping methods, or headings uniformly and in uppercase.

**Signature**\
`upper(content)`

**Parameters**

* `content` - The text to be converted to uppercase.

**Usable as modifier**\
yes

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= upper("Topseller") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
TOPSELLER
```

**Counterpart**\
[lower](#lower)

***

## Modifier

Many functions can alternatively also be used as [modifiers (filters)](/en/frontend/referenz/modifiers#modifiers) in filter notation.

The first parameter is to the left of the pipe operator `|`; further parameters are specified in parentheses.

Alternatively, a function can also be written with the filter operator | (pipe) (= filter notation). The first parameter is to the left of the operator.

**Example**

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{{= "webbuy" | replace("buy", "sale") }}
```

**Output**

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
websale
```
