Home > widget-integration > FilterHelper > getTemplate

FilterHelper.getTemplate() method

Gets a specific template by key with customization support.

Retrieves templates for rendering filter UI components, checking for customized versions in TAEAppConfig.templateParsed or TAEAppConfig.template before falling back to default templates. This is a critical customization point allowing shops to completely override widget UI rendering. Override this method to add template preprocessing, caching, or custom template resolution logic.

Signature:

getTemplate(templateKey: string): string;

Parameters

Returns:

string

The customized or default template string

Exceptions

{Error} If templateKey is not found in DEFAULT_TEMPLATES

Remarks

Template resolution priority: 1. TAEAppConfig.templateParsed[metafieldKey] (highest priority) 2. TAEAppConfig.template[metafieldKey] 3. DEFAULT_TEMPLATES[templateKey] (fallback)

Available template keys: - refineByTemplate, refineByHorizontalTemplate - filterOptionListTemplate, filterOptionBoxTemplate, filterOptionSwatchTemplate - filterOptionMultiLevelCollection, filterOptionMultiLevelTagTemplate - filterOptionRatingTemplate, cartTemplate, productPriceTemplate - searchTabCollectionsTemplate, searchTabPagesTemplate, searchTabPaginationTemplate - preOrderTemplate

Example 1

Basic usage:

const template = this.filterHelper.getTemplate('filterOptionBoxTemplate');
const html = await this.appService.templateRender(template, data);

Example 2

Extend to add template caching:

window.boostWidgetIntegration.extend('FilterHelper', (FilterHelper) => {
  return class CustomFilterHelper extends FilterHelper {
    constructor(...args) {
      super(...args);
      this.templateCache = new Map();
    }

    getTemplate(templateKey) {
      if (this.templateCache.has(templateKey)) {
        return this.templateCache.get(templateKey);
      }
      const template = super.getTemplate(templateKey);
      this.templateCache.set(templateKey, template);
      return template;
    }
  };
});