Dynamic Filtering In Embed Codes

Clerk.io filters can be used directly in the embed codes using the data-filter attribute. This allows you to make dynamic filters in the logic based on variables in the webshop.

Below you’ll find a few examples, but you can use this in many other ways.

Display products that allow a free shipping limit to be reached:

Assuming you shop has a variable called $free_shipping_limit that contains the remaining amount needed for the customer to reach the free shipping limit, you can use a dynamic filter that looks like this, to only display products above this price point:

<span class="clerk"
      data-template="@complementary-to-basket"
      data-filter="price > $free_shipping_limit">
</span>

Display products matching a specific gender:

This example assumes your products has an attribute called gender that returns either female or male.

You then need a variable in your store containing the gender for the current product, which in this example is called $product_gender.

The embed code with the filter can then be setup like this:

<span class="clerk"
      data-template="@Bestsellers"
      data-filter="gender = $product_gender">
</span>

Display products of a specific type or brand:

You can filter sliders to only show products from within the same category as the product that the customer is looking at.

In this case you need a list in your store containing the product categories, which we will call $categories here. The list should look like this : $categories =[1,2,3,4,5] The filter could then be setup like this:

<span class="clerk"
      data-template="@type-slider"
      data-filter="categories in $categories">
</span>