Přeskočit na hlavní obsah

Pokročilé: umístění chat boxu pomocí JavaScript API

Nastavte přesně pozici chat boxu v kódu — zvlášť pro desktop i mobil.

Autor: Michal Jindra

Vývojáři mohou přesně určit, kde se chat box zobrazí, a to přidáním několika konfiguračních možností přímo do instalačního kódu Smartsupp. V tomto návodu najdete, jak chat box přesunout doleva, posunout z výchozí pozice, nebo nastavit jinou pozici pro mobilní zařízení.

Pokročilé: umístění v instalačním kódu

🟡 Poznámka: Pro nastavení budete potřebovat vývojářský přístup ke kódu webu. Přesunutí chat boxu na levou stranu je k dispozici v tarifu Solo a vyšších.

Konfigurační možnosti přidejte do instalačního kódu: stačí je vložit za řádek s _smartsupp.key a před samotný načítací skript (začínající window.smartsupp||). Chat box si tyto volby načte při spuštění, proto musejí být zadány před spuštěním načítacího skriptu.

Přesunutí chat boxu na levou stranu:

<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';_smartsupp.orientation = "left";// ...zbytek vašeho instalačního kódu (načítací skript)</script>

Posunutí chat boxu z výchozí pozice (hodnoty v pixelech):

_smartsupp.offsetX = 20;  // posune dál od okraje obrazovky_smartsupp.offsetY = 100; // posune výš od spodního okraje

Nastavení odlišné pozice jen na mobilu:

<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';if (window.innerWidth < 768) {  _smartsupp.offsetY = 150;}// ...zbytek vašeho instalačního kódu (načítací skript)</script>

Postup nastavení:

  1. Otevřete kód svého webu a vyhledejte instalační skript Smartsupp.

  2. Možnosti přidejte hned za řádek s _smartsupp.key a před načítací skript.

  3. Upravte hodnoty podle vlastního designu.

  4. Uložte změny a zkontrolujte nové umístění chat boxu v anonymním nebo soukromém okně prohlížeče. Nezapomeňte vyzkoušet i zobrazení na mobilním zařízení.

💡 Tip: Příkazy jako smartsupp('chat:position', ...) nejsou podporovány. Chat box je ignoruje a v konzoli prohlížeče se zobrazí hláška "Unknown API command". Kompletní přehled všech konfiguračních možností naleznete v dokumentaci pro vývojáře.


Co dál?

💡 Potřebujete další pomoc? Kontaktujte náš tým podpory — rádi vám poradíme!

Dostali jste odpověď na svou otázku?