Shopify-integraatio

Lisää ChatReact AI -chatbotit, yhteydenottolomakkeet ja FAQ-accordionit Shopify-kauppaasi virallisella ChatReact Shopify App -sovelluksella.

Asennus

1. Asenna ChatReact -sovellus Shopify App Storesta
2. Avaa sovellus Shopify-hallintapaneelissasi

Erillistä tilin yhdistämistä ei tarvita — linkität sovelluksen chatteihin ja lomakkeisiin liittämällä niiden ID:t ChatReact-hallintapaneelista.

Ominaisuudet

Shopify-sovellus tarjoaa kolme widget-tyyppiä:

Chat Widgetin asentaminen

Chat-widgetin asentaminen vaatii kaksi vaihetta: luo widget-tehtävä ChatReact-sovelluksessa ja ota sen jälkeen App Embed käyttöön teemassasi.

Vaihe 1: Luo widget-tehtävä

1. Avaa ChatReact-sovellus Shopify-hallinnassasi
2. Chat Widget -välilehdellä napsauta Add Assignment
3. Syötä Chatbot ID (löytyy ChatReact-hallintapaneelista kohdasta Settings → Embed)
4. Napsauta Save Assignment

Vaihe 2: Ota App Embed käyttöön

1. Siirry kohtaan Online Store → Themes → Edit theme
2. Napsauta vasemmassa alakulmassa olevaa App embeds -ikonia (palapelin pala)
3. Kytke ChatReact Chat Widget asentoon ON
4. Napsauta Save

Chat-widget näkyy kaikilla sivuilla, joita jokin widget-tehtävistänne kattaa.

Widget-tehtävät

Jokainen tehtävä linkittää chatbotin kauppapaikkaanne. On kaksi tehtävätyyppiä:

• Everywhere: Widget näkyy kaikilla sivuilla (oletus). Voitte halutessanne lisätä Exclude URLs — yksi polku per rivi, *-jokerimerkki on tuettu (esim. /blogs/*)
• Specific Page: Widget näkyy vain syöttämällänne sivupolulla (esim. /pages/about)

Jos sivulla on oma Specific Page -tehtävänsä, kyseisellä sivulla näytetään kyseinen chatbot Everywhere-chatbotin sijaan.

Lomake- ja FAQ-widgettien lisääminen

Form- ja FAQ-widgetit lisätään App Blocks -lohkoina Theme Editorissa:

1. Siirry kohtaan Online Store → Themes → Edit theme
2. Mene sivulle, johon haluat widgetin
3. Napsauta Add block ja etsi "ChatReact"
4. Valitse ChatReact Form tai ChatReact FAQ
5. Syötä blockin asetuksiin Form ID tai Chatbot ID

Manuaalinen upotus (Liquid)

Jos haluat muokata malleja suoraan, voit myös lisätä widgetit mihin tahansa Liquid-malliin:

<!-- Form widget -->
<div id="chatreact-form"></div>
<script src="https://www.chatreact.ai/embed/form.js"
  data-form-id="YOUR_FORM_ID"
  data-container="chatreact-form"
  async></script>

<!-- FAQ widget -->
<div id="chatreact-faq"></div>
<script src="https://www.chatreact.ai/embed/faq-widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
  data-container="chatreact-faq"
  async></script>

Form Widget -tyylittely

Mukauttakaa lomakkeen ulkoasua Theme Editorissa:

FAQ Widget -tyylittely

Widgettien hallinta

ChatReact-sovellus Shopify-hallinnassanne tarjoaa kolme välilehteä:

1. Chat Widget — Luo ja hallinnoi widget-tehtäviä, jotka määrittävät, millä sivuilla chat-widget näkyy
2. Forms — Vaiheittaiset upotusohjeet, manuaalinen Liquid-snippet ja tieto siitä, mistä löydätte Form ID:n
3. FAQ Widget — Upotusohjeet FAQ-widgetille ja tieto siitä, mistä löydätte Chatbot ID:n

Form- ja FAQ-valinta tapahtuu Theme Editorissa: syöttäkää Form ID tai Chatbot ID blockin asetuksiin.

Kielituen tiedot

Sovellus tukee kaikkia 24 EU-kieltä:

• chat widget tunnistaa automaattisesti kunkin vierailijan selaimen kielen ja vertaa sitä chatbotinne tukemiin kieliin; tarvittaessa se palautuu chatbotin oletuskieleen
• Form- ja FAQ-lohkoilla on oma Language-asetus Theme Editorissa — oletuksena Auto-detect, ja sen voi ylikirjoittaa lohko kohtaisesti

Poisto

Kun poistatte ChatReact-sovelluksen, kaikki widget-konfiguraatiot ja tallennetut tiedot siivotaan automaattisesti Shopify-kaupastanne.

Seuraavat askeleet

• Widget Embedding →
• FAQ Management →
• Form Configuration →