# Zaawansowane opcje osadzania

> Widżet osadzony akceptuje więcej konfiguracji, niż pokazuje fragment do skopiowania i wklejenia, w tym przekazywanie opcji klienta do otwieranej przez niego finalizacji zakupu.

Kody osadzania wygenerowane na Twoim koncie Entase umieszczają na stronie gotowy widżet wydarzenia. Są przeznaczone do kopiowania i wklejania bez konieczności prac programistycznych – zobacz [Osadzanie wydarzeń na swojej stronie internetowej](/organizers/sharing-and-embedding/embedding-events-on-your-website.md), aby dowiedzieć się, jak go uzyskać.

Na tej stronie opisano opcje, które możesz dodać do tego fragmentu, oraz sposób konfiguracji otwieranej przez niego finalizacji zakupu.

Widżet sam ładuje klienta JavaScript, więc nie dodajesz obok niego pliku `client.js`. Nie potrzebuje też klucza publicznego: widżet jest udostępniany przez Entase, dlatego finalizacja zakupu jest autoryzowana za pośrednictwem widżetu, a nie klucza na Twojej stronie.

## Konfiguracja

Każdy widżet jest konfigurowany za pomocą obiektu opcji:

```html
<div id="entase_OBJ_CODE"></div>
<script>
  window.entase = window.entase || { o: [] };
  window.entase.o.push({
    obj: 'OBJ_CODE',
    theme: 'dark',
    ext: true
  });
</script>
<script src="https://js.entase.com/embed.js" async></script>
```

`obj` łączy konfigurację z jej kontenerem: widżet renderuje się w elemencie, którego identyfikator to `entase_`, po którym występuje ten sam kod. Jeśli tego elementu brakuje, widżet zapisuje ostrzeżenie w dzienniku i niczego nie renderuje.

Aby umieścić kilka widżetów na jednej stronie, dodaj po jednym wpisie dla każdego z nich.

| Nazwa | Typ | Domyślnie | Opis |
|---|---|---|---|
| `obj` | string | – | Kod obiektu z fragmentu osadzania. Wymagane. |
| `width` | string | `'auto'` | Szerokość kontenera jako wartość CSS. `'auto'` oznacza pełną szerokość. |
| `height` | string | `'auto'` | Wysokość kontenera jako wartość CSS. `'auto'` zaczyna od 200px, a widżet dostosowuje swój rozmiar do zawartości. |
| `theme` | string | `'light'` | `'light'` lub `'dark'`. |
| `locale` | string | `'auto'` | Język widżetu. `'auto'` odczytuje atrybut `lang` elementu `<html>`. |
| `ext` | boolean | `false` | Rozszerzony układ – dodaje nazwę wydarzenia i plakat nad datami. |
| `attribution` | boolean | `true` | Wyświetla informację o Entase. Ustaw `false`, aby ją ukryć. |
| `client` | object | `{}` | Opcje przekazywane do klienta JavaScript otwierającego finalizację zakupu. |

Niezależnie od wartości `width` kontener otrzymuje minimalną szerokość 200px, poniżej której widżet nie może poprawnie się ułożyć.

## Konfigurowanie finalizacji zakupu

`client` akceptuje te same opcje co konstruktor klienta, dzięki czemu finalizacja zakupu otwierana z widżetu może być stylizowana i mieć taki sam rozmiar jak ta otwierana samodzielnie:

```js
window.entase.o.push({
  obj: 'OBJ_CODE',
  client: {
    checkoutMode: 'pane',
    pane: { width: '60vw' },
    backdrop: true,
    backdropColor: '#101014'
  }
});
```

Pełną listę znajdziesz w artykule [Opcje konstruktora](/developers/js-client/constructor-options.md).

Dwa zastrzeżenia. `tprm` jest ustawiane przez sam widżet na podstawie adresu URL strony (zobacz poniżej), więc wartość przekazana tutaj zostanie zastąpiona. Ponadto, gdy kilka widżetów znajduje się na jednej stronie, współdzielą one jedną instancję klienta – obowiązują opcje `client` ostatniego zainicjowanego widżetu, dlatego zachowaj identyczne opcje dla wszystkich widżetów na tej samej stronie.

## Automatyczne przekazywanie parametrów kampanii

W przeciwieństwie do samodzielnego klienta widżet odczytuje ciąg zapytania Twojej strony i przekazuje znane parametry kampanii zarówno do widżetu, jak i do finalizacji zakupu:

`sgm`, `utm_source`, `utm_medium`, `utm_campaign`, `utm_term`, `utm_content`, `utm_id`, `utm_source_platform`, `utm_creative_format`, `fbclid`

W przypadku osoby odwiedzającej `yoursite.com/concert?utm_source=facebook&sgm=SOCIAL` ta atrybucja zostanie zapisana przy każdym wynikającym z tego zamówieniu bez dodatkowej konfiguracji. Parametry spoza tej listy są ignorowane – aby przekazywać własne parametry, otwórz finalizację zakupu bezpośrednio za pomocą klienta i samodzielnie ustaw `tprm`. Zobacz [Śledzenie i zgoda](/developers/js-client/tracking-and-consent.md).
