Make Some Facets Collapsible,

Search Best Practices - Search Front-End
1

Hi Team,

Is there a way to make certain facets expandable/collapsible?
Example, I would want to keep the “category” facet in the screenshot below permanently open, but allow for color and size to be collapsible. Something like

image
image1455×780 62.9 KB

image

Best,
Luc

2

Hi Luc,

You can use the field overrides in facets to do this! Here’s an example:

"Facets": {
 //other config here
 "fields": {
     "category": { //or whatever the api name is
          "expand": false
      }
}

This should open the category facet permanently.

Let us know how it works for you.

Thanks,
Rose

2 Likes
3

Thank you Rose!! That did the trick.

Sharing my full solution below:
image

"Facets": {
  "title": "", // The title to display above the facets
  "showMore": true, // Display a link to see more facet options within a facet
  "searchOnChange": true, // Will automatically run a search as facets are selected or unselected. Set to false to only trigger updates with an Apply button. 
  // Additional options are available in the documentation
  "fields": {
      "c_category": {
        "expand": false
      },
      "c_color": {
        "expand": true
      },
      "c_size": {
        "expand": true
      }
  }
},
1 Like