AI Builder Prompts
Tyto výzvy použijte s Cursor, Claude, v0, Bolt, Lovable, Replit nebo jiným AI builderem, když chcete, aby vám nainstaloval ChattyBox.
Před vložením výzvy zkopírujte přesný úryvek widgetu z hlavního panelu ChattyBox. Udržujte klíč veřejného widgetu API a data-api-url přesně tak, jak je uvedeno.
Univerzální Prompt
Prompt připravený ke zkopírování
Univerzální Prompt
Přidat ChattyBox na tento web.
Použijte tento skript z mého řídicího panelu ChattyBox:
Úryvek widgetuHTML
<script
src="https://chattybox.ai/widget.js"
data-api-key="YOUR_API_KEY"
data-api-url="https://app.chattybox.ai"
async
></script>Požadavky
- 1Načtěte skript jednou na každou veřejnou stránku, kde by návštěvníci měli vidět chatbota.
- 2Umístěte jej na konec těla nebo použijte doporučený zavaděč skriptů rámce.
- 3Nevystavujte klíče soukromého serveru API, tokeny správce, tajemství prostředí ani přihlašovací údaje služby.
- 4Udržujte veřejný klíč widgetu ChattyBox API přesně tak, jak je uveden.
- 5Udržujte data-api-url přesně tak, jak je uvedeno na řídicím panelu ChattyBox.
- 6Pokud má tento web stránky specifické pro daný jazyk, nastavte data-locale na jazyk stránky nebo se spolehněte na atribut html lang stránky.
- 7Ověřte, že se widget zobrazí, otevře, odešle testovací otázku a zobrazí citace zdroje.
Next.js / React Prompt
Prompt připravený ke zkopírování
Next.js / React Prompt
Nainstalujte ChattyBox do tohoto prostředí aplikace Next.js nebo React.
Použijte tento fragment widgetu z mého ChattyBox řídicího panelu:
Úryvek widgetuHTML
<script
src="https://chattybox.ai/widget.js"
data-api-key="YOUR_API_KEY"
data-api-url="https://app.chattybox.ai"
async
></script>Požadavky na implementaci
- 1Pro Next.js App Router přidejte skript do app/layout.tsx s next/script a strategy="afterInteractive".
- 2Pro Next.js Pages Router jej přidejte do pages/_app.tsx nebo pages/_document.tsx pomocí doporučeného zavaděče skriptů daného rámce.
- 3V případě React SPA načtěte skript jednou do prostředí aplikace nejvyšší úrovně nebo index.html, nikoli do každé komponenty trasy.
- 4Nevytvářejte koncový bod back-endu nebo proxy pro tento veřejný fragment widgetu.
- 5Nepřesouvejte klíč veřejného widgetu API do soukromé proměnné prostředí pouze pro server, pokud ho sestava stále nevydává do prohlížeče.
- 6Udržujte data-api-key a data-api-url přesně tak, jak je uvedeno.
- 7Po implementaci mi řekněte, který soubor se změnil a jak otestovat, že se widget otevře a odpovídá s citacemi.
Docusaurus Prompt
Prompt připravený ke zkopírování
Docusaurus Prompt
Nainstalujte ChattyBox na tomto webu dokumentace Docusaurus.
Použijte tento fragment widgetu z mého ChattyBox řídicího panelu:
Úryvek widgetuHTML
<script
src="https://chattybox.ai/widget.js"
data-api-key="YOUR_API_KEY"
data-api-url="https://app.chattybox.ai"
async
></script>Požadavky
- 1Přidejte skript jednou pro celý web s dokumenty, nejlépe v src/theme/Root.tsx nebo src/theme/Root.js.
- 2Ponechte stávající Docusaurus motiv, navigační panel, zápatí, analýzy a chování i18n nedotčené.
- 3Nepřidávejte skript na každou jednotlivou stránku Markdown.
- 4Pokud má web lokalizované trasy, používejte data-locale pouze v případě potřeby a přizpůsobte jej aktuálnímu jazyku stránky.
- 5Potvrďte, že skript stále obsahuje data-api-key a data-api-url.
- 6Po implementaci spusťte sestavení Docusaurus nebo příkaz pro ověření existujících dokumentů projektu.
WordPress nebo CMS Prompt
Prompt připravený ke zkopírování
WordPress nebo CMS Prompt
Přidejte ChattyBox na tento web WordPress nebo CMS.
Použijte tento fragment widgetu z mého ChattyBox řídicího panelu:
Úryvek widgetuHTML
<script
src="https://chattybox.ai/widget.js"
data-api-key="YOUR_API_KEY"
data-api-url="https://app.chattybox.ai"
async
></script>Požadavky
- 1Přidejte skript pomocí nejbezpečnější globální vlastní cesty kódu, která je k dispozici: skripty zápatí motivu, zápatí podřízeného motivu, plugin skriptu záhlaví/zápatí, CMS globální vlastní oblast HTML nebo Google Tag Manager.
- 2Vložte jej na veřejné stránky, příspěvky, dokumenty a články znalostní báze, kde by se návštěvníci měli ptát.
- 3Pokud to není výslovně požadováno, nevkládejte jej na stránky pro správu, pokladnu, účet, pouze pro předváděcí akce nebo soukromé členství.
- 4Neodstraňujte data-api-key, data-api-url ani asynchronně ze skriptu.
- 5Pokud má CMS samostatné jazykové šablony, nastavte data-locale podle potřeby na odpovídající kód jazyka.
- 6Dejte mi přesné místo, kam byl skript přidán, a krátký plán testování prohlížeče.
Google Tag Manager Prompt
Prompt připravený ke zkopírování
Google Tag Manager Prompt
Vytvořte pokyny k instalaci ChattyBox pomocí Google Tag Manager.
Použijte tento fragment widgetu z mého ChattyBox řídicího panelu:
Úryvek widgetuHTML
<script
src="https://chattybox.ai/widget.js"
data-api-key="YOUR_API_KEY"
data-api-url="https://app.chattybox.ai"
async
></script>Požadavky
- 1Vytvořte vlastní značku HTML pomocí výše uvedeného skriptu.
- 2Použít spouštěč Všechny stránky, pokud neurčím užší sadu veřejných stránek.
- 3Pokud tento kontejner GTM používá režim souhlasu, uveďte nastavení souhlasu.
- 4Zahrňte kontroly v režimu náhledu pro spuštění značky, zobrazení spouštěče widgetů, odeslání testovací otázky a zobrazení citací.
- 5Nedoporučujte přidávat soukromé klíče API nebo tajné klíče serveru do GTM.
Ověření po instalaci Prompt
Prompt připravený ke zkopírování
Ověření po instalaci Prompt
Zkontrolujte, zda je tato instalace ChattyBox připravena ke spuštění.
Zkontrolujte tyto požadavky
- 1Skript widgetu se jednou načte na zamýšlené veřejné stránky.
- 2Skript obsahuje src="https://chattybox.ai/widget.js".
- 3Skript obsahuje data-api-key a data-api-url.
- 4Jazyk stránky a jakákoli hodnota data-locale odpovídá obsahu stránky.
- 5Konzole prohlížeče nemá žádný ChattyBox chybějící atribut, neplatný klíč nebo chyby původu.
- 6Widget se otevře, odešle realistickou testovací otázku, odpovědi z indexovaného obsahu a zobrazí citace zdrojů.
- 7Stránka neodhaluje klíče soukromého serveru ani nesouvisející tajemství.
Vraťte všechny problémy s cestami k souborům, přesnými odkazy na kód a nejmenší bezpečnou opravou.