Instalace AI chatu pro Shopify
Nejdříve je nutné mít připravený a nakonfigurovaný web chat widget. Postupujte podle návodu na stránce Základní
nastavení Web chatu
Jakmile máte widget vytvořen a nastaven a zkopírován kód pro vložení do stránky je třeba jej vložit do vaší Shopify
šablony.
V Shopify administraci otevřete stránku Online Obchod > Motivy > Přizpůsobit (Online Store > Theme > Customize) a horním
menu klikněte na tři tečky a vyberte položku Upravit kód.
Vyberte k editaci soubor theme.liquid a kód widgetu vložte před značku <body> .
Pokud máte v shopify více jazykových mutací, je třeba mít naklikaný v administraci pro operátora schránku (widget) pro
každý jazyk a v šabloně potom vložit upravený kód, který pro každý jazyk vloží správný widget. Toho docílíte pomocí
úpravy části kódu viz níže (token odpovídá tokenu z widget/schránky danné jazykové mutace, použité zkratky jazyků
odpovídají ISO-639):
...
window.chatwootSDK.run({
{% if localization.language.iso_code == "sk" %}
websiteToken: 'token1',
{% elsif localization.language.iso_code == "de" %}
websiteToken: 'token2',
{% else %}
websiteToken: 'token3',
{% endif %}
baseUrl: BASE_URL
})
...
Následně pod kód widgetu přidejte ještě kód, který zajistí, že widget bude mít informace o přihlášeném uživateli a
vybraném státu/měně vašeho eshopu.
Nejdříve je třeba získat token pro ověření poslaných údajů z administrace kontaktního centra. Najdete jej v záložce
Připojení v nastavení vašeho widgetu jako User Identity validatidation:
Tento zkopírovaný token vložte místo textu SECRET KEY ve tomto skriptu. Skript následně přidejte do šablony pod
inicializační skript widgetu.
<script>
window.addEventListener('chatwoot:ready', function () {
window.$chatwoot.setCustomAttributes({ "language": Shopify.country });
{% if customer %}
{%- assign secret_potion = customer.id | hmac_sha256: 'SECRET KEY' -%}
window.$chatwoot.setUser("{{ customer.id }}", {
identifier_hash: "{{ secret_potion }}",
email: "{{ customer.email }}",
name: "{{ customer.name }}",
phone_number: "{{ customer.phone }}",
});
{% endif %}
});
</script>
