# Instalacja widżetu czatu na stronie

> Dodaj widżet czatu do strony w kilka minut: adres, wygląd, krótki kod albo instrukcje dla WordPress, Shopify, Wix i Google Tag Manager.

Widżet czatu to okno czatu na twojej stronie, przez które klienci do ciebie piszą. Utworzysz go w „Ustawieniach”, w sekcji „Widżety czatu”, przyciskiem „Nowy widżet czatu”.

## Wpisz adres strony

Wpisz adres, na przykład `shop.example.com`. Obejrzymy stronę i zaproponujemy kolory, logo i języki. Adres staje się też pierwszym dozwolonym adresem: widżet działa tylko pod dozwolonymi adresami.

![Kreator nowego widżetu czatu ze znalezioną stroną](https://hrc.lt/screens/pl/widget-setup-site.desktop.1600.d2ce774f.webp)

## Sprawdź wygląd i języki

Podgląd pokazuje, jak będzie wyglądał widżet. Kolory, teksty i języki zmienisz teraz albo później w [Ustawieniach widżetu](https://hrc.lt/pl/docs/widget/settings).

## Wstaw kod

Najprościej jeden znacznik `<script>` tuż przed znacznikiem `</body>`:

```html
<script
  src="https://widget.hrc.lt/v1/loader.js"
  data-widget-key="wk_xxxxxxxxxxxxxxxxxxxx"
  async
></script>
```

Jeśli chcesz przekazywać dane o użytkowniku albo wywoływać widżet z własnego kodu, użyj pełnego kodu z kolejką poleceń:

```html
<script>
  (function (w, d) {
    w.HrcWidget = w.HrcWidget || function () {
      (w.HrcWidget.q = w.HrcWidget.q || []).push(arguments);
    };
    var s = d.createElement('script');
    s.async = true;
    s.src = 'https://widget.hrc.lt/v1/loader.js';
    d.head.appendChild(s);
  })(window, document);
  HrcWidget('init', {
    widgetKey: 'wk_xxxxxxxxxxxxxxxxxxxx',
    locale: 'auto',
  });
</script>
```

Kreator pokazuje kod już z kluczem twojego widżetu.

![Krok instalacji z kodem i sprawdzeniem](https://hrc.lt/screens/pl/widget-setup-install.desktop.1600.e2878839.webp)

## WordPress, Shopify, Wix i Google Tag Manager

- **WordPress:** zainstaluj darmową wtyczkę WPCode, otwórz Code Snippets, Header & Footer i wklej kod w pole Footer.
- **Shopify:** Online Store, Themes, „…” przy motywie, Edit code, plik `theme.liquid`: wklej kod tuż przed `</body>`.
- **Wix:** Settings, Custom Code, Add Custom Code, miejsce Body - end, wszystkie strony. Wymaga płatnego planu Wix i podłączonej domeny.
- **Google Tag Manager:** Tags, New, Custom HTML, wklej kod, Triggering All Pages, potem Submit.

## Sprawdź, czy działa

Kreator co kilka sekund sprawdza, czy widżet załadował się na twojej stronie. Otwórz stronę i wyślij wiadomość testową: pojawi się w skrzynce odbiorczej.

![Widżet czatu na stronie](https://hrc.lt/screens/pl/widget-home.desktop.2400.18693a4a.webp)

## Dozwolone adresy i localhost

Widżet działa tylko pod dozwolonymi adresami. Dodaj każdy jako `https://shop.example.com`; `https://*.example.com` obejmuje wszystkie subdomeny twojej domeny. Do pracy nad stroną włącz „Zezwól na localhost”. Więcej: [Kod do osadzenia, React i CSP](https://hrc.lt/pl/docs/widget/install).