> ## 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.
# Przewodnik integracji Shopify
**Ten przewodnik przeprowadzi Cię przez instalację Kleep w sklepie Shopify. Kleep oferuje trzy główne funkcje: inteligentny przewodnik rozmiarów (Kleep Sizing), rekomendacje podobnych produktów (Kleep Similar Products) oraz zoptymalizowane wyszukiwanie produktów (Kleep Search).**
## Przegląd procesu integracji
Oto czego możesz się spodziewać od podpisania umowy do uruchomienia i dalej. Pełna integracja zajmuje zazwyczaj około **5–6 tygodni**.
### Onboarding
Po podpisaniu umowy Twój przedstawiciel Kleep uruchamia płatności za pośrednictwem GoCardless: [Skonfiguruj polecenie zapłaty →](https://pay.gocardless.com/BRT000352V7T67Q).
Krótka rozmowa z przedstawicielem Kleep w celu uzgodnienia harmonogramu, kontaktów technicznych i wszelkich wymagań specyficznych dla sklepu przed rozpoczęciem instalacji.
Po spotkaniu inaugurującym poprosimy Cię o udostępnienie kilku szczegółów dotyczących Twojej firmy, rozliczeń, środowisk sklepu i konfiguracji zwrotów, abyśmy mogli przygotować integrację.
**[Wypełnij nasz formularz onboardingowy →](https://ihu3s9tz3r8.typeform.com/to/fYQw9zJ5)**
Zajmuje to około 5 minut. Po przesłaniu nasz zespół przejrzy Twoje odpowiedzi i potwierdzi kolejne kroki w ciągu 1 dnia roboczego.
Wyślij nam adres swojego sklepu (np. `your-store.myshopify.com`) wraz z kodem żądania współpracownika, abyśmy mogli poprosić o dostęp do Twojego sklepu.
**Wiele sklepów Shopify?** Jeśli masz kilka instancji Shopify (np. różne regiony lub marki), wyślij nam kod współpracownika dla **każdego sklepu** — potrzebujemy po jednym kodzie na sklep.
Nie wiesz, gdzie je znaleźć? W panelu administracyjnym Shopify przejdź do **Ustawienia → Użytkownicy i uprawnienia** — Twój adres URL `myshopify.com` jest wyświetlany na górze, a **Kod żądania współpracownika** jest wymieniony w sekcji *Współpracownicy*. Więcej informacji znajdziesz w artykule pomocy Shopify na temat [kont współpracowników](https://help.shopify.com/en/manual/your-account/staff-accounts/collaborator-accounts).
Wyślemy żądanie dostępu współpracownika z naszego konta Shopify Partner. Zatwierdź je w **Ustawienia → Użytkownicy i uprawnienia → Współpracownicy** w panelu administracyjnym Shopify.
Gdy uzyskamy dostęp współpracownika, wyślemy Ci link do instalacji aplikacji **dla każdego sklepu**. Musisz zainstalować aplikację Kleep osobno w każdym sklepie Shopify, w którym chcesz ją włączyć.
Zapoznaj się z naszymi sugerowanymi pozycjami dla przycisku „Znajdź mój rozmiar" i wybierz tę, która pasuje do Twojego sklepu: [Pozycjonowanie CTA w Figmie →](https://www.figma.com/design/DvsqgNPSjVPVPLjKV2efAY/KLEEP-CTA-POSITIONING-SUGGESTIONS?node-id=0-1\&p=f\&t=92MwlxQkzlfAYyk5-0).
### Instalacja i testowanie
Nasz zespół duplikuje Twój aktualny motyw Shopify i instaluje Kleep na duplikacie, dzięki czemu Twój działający sklep pozostaje nienaruszony podczas testów.
Wysyłamy Ci prywatny link do podglądu, aby przetestować integrację od początku do końca i przekazać wszelkie opinie lub potrzebne poprawki.
Po Twoim zatwierdzeniu publikujemy Kleep na Twoim aktywnym motywie.
### Po integracji
Konfigurujemy dane uwierzytelniające dla Twojego zespołu, aby uzyskał dostęp do [Panelu Kleep](https://dashboard.kleep.ai), gdzie możesz monitorować KPI wydajności Kleep w czasie rzeczywistym.
Włączamy [Fit Feedback](/pl/dashboard/fit-feedback) w Twoim panelu, aby Twój zespół mógł udoskonalać rekomendacje rozmiarów Kleep na podstawie rzeczywistych danych dotyczących dopasowania.
## 1. Funkcjonalności
Kleep jest integrowany z Twoim sklepem poprzez instalację niestandardowej aplikacji, która została wcześniej utworzona. Umożliwia ona:
1. Dodanie naszego CTA „Znajdź mój rozmiar" na stronach produktów
2. Dostosowanie interfejsu bezpośrednio w Edytorze motywu
Nasza aplikacja tworzy również zautomatyzowane przepływy danych Produktów, Zamówień i Zwrotów, aby pozostawać na bieżąco. Dane te są pobierane codziennie.
Po instalacji aplikacja tworzy WebPixel, który służy do śledzenia wielu wskaźników, z których obliczamy ROI rozwiązania.
## 2. Funkcja Podobnych produktów
Podobne produkty sugerują alternatywne produkty, gdy rozmiar jest niedostępny. Funkcja ta zwiększa konwersje, oferując klientom odpowiednie alternatywy.
**Dostępne tryby wyświetlania**
| Tryb | Opis |
| ---------------------------------- | -------------------------------------------------------------------------------------- |
| **Popup (auto)** | Automatyczny popup po najechaniu na rozmiar (komputer) / przycisk (urządzenie mobilne) |
| **Przycisk (auto)** | Automatyczny przycisk CTA przy koszyku, gdy produkt jest niedostępny |
| **Tylko przyciski niestandardowe** | Ręcznie umieszczasz przyciski za pomocą edytora motywu |
| **Popup + niestandardowy** | Automatyczny popup + dodatkowe przyciski niestandardowe |
| **Przycisk + niestandardowy** | Automatyczny przycisk + dodatkowe przyciski niestandardowe |
**Konfiguracja**
**Krok 1: Wybierz tryb wyświetlania**
W ustawieniach osadzenia aplikacji Kleep znajdź opcję **„Pokaż rekomendowane produkty"** i wybierz żądany tryb z menu rozwijanego.
Wybór trybu podobnych produktów
**Dodawanie przycisków niestandardowych (dla trybów niestandardowych)**
Jeśli wybrałeś tryb z „niestandardowym", możesz dodawać przyciski w określonych miejscach:
1. Przejdź do szablonu **strony Produktu** w edytorze motywu
2. W żądanej sekcji kliknij **Dodaj blok**
3. Kliknij kartę **Aplikacje** i wybierz **„Kleep Similar Button"**
4. Umieść blok w żądanym miejscu i zapisz
Dodaj blok Kleep Similar Button
Przyciski podobnych produktów pojawiają się tylko wtedy, gdy wariant jest niedostępny. To normalne, że nie widzisz ich na wszystkich produktach.
**Dodawanie wielu przycisków**
Możesz dodać dowolną liczbę przycisków podobnych produktów na stronie produktu. Aby umożliwić wiele przycisków, widżet musi być ustawiony na jeden z: `custom_buttons`, `popup+custom` lub `button+custom`.
Dla motywów OS 2.0:
* Przejdź do **Sklep online → Dostosuj**
* Otwórz szablon **strony Produktu**
* Kliknij **Dodaj blok → Kleep Similar Button**
* Powtórz, jeśli chcesz 2+ przycisków na stronie
Każdy przycisk pojawia się automatycznie tylko wtedy, gdy wybrany wariant jest niedostępny.
***
## 3. Funkcja Kleep Search
Kleep Search zastępuje natywne wyszukiwanie Shopify zoptymalizowanym wyszukiwaniem z filtrami rozmiarów i spersonalizowanymi rekomendacjami.
**Krok 1: Włącz wyszukiwanie niestandardowe**
W ustawieniach osadzenia aplikacji Kleep włącz opcję **„Włącz wyszukiwanie niestandardowe"**.
Włącz wyszukiwanie niestandardowe
**Krok 2: Dostęp do szablonu wyszukiwania**
W edytorze motywu kliknij menu rozwijane na górze (domyślnie „Strona główna") i wybierz **„Wyszukiwanie"** z listy szablonów.
Wybierz szablon wyszukiwania
**Krok 3: Ukryj natywne wyszukiwanie**
W sekcji Szablon ukryj lub usuń natywny blok **„Wyniki wyszukiwania"**, klikając ikonę oka.
Ukryj natywne wyszukiwanie
**Krok 4: Dodaj blok Kleep Search**
Kliknij **Dodaj sekcję**, a następnie na karcie **Aplikacje** wybierz **„Search"** (kleep-dev).
Dodaj blok Kleep Search
**Krok 5: Skonfiguruj opcje**
Kliknij dodany blok wyszukiwania, aby uzyskać dostęp do ustawień: liczba wyników, wyświetlanie siatka/lista, opóźnienie wyszukiwania itp.
Opcje konfiguracji wyszukiwania
## 4. Integracja zwrotów (opcjonalna)
Jeśli korzystasz z platformy do zarządzania zwrotami, Kleep może integrować dane o zwrotach w celu poprawy rekomendacji rozmiarów.
**Obsługiwani dostawcy zwrotów**
* Global-e
* Aftership
* Fast Return
* Return Go
* Inni (skontaktuj się z nami)
**Konfiguracja**
1. W Panelu Kleep przejdź do **Ustawienia → Zwroty**
2. Wybierz swojego dostawcę zwrotów
3. Postępuj zgodnie z instrukcjami specyficznymi dla dostawcy, aby połączyć swoje konto
Jeśli Twój dostawca nie jest na liście, skontaktuj się z nami pod adresem [support@kleep.ai](mailto:support@kleep.ai) — możemy skonfigurować niestandardową integrację przez SFTP lub API.
## 5. Śledzenie zdarzeń i analityka
Kleep automatycznie śledzi interakcje użytkowników na potrzeby analityki. Upewnij się, że śledzenie działa poprawnie przed uruchomieniem.
**Śledzone zdarzenia**
| Zdarzenie | Opis |
| ------------------------ | ------------------------------------------------- |
| `kleep_button_click` | Użytkownik kliknął przycisk przewodnika rozmiarów |
| `kleep_drawer_open` | Otwarto szufladę przewodnika rozmiarów |
| `kleep_size_recommended` | Wyświetlono rekomendację rozmiaru |
| `kleep_add_to_cart` | Użytkownik dodał produkt do koszyka z Kleep |
| `kleep_similar_click` | Użytkownik kliknął podobny produkt |
**Weryfikacja**
Aby sprawdzić, czy zdarzenia są prawidłowo wyzwalane:
1. Otwórz Narzędzia deweloperskie przeglądarki (F12)
2. Przejdź do karty **Sieć**
3. Filtruj według „kleep"
4. Wejdź w interakcję z przyciskiem przewodnika rozmiarów
5. Powinieneś zobaczyć wywołania API dla każdego zdarzenia
**Przed uruchomieniem:** Upewnij się, że wyzwalanych jest co najmniej 5 zdarzeń i że ładunki są prawidłowe. Zrealizuj jedną pełną ścieżkę użytkownika (kliknięcie przycisku → rekomendacja rozmiaru → dodanie do koszyka), aby zweryfikować integrację.
## 6. Dostosowywanie CSS
Możesz dostosować wygląd elementów Kleep (przyciski, popupy, wyszukiwanie), dodając niestandardowy CSS.
**Gdzie dodać CSS**
W ustawieniach osadzenia aplikacji Kleep znajdziesz pole **„Wprowadź niestandardowe style CSS"**. Wklej tam swój niestandardowy CSS.
Pole niestandardowego CSS
**Przykład dostosowania**
```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. Wiele środowisk
Jeśli masz wiele środowisk Shopify (dev, staging, produkcja), musisz skonfigurować Kleep dla każdego z nich.
**Konfiguracja dla każdego środowiska**
1. **Sklep produkcyjny** — Główny sklep, w pełni skonfigurowany
2. **Sklepy staging/dev** — Do testowania przed wdrożeniem na produkcję
Dla każdego środowiska:
1. Zainstaluj aplikację Kleep
2. Włącz osadzenie aplikacji (App Embed)
3. Skontaktuj się ze swoim CSM Kleep, aby połączyć środowisko z Twoim kontem
Zawsze testuj zmiany na staging przed zastosowaniem na produkcji.
**Adresy URL specyficzne dla środowisk**
Podaj swojemu CSM Kleep:
* Produkcyjny URL: `https://www.yourbrand.com`
* Staging URL: `https://staging.yourbrand.com` (jeśli dotyczy)
* Dev URL: `https://dev.yourbrand.com` (jeśli dotyczy)
## 7.5 Przycisk CTA i podobne produkty — pełny przewodnik instalacji
Pełne techniczne informacje na temat instalacji przycisku CTA Kleep i funkcji podobnych produktów (w tym cały kod Liquid, schemat ustawień i konfiguracja przycisku dodatkowego) znajdziesz w dedykowanym przewodniku poniżej:
[Przycisk CTA i podobne produkty — pełny przewodnik instalacji](/pl/cms/cta-button)
***
## 8. Vintage Themes — konfiguracja przewodnika rozmiarów
Starsze motywy (zwane „legacy" lub stworzone przed Online Store 2.0) nie obsługują bloków aplikacji. Instalacja wymaga modyfikacji kodu Liquid.
Ta sekcja wymaga znajomości programowania Shopify (Liquid).
**Wymagania wstępne**
* Dostęp do edytora kodu motywu (**Sklep online → Motywy → Edytuj kod**)
* Osadzenie aplikacji Kleep musi być włączone w panelu administracyjnym Shopify (**Sklep online → Motywy → Dostosuj → Osadzenia aplikacji → Kleep**)
**Krok 1: Włącz osadzenie aplikacji**
W panelu administracyjnym Shopify przejdź do **Sklep online → Motywy → Dostosuj → Osadzenia aplikacji** i włącz aplikację Kleep.
**Krok 2: Wywołaj snippet**
Wklej następujący kod w miejscu, gdzie Kleep ma się pojawić. Musi to być część bloku `Product info` w folderze `snippets`:
```jsx theme={null}
{% render 'kleep-button', cms: section.settings %}
```
**Krok 3: Utwórz snippet przycisku**
Utwórz nowy plik o nazwie `kleep-button.liquid` w folderze `snippets`. Wstaw następującą zawartość:
```jsx theme={null}
```
**Krok 4: Dodaj schemat ustawień**
Dodaj następujące opcje do schematu ustawień na końcu pliku sekcji:
```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
}
```
**Krok 5: Zweryfikuj**
Sprawdź aktualizacje w obszarze Dostosowywanie motywu Shopify. Skonfiguruj elementy wizualne w ustawieniach bloku informacji o produkcie.
**Opcjonalnie: Przycisk dodatkowy**
Jeśli chcesz dodać przycisk dodatkowy, utwórz nowy plik o nazwie `kleep-secondary-button.liquid` w folderze `snippets`:
```jsx theme={null}
```
Wklej następujący kod w miejscu, gdzie Kleep ma się pojawić. Musi to być część bloku `Product info` w folderze `snippets`.
```jsx theme={null}
{% render 'kleep-secondary-button', cms: section.settings %}
```
***
## 9. Vintage Themes — konfiguracja podobnych produktów
**Krok 1: Utwórz snippet**
Utwórz plik `snippets/kleep-similar-button.liquid` z następującym kodem:
```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 %}
```
**Krok 2: Wyrenderuj snippet**
Wstaw tę linię w miejscu, gdzie przycisk ma się pojawić:
```jsx theme={null}
{% render 'kleep-similar-button' %}
```
Typowe umiejscowienie: pod selektorami wariantów lub w pobliżu formularza Dodaj do koszyka.
**Krok 3: Włącz właściwy tryb**
Ponieważ starsze motywy nie mogą wstawiać bloków OS 2.0, widżet musi używać jednego z:
* `custom_buttons`
* `popup+custom`
* `button+custom`
**Dodawanie wielu przycisków**
Aby utworzyć wiele przycisków, wystarczy umieścić kod snippetu w różnych obszarach szablonu produktu:
```jsx theme={null}
{% render 'kleep-similar-button' %}
```
Każde wywołanie snippetu tworzy dodatkowy przycisk. Każdy przycisk pojawia się automatycznie tylko wtedy, gdy wybrany wariant jest niedostępny.
***
## 10. Tłumaczenia (i18n)
Dodaj następujące tłumaczenia do plików lokalizacyjnych motywu.
**Angielski (`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"
}
}
}
}
```
**Francuski (`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"
}
}
}
}
```
**Włoski (`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"
}
}
}
}
```
**Niemiecki (`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"
}
}
}
}
```
**Hiszpański (`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"
}
}
}
}
```
**Japoński (`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": "商品を見る"
}
}
}
}
```
**Koreański (`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": "상품 보기"
}
}
}
}
```
**Portugalski (`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. Dokumentacja techniczna
**Lokalizacja CTA na PDP**
Lokalizacja jest określona przez selektory DOM wewnątrz `KleepSDK.getConstants()`:
* **`targetProductInfoBlockQueries`** — Tablica selektorów wskazujących na główny kontener szczegółów produktu (tytuł, cena, rozmiary itp.). Skrypt iteruje przez te selektory i używa pierwszego znalezionego jako punktu wstawienia CTA lub popupów.
* **`targetVariantQueries`** — Gdzie znajdują się opcje rozmiarów/wariantów. Po znalezieniu bloku informacji o produkcie skrypt szuka wewnątrz niego elementów wariantów (np. selektorów rozmiarów). Każdy `
Wybór trybu podobnych produktów
**Dodawanie przycisków niestandardowych (dla trybów niestandardowych)**
Jeśli wybrałeś tryb z „niestandardowym", możesz dodawać przyciski w określonych miejscach:
1. Przejdź do szablonu **strony Produktu** w edytorze motywu
2. W żądanej sekcji kliknij **Dodaj blok**
3. Kliknij kartę **Aplikacje** i wybierz **„Kleep Similar Button"**
4. Umieść blok w żądanym miejscu i zapisz
Dodaj blok Kleep Similar Button
Włącz wyszukiwanie niestandardowe
**Krok 2: Dostęp do szablonu wyszukiwania**
W edytorze motywu kliknij menu rozwijane na górze (domyślnie „Strona główna") i wybierz **„Wyszukiwanie"** z listy szablonów.
Wybierz szablon wyszukiwania
**Krok 3: Ukryj natywne wyszukiwanie**
W sekcji Szablon ukryj lub usuń natywny blok **„Wyniki wyszukiwania"**, klikając ikonę oka.
Ukryj natywne wyszukiwanie
**Krok 4: Dodaj blok Kleep Search**
Kliknij **Dodaj sekcję**, a następnie na karcie **Aplikacje** wybierz **„Search"** (kleep-dev).
Dodaj blok Kleep Search
**Krok 5: Skonfiguruj opcje**
Kliknij dodany blok wyszukiwania, aby uzyskać dostęp do ustawień: liczba wyników, wyświetlanie siatka/lista, opóźnienie wyszukiwania itp.
Opcje konfiguracji wyszukiwania
## 4. Integracja zwrotów (opcjonalna)
Jeśli korzystasz z platformy do zarządzania zwrotami, Kleep może integrować dane o zwrotach w celu poprawy rekomendacji rozmiarów.
**Obsługiwani dostawcy zwrotów**
* Global-e
* Aftership
* Fast Return
* Return Go
* Inni (skontaktuj się z nami)
**Konfiguracja**
1. W Panelu Kleep przejdź do **Ustawienia → Zwroty**
2. Wybierz swojego dostawcę zwrotów
3. Postępuj zgodnie z instrukcjami specyficznymi dla dostawcy, aby połączyć swoje konto
Pole niestandardowego CSS
**Przykład dostosowania**