Search

Generelt #

For at integrere din indlejringskode til enten Live Search eller Search Page, skal du få adgang til dine tema filer. For at gøre dette, følg stien Tema > temafiler > mine temaer > vælg > rediger temaer > find filer

Live Search #

• Først skal du oprette dit Live Search Design og Indhold i my.clerk.io.

• I din header-fil eller live-search header-fil (sandsynligvis header.html , eller, i dette eksempel, header-search.html), skal Live Search indlejringskoden placeres.

• Sørg for at opdatere pladsholderen inden for “data-instant-search” for at inkludere den forespørgselsklasse eller ID, der bruges i din webshop (i dette eksempel, “#search_query_adv”).

Search Page #

• Først skal du oprette dit Search Page Design og Indhold i my.clerk.io.

• I din søgeside-fil (sandsynligvis search.html), skal Search Page indlejringskoden placeres.

• Sørg for at opdatere pladsholderen inden for “data-query” for at inkludere den forespørgsel, der bruges i din søgning resultater URL (i dette eksempel, “forms.search.query”).

Facetter #

Clerk.js kommer med indbygget support til Faceted Search.

Enhver produkattribut du sender til Clerk.io kan bruges som en del af den Faceted Search.

Lad os starte med et hurtigt eksempel:

<div id="clerk-search-filters"></div>
<div id="clerk-search-results"></div>

<span
  class="clerk"

  data-template="@search-page"
  data-query="shoes"
  data-offset="0"

  data-target="#clerk-search-results"

  data-facets-target="#clerk-search-filters"
  data-facets-attributes='["categories","manufacturer","gender"]'
  data-facets-multiselect-attributes='["categories","manufacturer"]'
  data-facets-titles='{"categories":"Kategorier","manufacturer":"Mærke","gender":"Køn"}'
  data-facets-design='12234'>
</span>

Data-facets- delene giver dig mulighed for at aktivere og tilpasse den Faceted Search.

Ved at tilføje disse til din Search Page indlejringskode, vil facetter blive vist, så snart resultaterne vises.

Nedenfor kan du se, hvad hver del gør:

Styling Facetter #

Facetter kommer med en simpel styling ud af boksen. For at ændre dette, skal du blot bruge CSS vælgere (mere om facet styling her, for at tilføje enhver brugerdefineret styling.

Tilføjelse af Facetter til din BigCommerce Butik #

For at tilføje facetter til din Search Page inden for din BigCommerce webshop, skal du blot tilføje de relevante data-attributter til din Search Page indlejringskode, som du kopierede ind i den fil, hvor din Search Page findes, sandsynligvis search.html.

For eksempel:

Du kan også tilføje enhver styling CSS til den samme fil. Sørg for at omgive al facetter CSS medtags: