Using FECL

Create custom criteria for dynamic page rules with Frontend Entity Criterion Language.

Frontend Entity Criterion Language (FECL) lets you write expressions to define criteria for dynamic page rules. In a FECL expression, a criterion consists of a field, a conditional operator, and a value. The conditional operator compares the field value with the specified value. In a FECL expression, you can also use logical operators to combine more criteria.

For example, you can define a FECL expression for a product details page with criteria to display only if the requested product is from the specified category.

FECL expression with criteria to check the product category ID

(categoryId = "2074" and categoryId = "3392") or (categoryId < "2000")

FECL syntax

Conditional operators

In your FECL expression, you can use the following conditional operators to define dynamic page rule criteria:

=: checks if the field value and the specified value are equal.
!=: checks if the field value and the specified value are unequal.
>: checks if the field value is greater than the specified value.
<: checks if the field value is lesser than the specified value.
<=: checks if the field value is less than or equal to the specified value.
>=: checks if the field value is greater than or equal to the specified value.
in: checks if the specified value is present in the selected field, if the field is an array.

With FECL you cannot define an all elements in a list expression. The workaround is to pre-calculate a resulting property in the pageMatchingPayload and then use the property in a FECL expression.

Logical operators

In your FECL expression, you can use the following logical operators to combine dynamic page rule criteria:

and: the rule applies if all criteria are all met.
or: the rule applies if at least one criterion is met.
not: the rule applies if the criterion is not met.

You should use parentheses to indicate the precedence for sub-expression evaluation. For example:

FECL expression combining criteria with the 'and' and 'or' operators

(categoryId = "2074" and categoryId = "3392") or (categoryId < "2000")

You must add a space before and after an operator. Otherwise, the dynamic page rule criteria will not be applied.

FECL on dynamic pages

The FECL expression is evaluated based on the data returned in the pageMatchingPayload field in the dynamic page handler response. To use FECL, you must return the pageMatchingPayload from the dynamic page handler. The payload can have nested structures that you can traverse like JavaScript objects by separating levels using a ..

For example, for this dynamic page handler implementation you can use the following FECL expression.

Dynamic page handler returning pageMatchingPayloadtypescript

export default {
  'dynamic-page-handler': async (
    request: Request,
    context: DynamicPageContext
  ): Promise<DynamicPageSuccessResult | DynamicPageRedirectResult | null> => {
    // Code of the dynamic page logic.
    return {
      dynamicPageType: 'example/dynamic-page',
      dataSourcePayload: {
        // ...
      },
      pageMatchingPayload: {
        productId: 3020,
        categoryIds: [2020, 2040, 2060],
        name: 'top-shirt',
        user: {
          id: 50020,
        },
      },
    };
  },

  // More code.
};

FECL expression that would result false and true based on the pageMatchingPayload

# This expression would result false.
(productId = 2000) and (user.id = 50020 and name = 'top-pant')

# This expression would result true.
(productId = 2000) or (user.id = 50020 and name = 'top-shirt')

FECL for user personalization

You can use FECL to customize dynamic pages based on the information of the logged user. For example, you can show a special discount banner to users from a particular postal code.

For example, for the following code this FECL expression will result true for users with postalCode between 122000 and 123000.

Return user personalization information in the pageMatchingPayloadtypescript

export default {
  'dynamic-page-handler': async (
    request: Request,
    context: DynamicPageContext
  ): Promise<DynamicPageSuccessResult | DynamicPageRedirectResult | null> => {
    // Identify Product
    if (ProductRouter.identifyFrom(request)) {
      return ProductRouter.loadFor(request, context.frontasticContext).then(
        (product: Product) => {
          if (product) {
            return {
              dynamicPageType: 'frontastic/product-detail-page',
              dataSourcePayload: {
                product: product,
              },
              pageMatchingPayload: {
                product: product,
                user: {
                  postalCode:
                    request?.sessionData?.account?.addresses[0].postalCode,
                },
              },
            };
          }
          return null;
        }
      );
    }
    // more code...
  },
};

FECL expression to check if the user's postalCode is between 122000 and 123000

user.postalCode > 122000 and user.postalCode < 123000