Algolia: Change label of currentRefinements item

Question

I'm using a toggleRefinement widget to check if an item is on sale. There is an extra attribute in my index called on_sale. It has true or false value.

As a result my currentRefinements widget shows true or false instead of a better text like "Only on sale".

Is there a way to change the output?

Unlike other widgets, there is no template attribute for this one. See docs

This is my current code:

instantsearch.widgets.toggleRefinement({
  container: '#onsale',
  attribute: 'on_sale',
  templates: {
    labelText: 'Only on sale',
  },
}),

This is my current output:

<ul class="ais-CurrentRefinements-list">
    <li class="ais-CurrentRefinements-item">
        <span class="ais-CurrentRefinements-label">On_sale:</span>
        <span class="ais-CurrentRefinements-category">
            <span class="ais-CurrentRefinements-categoryLabel">true</span>
            <button class="ais-CurrentRefinements-delete">✕</button>
        </span>
    </li>
</ul>

Provide the function that generates true or false and adds to `toggleRefinement` — ABDULLOKH MUKHAMMADJONOV, Oct 06 '21 at 17:43
There is no function, the `true` and `false` are values in the Algolia index — Cray, Oct 06 '21 at 18:45
You said `It outputs`. 'Outputs' is more related to functions. I suggested an edit — ABDULLOKH MUKHAMMADJONOV, Oct 06 '21 at 18:49

score 1 · Accepted Answer · answered Oct 07 '21 at 10:09

1

The template option doesn't exist but you have the possibility to control the output of the widget with the connector API (doc). You can render the widget with whatever output. You have complete control over it.

answered Oct 07 '21 at 10:09

Samuel Vaillant

3,667
1
14
21

Okay, I will try to figure out a solution :-) – Cray Oct 07 '21 at 12:14

Algolia: Change label of currentRefinements item

1 Answers1