Widget-Installation

Getting Started6 Aufrufe

Widget-Installation

Embed-Code abrufen

Gehen Sie zu Dashboard -> Assistants -> Your Bot -> Embed Code. Dort sehen Sie ein Snippet wie dieses:

<script src="https://cdn.conviro.io/widget/widget.iife.js"></script>
<script>
  cw('init', { publicKey: 'pk_YOUR_PUBLIC_KEY' });
</script>

Nachfolgend finden Sie Schritt-für-Schritt-Anleitungen für alle gängigen Plattformen.


WordPress

  1. Öffnen Sie Ihr WordPress-Adminpanel.
  2. Gehen Sie zu Appearance -> Theme File Editor -> footer.php (oder verwenden Sie ein Plugin wie Insert Headers and Footers).
  3. Fügen Sie den Embed-Code direkt vor dem \</body\>-Tag ein.
  4. Klicken Sie auf Update File.
  5. Leeren Sie den Cache eines eventuell vorhandenen Caching-Plugins (WP Super Cache, W3 Total Cache usw.) und prüfen Sie das Ergebnis.

Shopify

  1. Gehen Sie im Shopify-Admin zu Online Store -> Themes -> Actions -> Edit Code.
  2. Öffnen Sie theme.liquid.
  3. Fügen Sie den Embed-Code vor \</body\> ein.
  4. Klicken Sie auf Save.

Wix

  1. Gehen Sie in Ihrem Wix-Dashboard zu Settings -> Custom Code.
  2. Klicken Sie auf + Add Custom Code.
  3. Fügen Sie den Embed-Code ein und setzen Sie die Platzierung auf Body - End.
  4. Wenden Sie ihn auf All pages an und klicken Sie auf Apply.

Squarespace

  1. Gehen Sie zu Settings -> Advanced -> Code Injection.
  2. Fügen Sie den Embed-Code in das Feld Footer ein.
  3. Klicken Sie auf Save.

Eigenes HTML / Statische Websites

Fügen Sie den Embed-Code einfach vor dem schließenden \</body\>-Tag in Ihrer HTML-Datei ein. Das Widget-Skript wird asynchron geladen und blockiert das Rendern der Seite nicht.

React / Next.js

In React- oder Next.js-Projekten können Sie das Widget in Ihrem Root-Layout oder in der \<App\>-Komponente laden:

// app/layout.tsx (Next.js App Router example)
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          src="https://cdn.conviro.io/widget/widget.iife.js"
          strategy="afterInteractive"
        />
        <Script id="conviro-init" strategy="afterInteractive">
          {`cw('init', { publicKey: 'pk_YOUR_PUBLIC_KEY' });`}
        </Script>
      </body>
    </html>
  );
}

Installation überprüfen

  1. Öffnen Sie Ihre Website in einem Browser.
  2. Sie sollten die Conviro-Chat-Bubble unten rechts sehen (oder unten links, je nach Ihren Einstellungen).
  3. Falls sie nicht erscheint, lesen Sie den Troubleshooting-Artikel Widget wird nicht angezeigt.
widgetinstallationwordpressshopifywixsquarespacereactnextjsembed

War dieser Artikel hilfreich?