Kako dodati klepetalnik Asyntai AI v Statamic

Vodič po korakih za spletna mesta Statamic CMS

Platforma:

Korak 1: Pridobite svojo vdelovalno kodo

Najprej pojdite na svojo Nadzorno ploščo Asyntai in se pomaknite navzdol do razdelka "Vdelovalna koda". Kopirajte svojo edinstveno vdelovalno kodo, ki bo videti takole:

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

Opomba: Zgornja koda je le primer. Svojo edinstveno vdelovalno kodo morate kopirati iz svoje Nadzorne plošče, saj vsebuje vaš osebni ID klepetalnika.

Korak 2: Izberite način namestitve

Statamic podpira tako predloge Antlers kot Blade. Izberite način glede na to, kateri mehanizem predlog uporabljate:

Način 1: Postavitev Antlers (priporočeno)

Najlažji način za dodajanje klepetalnika je vključitev v glavno datoteko postavitve. Statamic privzeto uporablja Antlers kot mehanizem predlog.

Pojdite v imenik resources/views svojega projekta Statamic
Open your layout file (usually layout.antlers.html)
Poiščite zaključno oznako </body>
Prilepite svojo vdelovalno kodo Asyntai tik pred oznako </body>
Shranite datoteko

<!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>

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

Način 2: Postavitev Blade

Če uporabljate predloge Blade namesto Antlers, sledite tem korakom:

Pojdite v imenik resources/views svojega projekta Statamic
Open your Blade layout file (e.g., layout.blade.php)
Poiščite zaključno oznako </body>
Prilepite svojo vdelovalno kodo Asyntai tik pred oznako </body>
Shranite datoteko

<!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>

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

Način 3: Uporaba dela (Partial)

Za boljšo organizacijo lahko ustvarite del za ponovno uporabo za klepetalnik:

Korak 1: Ustvarite del

Ustvarite novo datoteko na resources/views/partials/_chatbot.antlers.html
Dodajte svojo vdelovalno kodo Asyntai v to datoteko:
 <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Korak 2: Vključite v svojo postavitev

Odprite svojo datoteko postavitve (layout.antlers.html)
Dodajte oznako dela pred </body>:
{{ partial:chatbot }} </body>

Zakaj uporabiti del? Deli olajšajo upravljanje zunanjih skript na enem mestu. Če boste kdaj morali posodobiti kodo klepetalnika, morate urediti samo eno datoteko.

Uporaba več postavitev

Če vaše spletno mesto Statamic uporablja več postavitev (npr. različne postavitve za objave v blogu, pristajalne strani itd.), dodajte skripto klepetalnika v vsako datoteko postavitve, kjer želite, da se pripomocek prikaže.

Dolocite lahko, katero postavitev stran uporablja, na več načinov:

V vnosu: Dodajte layout: your_layout v prednje podatke
V zbirki: Nastavite privzeto postavitev v konfiguracijski datoteki YAML svoje zbirke
V nacrtovalnem vzorcu: Dodajte polje postavitve, iz katerega lahko uredniki izbirajo

Za zacetne pakete Statamic

Če uporabljate zacetni paket Statamic, se lokacija postavitve lahko razlikuje. Pogoste lokacije vkljucujejo:

Default Statamic

resources/views/layout.antlers.html

Peak Starter

resources/views/layout.antlers.html z deli v resources/views/snippets/

Cool Writings

resources/views/layout.antlers.html

Starter's Creek

resources/views/layout.blade.php

Korak 3: Počistite predpomnilnik in preverite

Po dodajanju kode počistite predpomnilnik Statamic, da se spremembe uveljavijo:

php artisan cache:clear
php please stache:refresh

Nato obiščite svoje spletno mesto v novem zavihku brskalnika ali oknu brez beleženja. V spodnjem desnem kotu bi morali videti gumb pripomocka za klepet. Kliknite nanj, da se prepričajte, da se odpre in pravilno deluje.

Ne vidite klepetalnika? Prepričajte se, da ste pocistili tako predpomnilnik Laravela kot Stache Statamic. Če uporabljate staticno predpomnjenje, zaženite tudi php please static:clear. Preverite konzolo brskalnika (F12) za morebitne napake JavaScript.

Pomembno: Če uporabljate generator staticnih strani Statamic (ssg), po dodajanju skripte klepetalnika obvezno regenerirajte svoje staticne datoteke z zagonom php please ssg:generate.

Dokumentacija