> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kleep.ai/llms.txt
> Use this file to discover all available pages before exploring further.
# Shopify Integratiehandleiding
**Deze handleiding begeleidt u bij het installeren van Kleep in uw Shopify-winkel. Kleep biedt drie hoofdfuncties: een intelligente maatgids (Kleep Sizing), aanbevelingen voor vergelijkbare producten (Kleep Similar Products), en een geoptimaliseerde zoekfunctie (Kleep Search).**
## Overzicht van het integratieproces
Dit is wat u kunt verwachten van het ondertekenen van het contract tot live gaan en daarna. De volledige integratie duurt doorgaans ongeveer **5–6 weken**.
### Onboarding
Zodra het contract is ondertekend, start uw Kleep-vertegenwoordiger de facturering via GoCardless: [Directe incasso instellen →](https://pay.gocardless.com/BRT000352V7T67Q).
Een kort gesprek met uw Kleep-vertegenwoordiger om de tijdlijn, technische contactpersonen en eventuele winkelspecifieke vereisten vóór de installatie af te stemmen.
Na de startvergadering vragen we u enkele details te delen over uw bedrijf, facturering, winkelomgevingen en retouropstelling, zodat we de integratie kunnen voorbereiden.
**[Vul ons onboardingformulier in →](https://ihu3s9tz3r8.typeform.com/to/fYQw9zJ5)**
Het duurt ongeveer 5 minuten. Na indiening beoordeelt ons team uw antwoorden en bevestigt de volgende stappen binnen 1 werkdag.
Stuur ons uw winkeladres (bijv. `your-store.myshopify.com`) samen met uw samenwerkingsverzoekcode zodat wij toegang tot uw winkel kunnen aanvragen.
**Meerdere Shopify-winkels?** Als u meerdere Shopify-instanties heeft (bijv. verschillende regio's of merken), stuur ons dan een samenwerkingscode voor **elke winkel** — we hebben één code per winkel nodig.
Weet u niet waar u deze kunt vinden? Ga in uw Shopify-beheerder naar **Instellingen → Gebruikers en machtigingen** — uw `myshopify.com`-URL staat bovenaan en de **Samenwerkingsverzoekcode** staat vermeld onder de sectie *Medewerkers*. Zie het helpartikel van Shopify over [samenwerkingsaccounts](https://help.shopify.com/en/manual/your-account/staff-accounts/collaborator-accounts) voor meer details.
We sturen een samenwerkingstoegangsverzoek vanuit ons Shopify Partner-account. Keur het goed via **Instellingen → Gebruikers en machtigingen → Medewerkers** in uw Shopify-beheerder.
Zodra we samenwerkingstoegang hebben, sturen we u een app-installatielink **voor elke winkel**. U moet de Kleep-app afzonderlijk installeren op elke Shopify-winkel waar u Kleep wilt inschakelen.
Bekijk onze voorgestelde posities voor de knop "Vind mijn maat" en kies de positie die past bij uw winkel: [CTA-positionering Figma →](https://www.figma.com/design/DvsqgNPSjVPVPLjKV2efAY/KLEEP-CTA-POSITIONING-SUGGESTIONS?node-id=0-1\&p=f\&t=92MwlxQkzlfAYyk5-0).
### Installatie en testen
Ons team dupliceert uw huidige Shopify-thema en installeert Kleep op het duplicaat, zodat uw live winkel onaangeroerd blijft terwijl u test.
We sturen u een privé-voorbeeldlink om de integratie van begin tot eind te testen en eventuele feedback of aanpassingen te delen.
Zodra u akkoord gaat, publiceren we Kleep op uw live thema.
### Na de integratie
We verstrekken inloggegevens aan uw team voor toegang tot het [Kleep Dashboard](https://dashboard.kleep.ai), waar u de KPI's van Kleep in real time kunt bewaken.
We activeren [Fit Feedback](/nl/dashboard/fit-feedback) in uw dashboard zodat uw team de maataanbevelingen van Kleep kan verfijnen met behulp van echte pasgegevens.
## 1. Functionaliteiten
Kleep wordt in uw winkel geïntegreerd door een aangepaste app te installeren die vooraf is aangemaakt. Het maakt het mogelijk om:
1. Onze CTA "Vind mijn maat" toe te voegen aan uw productpagina's
2. De UI rechtstreeks aan te passen in de Thema-editor
Onze app creëert ook geautomatiseerde stromen van producten-, bestel- en retourdata om up-to-date te blijven. Deze gegevens worden dagelijks opgehaald.
Bij installatie maakt de app een WebPixel aan dat wordt gebruikt om meerdere statistieken bij te houden waaruit we de ROI van de oplossing afleiden.
## 2. Functie Vergelijkbare Producten
Vergelijkbare Producten stelt alternatieve producten voor wanneer een maat niet op voorraad is. Deze functie verhoogt conversies door klanten relevante alternatieven aan te bieden.
**Beschikbare weergavemodi**
| Modus | Beschrijving |
| ----------------------- | ----------------------------------------------------------- |
| **Popup (auto)** | Automatische popup bij maat-hover (desktop) / knop (mobiel) |
| **Button (auto)** | Automatische CTA-knop bij winkelwagen bij uitverkoop |
| **Custom buttons only** | U plaatst handmatig knoppen via de thema-editor |
| **Popup + custom** | Automatische popup + extra aangepaste knoppen |
| **Button + custom** | Automatische knop + extra aangepaste knoppen |
**Configuratie**
**Stap 1: Kies de weergavemodus**
Zoek in de instellingen van de Kleep App Embed de optie **"Aanbevolen producten weergeven"** en selecteer de gewenste modus in het vervolgkeuzemenu.
Modusselectie Vergelijkbare Producten
**Aangepaste knoppen toevoegen (voor aangepaste modi)**
Als u een modus met "custom" hebt gekozen, kunt u knoppen op specifieke locaties toevoegen:
1. Ga naar het sjabloon **Productpagina** in de thema-editor
2. Klik in de gewenste sectie op **Blok toevoegen**
3. Klik op het tabblad **Apps** en selecteer **"Kleep Similar Button"**
4. Positioneer het blok waar u het wilt en sla op
Kleep Similar Button-blok toevoegen
Knoppen voor Vergelijkbare Producten verschijnen alleen wanneer een variant niet op voorraad is. Het is normaal als u ze niet op alle producten ziet.
**Meerdere knoppen toevoegen**
U kunt elk gewenst aantal knoppen voor Vergelijkbare Producten toevoegen aan de productpagina. Om meerdere knoppen toe te staan, moet de widget zijn ingesteld op een van: `custom_buttons`, `popup+custom`, of `button+custom`.
Voor OS 2.0-thema's:
* Ga naar **Online Store → Customize**
* Open het sjabloon **Productpagina**
* Klik op **Blok toevoegen → Kleep Similar Button**
* Herhaal als u 2+ knoppen op de pagina wilt
Elke knop verschijnt automatisch alleen wanneer de geselecteerde variant niet op voorraad is.
***
## 3. Kleep Zoekfunctie
Kleep Search vervangt de standaard Shopify-zoekfunctie door een geoptimaliseerde zoekfunctie met maatfilters en gepersonaliseerde aanbevelingen.
**Stap 1: Aangepaste zoekfunctie inschakelen**
Schakel in de instellingen van de Kleep App Embed de optie **"Aangepaste zoekfunctie inschakelen"** in.
Aangepaste zoekfunctie inschakelen
**Stap 2: Toegang tot het zoeksjabloon**
Klik in de thema-editor op het vervolgkeuzemenu bovenaan (standaard "Startpagina") en selecteer **"Zoeken"** uit de sjabloonlijst.
Zoeksjabloon selecteren
**Stap 3: Verberg de standaard zoekfunctie**
Verberg of verwijder in de sectie Sjabloon het native blok **"Zoekresultaten"** door op het oogpictogram te klikken.
Standaard zoekfunctie verbergen
**Stap 4: Voeg het Kleep-zoekblok toe**
Klik op **Sectie toevoegen** en selecteer daarna op het tabblad **Apps** de optie **"Search"** (kleep-dev).
Kleep-zoekblok toevoegen
**Stap 5: Opties configureren**
Klik op het zoekblok dat u hebt toegevoegd om toegang te krijgen tot de instellingen: aantal resultaten, raster-/lijstweergave, zoekvertraging, enz.
Opties voor zoekconfiguratie
## 4. Retourintegratie (Optioneel)
Als u een platform voor retourbeheer gebruikt, kan Kleep retourgegevens integreren om maataanbevelingen te verbeteren.
**Ondersteunde retouraanbieders**
* Global-e
* Aftership
* Fast Return
* Return Go
* Andere (neem contact met ons op)
**Configuratie**
1. Ga in het Kleep Dashboard naar **Instellingen → Retouren**
2. Selecteer uw retouraanbieder
3. Volg de aanbiedersspecifieke instructies om uw account te verbinden
Als uw aanbieder niet in de lijst staat, neem dan contact met ons op via [support@kleep.ai](mailto:support@kleep.ai) — we kunnen een aangepaste integratie instellen via SFTP of API.
## 5. Gebeurtenisregistratie en analyse
Kleep volgt automatisch gebruikersinteracties voor analyses. Zorg ervoor dat de tracking correct werkt vóór het live gaan.
**Bijgehouden gebeurtenissen**
| Gebeurtenis | Beschrijving |
| ------------------------ | --------------------------------------------------------- |
| `kleep_button_click` | Gebruiker klikte op de maatgidsknop |
| `kleep_drawer_open` | Maatgids-drawer geopend |
| `kleep_size_recommended` | Een maataanbeveling werd weergegeven |
| `kleep_add_to_cart` | Gebruiker voegde product toe aan winkelwagen vanuit Kleep |
| `kleep_similar_click` | Gebruiker klikte op een vergelijkbaar product |
**Verificatie**
Om te controleren of gebeurtenissen correct worden geactiveerd:
1. Open de Ontwikkelaarstools van uw browser (F12)
2. Ga naar het tabblad **Netwerk**
3. Filter op "kleep"
4. Interageer met de maatgidsknop
5. U zou API-aanroepen moeten zien voor elke gebeurtenis
**Vóór live gaan:** Zorg ervoor dat minstens 5 gebeurtenissen worden geactiveerd en dat de payloads geldig zijn. Voltooi één volledige gebruikersreis (knop klikken → maataanbeveling → aan winkelwagen toevoegen) om de integratie te valideren.
## 6. CSS-aanpassing
U kunt het uiterlijk van Kleep-elementen (knoppen, popups, zoekfunctie) aanpassen door aangepaste CSS toe te voegen.
**Waar CSS toevoegen**
In de instellingen van de Kleep App Embed vindt u een veld **"Aangepaste CSS-stijlen invoeren"**. Plak uw aangepaste CSS daar.
Veld voor aangepaste CSS
**Voorbeeldaanpassing**
```css theme={null}
.kleep-button {
all: unset;
font-style: normal;
font-size: 1.3rem;
font-weight: 400;
text-transform: none;
color: rgb(0, 0, 0);
background-color: rgb(255, 255, 255);
padding: 0;
margin: 0;
border: none;
border-radius: 0;
cursor: pointer;
display: inline-block;
position: relative;
}
```
## 7. Meerdere omgevingen
Als u meerdere Shopify-omgevingen heeft (dev, staging, productie), moet u Kleep voor elke omgeving configureren.
**Instelling per omgeving**
1. **Productiewinkel** — Hoofdwinkel, volledig geconfigureerd
2. **Staging-/Dev-winkels** — Voor testen vóór implementatie in productie
Voor elke omgeving:
1. Installeer de Kleep-app
2. Schakel de App Embed in
3. Neem contact op met uw Kleep CSM om de omgeving aan uw account te koppelen
Test altijd wijzigingen in staging voordat u ze toepast in productie.
**Omgevingsspecifieke URL's**
Geef uw Kleep CSM op:
* Productie-URL: `https://www.yourbrand.com`
* Staging-URL: `https://staging.yourbrand.com` (indien van toepassing)
* Dev-URL: `https://dev.yourbrand.com` (indien van toepassing)
## 7.5 CTA-knop en vergelijkbare producten — volledige installatiehandleiding
Voor de volledige technische referentie over het installeren van de Kleep CTA-knop en de functie Vergelijkbare Producten (inclusief alle Liquid-code, instellingsschema en instelling van de secundaire knop), raadpleegt u de speciale handleiding hieronder:
[CTA-knop en vergelijkbare producten — volledige installatiehandleiding](/nl/cms/cta-button)
***
## 8. Klassieke thema's — Installatiehandleiding maatgids
Klassieke thema's (ook wel "legacy" of aangemaakt vóór Online Store 2.0) ondersteunen geen App Blocks. Installatie vereist aanpassingen aan de Liquid-code.
Voor deze sectie is kennis van Shopify-ontwikkeling (Liquid) vereist.
**Vereisten**
* Toegang tot de themacode-editor (**Online Store → Thema's → Code bewerken**)
* Kleep App Embed moet zijn ingeschakeld in uw Shopify-beheerder (**Online Store → Thema's → Aanpassen → App embeds → Kleep**)
**Stap 1: Schakel de App Embed in**
Ga in uw Shopify-beheerder naar **Online Store → Thema's → Aanpassen → App embeds** en schakel de Kleep-app in.
**Stap 2: Roep het fragment aan**
Plak de volgende code op de plek waar u Kleep wilt weergeven. Het moet deel uitmaken van het blok `Product info` in de map `snippets`:
```jsx theme={null}
{% render 'kleep-button', cms: section.settings %}
```
**Stap 3: Maak het knopfragment**
Maak een nieuw bestand genaamd `kleep-button.liquid` in uw map `snippets`. Voeg de volgende inhoud in:
```jsx theme={null}
```
**Stap 4: Instellingsschema toevoegen**
Voeg de volgende opties toe aan uw Instellingsschema aan het einde van het sectiebestand:
```json theme={null}
{
"type": "header",
"content": "Button text",
"info": "If you enable this feature, the button text you enter will be replaced for all languages in your store"
},
{
"type": "checkbox",
"default": false,
"id": "custom_button_text_toggle",
"label": "Enable custom button text"
},
{
"type": "text",
"id": "custom_find_size_text",
"label": "Find my best size text",
"info": "What text will display instead of\"Find my best size\"?"
},
{
"type": "text",
"id": "custom_recommended_size_text",
"label": "Recommended size text",
"info": "What text will display instead of\"Recommended size\"?"
},
{
"type": "header",
"content": "Image"
},
{
"type": "url",
"id": "image_url",
"label": "Url Image"
},
{
"type": "range",
"id": "image_size",
"min": 0,
"max": 80,
"step": 2,
"unit": "px",
"label": "Image size (square)",
"default": 20
},
{
"type": "header",
"content": "CSS Styles"
},
{
"type": "checkbox",
"default": true,
"id": "default_font_family",
"label": "Theme font",
"info": "If checked, the css variable `--font-body-family` is used"
},
{
"type": "font_picker",
"id": "font_family",
"label": "Font Family",
"default": "helvetica_n4"
},
{
"type": "select",
"id": "text_style",
"label": "Text style",
"default": "normal",
"options": [
{ "label": "Normal", "value": "normal" },
{ "label": "Italic", "value": "italic" },
{ "label": "Oblique", "value": "oblique" }
]
},
{
"type": "select",
"id": "text_transform",
"label": "Text transformation",
"default": "none",
"options": [
{ "label": "Normal", "value": "none" },
{ "label": "Capitalize", "value": "capitalize" },
{ "label": "Uppercase", "value": "uppercase" },
{ "label": "Lowercase", "value": "lowercase" }
]
},
{
"type": "select",
"id": "text_weight",
"label": "Text weight",
"default": "400",
"options": [
{ "label": "100", "value": "100" },
{ "label": "200", "value": "200" },
{ "label": "300", "value": "300" },
{ "label": "400", "value": "400" },
{ "label": "500", "value": "500" },
{ "label": "600", "value": "600" },
{ "label": "700", "value": "700" },
{ "label": "800", "value": "800" },
{ "label": "900", "value": "900" }
]
},
{
"type": "range",
"id": "text_size",
"min": 2,
"max": 50,
"step": 2,
"unit": "px",
"label": "Font size",
"default": 16
},
{
"type": "checkbox",
"id": "text_underline",
"label": "Text underline",
"default": false
},
{
"type": "range",
"id": "text_underline_offset",
"min": 1,
"max": 20,
"step": 1,
"unit": "px",
"label": "Underline offset",
"default": 2
},
{
"type": "color",
"id": "text_color",
"label": "Button text color",
"default": "#ffffff"
},
{
"type": "color",
"id": "bg_color",
"label": "Background color",
"default": "#000000"
},
{
"type": "color",
"id": "border_color",
"label": "Border color",
"default": "#000000"
},
{
"type": "range",
"id": "border_width",
"min": 0,
"max": 8,
"step": 1,
"unit": "px",
"label": "Border width",
"default": 0
},
{
"type": "header",
"content": "Spacing"
},
{
"type": "checkbox",
"id": "center",
"label": "Center the button",
"default": false,
"info": "This will override 'Horizontal margin'"
},
{
"type": "range",
"id": "margin_y",
"min": 0,
"max": 80,
"step": 2,
"unit": "px",
"label": "Vertical margin",
"default": 0
},
{
"type": "range",
"id": "margin_x",
"min": 0,
"max": 80,
"step": 2,
"unit": "px",
"label": "Horizontal margin",
"default": 0
},
{
"type": "range",
"id": "padding_t",
"min": 0,
"max": 40,
"step": 2,
"unit": "px",
"label": "Padding top",
"default": 12
},
{
"type": "range",
"id": "padding_r",
"min": 0,
"max": 40,
"step": 2,
"unit": "px",
"label": "Padding right",
"default": 16
},
{
"type": "range",
"id": "padding_b",
"min": 0,
"max": 40,
"step": 2,
"unit": "px",
"label": "Padding bottom",
"default": 12
},
{
"type": "range",
"id": "padding_l",
"min": 0,
"max": 40,
"step": 2,
"unit": "px",
"label": "Padding left",
"default": 16
},
{
"type": "range",
"id": "border_radius",
"min": 0,
"max": 40,
"step": 2,
"unit": "px",
"label": "Border radius",
"default": 0
}
```
**Stap 5: Valideren**
Valideer updates in het gebied Shopify Thema aanpassen. Configureer visuele elementen in de instellingen van het productinformatieblok.
**Optioneel: Secundaire knop**
Als u een secundaire knop wilt toevoegen, maakt u een nieuw bestand genaamd `kleep-secondary-button.liquid` in uw map `snippets`:
```jsx theme={null}
```
Plak de volgende code op de plek waar u Kleep wilt weergeven. Het moet deel uitmaken van het blok `Product info` in de map `snippets`.
```jsx theme={null}
{% render 'kleep-secondary-button', cms: section.settings %}
```
***
## 9. Klassieke thema's — Instelling Vergelijkbare Producten
**Stap 1: Maak het fragment**
Maak een bestand `snippets/kleep-similar-button.liquid` met de volgende code:
```jsx theme={null}
{% assign cms = block.settings %}
{% assign domain = shop.domain %}
{% assign translated_similar = '' %}
{% assign translated_similar_missing = true %}
{%- assign domain_key = domain | prepend: 'www.' | append: '.recommended' -%}
{% assign raw_domain_similar = domain_key | t %}
{% unless raw_domain_similar contains 'Translation missing'
or raw_domain_similar contains domain
%}
{% assign translated_similar = raw_domain_similar %}
{% assign translated_similar_missing = false %}
{% endunless %}
{%- if translated_similar_missing -%}
{% assign raw_global_similar = 'kleep.recommended.text.btn' | t %}
{% unless raw_global_similar contains 'Translation missing' %}
{% assign translated_similar = raw_global_similar %}
{% assign translated_similar_missing = false %}
{% endunless %}
{%- endif %}
```
**Stap 2: Render het fragment**
Voeg deze regel in op de plek waar u de knop wilt weergeven:
```jsx theme={null}
{% render 'kleep-similar-button' %}
```
Typische plaatsing: onder de variantselectoren of in de buurt van het formulier Aan winkelwagen toevoegen.
**Stap 3: Schakel de juiste modus in**
Omdat klassieke thema's geen OS 2.0-blokken kunnen invoegen, moet de widget een van de volgende modi gebruiken:
* `custom_buttons`
* `popup+custom`
* `button+custom`
**Meerdere knoppen toevoegen**
Om meerdere knoppen te maken, plaatst u de fragmentcode op verschillende plaatsen in het productsjabloon:
```jsx theme={null}
{% render 'kleep-similar-button' %}
```
Elke fragmentaanroep maakt een extra knop aan. Elke knop verschijnt automatisch alleen wanneer de geselecteerde variant niet op voorraad is.
***
## 10. Vertalingen (i18n)
Voeg de volgende vertalingen toe aan uw thema-locatiebestanden.
**Engels (`en.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Find my ideal size",
"with_hash": "Ideal size"
}
},
"recommended": {
"text": {
"btn": "View similar",
"hint": "Size unavailable",
"link": "See similar products"
}
},
"search": {
"text": {
"inputPlaceholder": "Search...",
"productsBlockTitle": "Products",
"clearButton": "Clear"
}
},
"searchPage": {
"text": {
"header": "search results",
"query": "Results for",
"submit": "Search",
"input": "Search the store",
"viewProduct": "View product"
}
}
}
}
```
**Frans (`fr.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Trouver ma taille idéale",
"with_hash": "Taille idéale"
}
},
"recommended": {
"text": {
"btn": "Voir similaire",
"hint": "Taille indisponible",
"link": "Voir des produits similaires"
}
},
"search": {
"text": {
"inputPlaceholder": "Recherche...",
"productsBlockTitle": "Produits",
"clearButton": "Effacer"
}
},
"searchPage": {
"text": {
"header": "résultats de la recherche",
"query": "Résultats pour",
"submit": "Recherche",
"input": "Rechercher dans la boutique",
"viewProduct": "Voir le produit"
}
}
}
}
```
**Italiaans (`it.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Trova la mia taglia ideale",
"with_hash": "Taglia ideale"
}
},
"recommended": {
"text": {
"btn": "Visualizza simili",
"hint": "Taglia non disponibile",
"link": "Visualizza prodotti simili"
}
},
"search": {
"text": {
"inputPlaceholder": "Cerca...",
"productsBlockTitle": "Prodotti",
"clearButton": "Cancella"
}
},
"searchPage": {
"text": {
"header": "risultati della ricerca",
"query": "Risultati per",
"submit": "Cerca",
"input": "Cerca nel negozio",
"viewProduct": "Visualizza prodotto"
}
}
}
}
```
**Duits (`de.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Finde meine ideale Größe",
"with_hash": "Ideale Größe"
}
},
"recommended": {
"text": {
"btn": "Ähnliche Ansicht",
"hint": "Größe nicht verfügbar",
"link": "Ähnliche Produkte ansehen"
}
},
"search": {
"text": {
"inputPlaceholder": "Suchen...",
"productsBlockTitle": "Produkte",
"clearButton": "Klar"
}
},
"searchPage": {
"text": {
"header": "Suchergebnisse",
"query": "Ergebnisse für",
"submit": "Suchen",
"input": "Durchsuchen Sie den Shop",
"viewProduct": "Produkt ansehen"
}
}
}
}
```
**Spaans (`es.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Encontrar mi talla ideal",
"with_hash": "Talla ideal"
}
},
"recommended": {
"text": {
"btn": "Ver similares",
"hint": "Talla no disponible",
"link": "Ver productos similares"
}
},
"search": {
"text": {
"inputPlaceholder": "Buscar...",
"productsBlockTitle": "Productos",
"clearButton": "Borrar"
}
},
"searchPage": {
"text": {
"header": "resultados de búsqueda",
"query": "Resultados para",
"submit": "Buscar",
"input": "Buscar en la tienda",
"viewProduct": "Ver producto"
}
}
}
}
```
**Japans (`ja.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "自分に合うサイズを探す",
"with_hash": "好みのサイズ"
}
},
"recommended": {
"text": {
"btn": "類似商品を見る",
"hint": "サイズがありません",
"link": "類似商品を見る"
}
},
"search": {
"text": {
"inputPlaceholder": "検索...",
"productsBlockTitle": "商品",
"clearButton": "クリア"
}
},
"searchPage": {
"text": {
"header": "検索結果",
"query": "検索結果",
"submit": "検索",
"input": "ストアを検索",
"viewProduct": "商品を見る"
}
}
}
}
```
**Koreaans (`ko.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "내 이상적인 사이즈 찾기",
"with_hash": "추천 사이즈"
}
},
"recommended": {
"text": {
"btn": "유사한 상품 보기",
"hint": "사용 불가",
"link": "유사한 상품 보기"
}
},
"search": {
"text": {
"inputPlaceholder": "검색...",
"productsBlockTitle": "상품",
"clearButton": "지우기"
}
},
"searchPage": {
"text": {
"header": "검색 결과",
"query": "다음에 대한 결과",
"submit": "검색",
"input": "매장 검색",
"viewProduct": "상품 보기"
}
}
}
}
```
**Portugees (`pt.json`)**
```json theme={null}
{
"kleep": {
"button": {
"text": {
"without_hash": "Encontrar meu tamanho ideal",
"with_hash": "Tamanho recomendado"
}
},
"recommended": {
"text": {
"btn": "Ver similar",
"hint": "Tamanho indisponível",
"link": "Ver produtos similares"
}
},
"search": {
"text": {
"inputPlaceholder": "Pesquisar...",
"productsBlockTitle": "Produtos",
"clearButton": "Limpar"
}
},
"searchPage": {
"text": {
"header": "resultados da pesquisa",
"query": "Resultados para",
"submit": "Pesquisar",
"input": "Pesquisar na loja",
"viewProduct": "Ver produto"
}
}
}
}
```
***
## 11. Technische referentie
**CTA-locatie op de PDP**
De locatie wordt gedefinieerd door DOM-selectors binnen `KleepSDK.getConstants()`:
* **`targetProductInfoBlockQueries`** – Array van selectors die verwijzen naar de hoofdcontainer van productdetails (titel, prijs, maten, enz.). Het script doorloopt deze selectors en gebruikt de eerste die het vindt als invoegpunt voor de CTA of popups.
* **`targetVariantQueries`** – Waar de maat-/variantopties zich bevinden. Zodra het productinformatieblok is gevonden, zoekt het script erin naar variantelementen (zoals maatselectoren). Elke variant `
Modusselectie Vergelijkbare Producten
**Aangepaste knoppen toevoegen (voor aangepaste modi)**
Als u een modus met "custom" hebt gekozen, kunt u knoppen op specifieke locaties toevoegen:
1. Ga naar het sjabloon **Productpagina** in de thema-editor
2. Klik in de gewenste sectie op **Blok toevoegen**
3. Klik op het tabblad **Apps** en selecteer **"Kleep Similar Button"**
4. Positioneer het blok waar u het wilt en sla op
Kleep Similar Button-blok toevoegen
Aangepaste zoekfunctie inschakelen
**Stap 2: Toegang tot het zoeksjabloon**
Klik in de thema-editor op het vervolgkeuzemenu bovenaan (standaard "Startpagina") en selecteer **"Zoeken"** uit de sjabloonlijst.
Zoeksjabloon selecteren
**Stap 3: Verberg de standaard zoekfunctie**
Verberg of verwijder in de sectie Sjabloon het native blok **"Zoekresultaten"** door op het oogpictogram te klikken.
Standaard zoekfunctie verbergen
**Stap 4: Voeg het Kleep-zoekblok toe**
Klik op **Sectie toevoegen** en selecteer daarna op het tabblad **Apps** de optie **"Search"** (kleep-dev).
Kleep-zoekblok toevoegen
**Stap 5: Opties configureren**
Klik op het zoekblok dat u hebt toegevoegd om toegang te krijgen tot de instellingen: aantal resultaten, raster-/lijstweergave, zoekvertraging, enz.
Opties voor zoekconfiguratie
## 4. Retourintegratie (Optioneel)
Als u een platform voor retourbeheer gebruikt, kan Kleep retourgegevens integreren om maataanbevelingen te verbeteren.
**Ondersteunde retouraanbieders**
* Global-e
* Aftership
* Fast Return
* Return Go
* Andere (neem contact met ons op)
**Configuratie**
1. Ga in het Kleep Dashboard naar **Instellingen → Retouren**
2. Selecteer uw retouraanbieder
3. Volg de aanbiedersspecifieke instructies om uw account te verbinden
Veld voor aangepaste CSS
**Voorbeeldaanpassing**