Jak přidat Asyntai AI chatbota do Statamic

Průvodce krok za krokem pro weby Statamic CMS

Platforma:

Krok 1: Získejte svůj vkládací kód

Nejprve přejděte na svůj Asyntai Dashboard a přejděte dolů k sekci „Embed Code". Zkopírujte svůj unikátní kód pro vložení, který bude vypadat takto:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Poznámka: Kód výše je pouze příklad. Musíte zkopírovat svůj vlastní unikátní kód pro vložení z vašeho Dashboardu, protože obsahuje vaše osobní ID widgetu.

Krok 2: Vyberte metodu instalace

Statamic podporuje šablonovací systémy Antlers i Blade. Vyberte metodu podle toho, který šablonovací engine používáte:

Metoda 1: Antlers layout (doporučeno)

Nejjednodušší způsob, jak přidat chatbota, je zahrnout jej do hlavního souborů layoutu. Statamic používá Antlers jako svůj výchozí šablonovací engine.

Přejděte do adresáře resources/views svého projektu Statamic
Open your layout file (usually layout.antlers.html)
Najděte uzavírací značku </body>
Vložte svůj Asyntai embed kód těsně před značku </body>
Uložte soubor

<!DOCTYPE html>
<html lang="{{ site:short_locale }}">
<head>
  <meta charset="utf-8">
  <title>{{ title }} | {{ site:name }}</title>
  {{ vite src="resources/js/site.js|resources/css/site.css" }}
</head>
<body>
  {{ template_content }}

  <!-- Asyntai Chatbot -->
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</body>
</html>

Tip: The {{ template_content }} variable is where Statamic injects your page content. Always add the chatbot script after this, just before </body>.

Metoda 2: Blade layout

Pokud používáte šablony Blade místo Antlers, postupujte takto:

Přejděte do adresáře resources/views svého projektu Statamic
Open your Blade layout file (e.g., layout.blade.php)
Najděte uzavírací značku </body>
Vložte svůj Asyntai embed kód těsně před značku </body>
Uložte soubor

<!DOCTYPE html>
<html lang="{{ $site->shortLocale() }}">
<head>
  <meta charset="utf-8">
  <title>{{ $title }} | {{ $site->name() }}</title>
  @vite(['resources/js/site.js', 'resources/css/site.css'])
</head>
<body>
  {!! $template_content !!}

  <!-- Asyntai Chatbot -->
  <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
</body>
</html>

Poznámka: In Blade templates, use {!! $template_content !!} to render the page content. The !! syntax prevents HTML escaping.

Metoda 3: Použití partial

Pro lepší organizaci můžete vytvořit znovupoužitelný partial pro chatbota:

Krok 1: Vytvořte partial

Vytvořte nový soubor na resources/views/partials/_chatbot.antlers.html
Přidejte svůj Asyntai embed kód do tohoto souborů:
 <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Krok 2: Zahrňte do svého layoutu

Otevřete svůj soubor layoutu (layout.antlers.html)
Přidejte tag partial před </body>:
{{ partial:chatbot }} </body>

Proč použít partial? Partialy usnadňují správu externích skriptů na jednom místě. Pokud budete potřebovat aktualizovat kód chatbota, stačí upravit jediný soubor.

Použití více layoutů

Pokud váš web Statamic používá více layoutů (např. různé layouty pro blogové příspěvky, vstupní stránky atd.), nezapomeňte přidat skript chatbota do každého souborů layoutu, kde chcete widget zobrazit.

Můžete nastavit, který layout stránka používá, několika způsoby:

V záznamu: Přidejte layout: your_layout do front matter
V kolekci: Nastavte výchozí layout v konfiguračním YAML souborů kolekce
V blueprintu: Přidejte pole layoutu, že kterého mohou editoři vybírat

Pro startovací sady Statamic

Pokud používáte startovací sadu Statamic, umístění layoutu se může lišit. Běžná umístění zahrnují:

Default Statamic

resources/views/layout.antlers.html

Peak Starter

resources/views/layout.antlers.html s partialy v resources/views/snippets/

Cool Writings

resources/views/layout.antlers.html

Starter's Creek

resources/views/layout.blade.php

Krok 3: Vymažte mezipaměť a ověřte

Po přidání kódu vymažte mezipaměť Statamic, aby se změny projevily:

php artisan cache:clear
php please stache:refresh

Poté navštivte svůj web v nové záložce prohlížeče nebo v anonymním okně. V pravém dolním rohu byste měli vidět tlačítko chatovacího widgetu. Klikněte na něj a ujistěte se, že se správně otevírá a funguje.

Nevidíte widget? Ujistěte se, že jste vymazali jak mezipaměť Laravelu, tak Stache Statamic. Pokud používáte statické cachování, spusťte také php please static:clear. Zkontrolujte konzoli prohlížeče (F12) na případné chyby JavaScriptu.

Důležité: Pokud používáte generátor statických stránek Statamic (ssg), nezapomeňte po přidání skriptů chatbota znovu vygenerovat statické soubory spuštěním php please ssg:generate.

Dokumentace