Peacock

Theme

Peacock in Wix einbauen ​

Wix erlaubt Custom-Code im Body (Site → Settings → Custom Code) und Embed-HTML-Widgets auf einzelnen Pages. Der Peacock- Embed-Script läuft in beiden Slots. Kein Premium-Plan nötig für das Custom-Code-Feature, aber Embed-HTML-Widgets brauchen einen Wix-Premium-Plan.

Voraussetzung ​

  • Wix-Site mit aktivem Premium-Plan (alle Pläne ab "Combo" unterstützen Embed-HTML).
  • Peacock-Space-Slug. Für den schnellen Test: marketing-demo mit Story /marketing-demo.

Schritt 1 — Embed-Script Site-weit einbauen ​

Wix-Dashboard → Settings → Advanced → Custom Code → Add Custom Code.

  • Code-Snippet:

    html
    <script
  src="https://peacock-cms.webhoch.com/embed.js"
  data-peacock-api="https://peacock-cms.webhoch.com"
  data-peacock-space="dein-space-slug"
  defer
></script>

  • Add Code to Pages: All pages, load once — Wix injectet den Script dann genau einmal pro Session, nicht pro Page-Navigation.

  • Place Code in: Body — end (gleicher Grund wie bei Webflow: First-Paint nicht blockieren).

  • Apply klicken.

Schritt 2 — Story-Container pro Page ​

Auf der Page, wo Peacock-Content erscheinen soll, füge ein Embed-HTML-Widget ein:

  1. Im Wix-Editor: Add Elements → Embed Code → Embed HTML auf die Stelle ziehen, wo der Story-Container hin soll.

  2. Enter Code klicken, dann den Container reinpasten:

    html
    <div data-peacock-story="/about"></div>

  3. Update klicken. Im Wix-Editor siehst du erstmal ein graues Box-Element — der eigentliche Inhalt erscheint erst nach Publish im Live-Modus.

Schritt 3 — Multi-Story-Pages ​

Mehrere Embed-HTML-Widgets sind erlaubt, jedes mit eigenem Story- Pfad:

html
<!-- Widget 1 — Hero -->
<div data-peacock-story="/hero"></div>

<!-- Widget 2 — Pricing -->
<div data-peacock-story="/pricing"></div>

Schritt 4 — Pro-Funktionen ​

Wix übernimmt data-*-Attribute unverändert. Alle Pro-Features des Embed-Scripts stehen zur Verfügung:

html
<!-- Englische Story -->
<div data-peacock-story="/welcome" data-peacock-lang="en-GB"></div>

<!-- Mobile-Segment forcieren -->
<div data-peacock-story="/hero" data-peacock-segment="mobile"></div>

Wix-spezifische Stolpersteine ​

Wix-Editor sandboxt iFrames

Wix rendert Embed-HTML-Widgets in einem iFrame, nicht inline ins Page-DOM. Der Script im Site-Wide-Custom-Code läuft im Top-Window — der kann den iFrame-Container nicht direkt sehen.

Lösung: Pack den Script mit dem Container zusammen ins Embed- HTML-Widget:

html
<div data-peacock-story="/about"></div>
<script
  src="https://peacock-cms.webhoch.com/embed.js"
  data-peacock-api="https://peacock-cms.webhoch.com"
  data-peacock-space="dein-space-slug"
  defer
></script>

So läuft der Embed-Script innerhalb des iFrames und findet den Container. Nachteil: jeder iFrame lädt den Script neu (5 KB extra). Wenn du viele Stories pro Page brauchst, ist das CDN-Caching der Browser auf deiner Seite — die zweite Anfrage holt 0 Bytes vom Netzwerk.

Wix Editor X vs. Studio vs. Classic ​

Wix-VarianteCustom-Code-PfadEmbed-HTML
Wix Editor (Classic)Settings → Custom CodeAdd Elements → Embed Code → Embed HTML
Wix StudioSite → Custom CodeComponents → Embed HTML iFrame
Editor X (deprecated)Settings → Custom CodeAdd → More → HTML iFrame

Alle drei Varianten unterstützen den Embed-Script-Ansatz — Settings-Pfade unterscheiden sich.

Heading-Hierarchie ​

Wix-Sections setzen oft eigene <h1> — wenn der Peacock-Hero-Block dann auch <h1> emittiert, ist die Hierarchie doppelt belegt. Set data-peacock-heading-offset="1" auf dem Script-Tag oder im Embed-HTML-Widget:

html
<script
  src="https://peacock-cms.webhoch.com/embed.js"
  data-peacock-api="https://peacock-cms.webhoch.com"
  data-peacock-space="dein-space-slug"
  data-peacock-heading-offset="1"
  defer
></script>

Verschiebt jede Peacock-emittierte Heading um eine Stufe runter (H1→H2 …). Details: Integration-Guide.

SEO-Tradeoff ​

SEO-kritisch?

Wix Embed-HTML-Widgets sind iFrames mit Client-Side-Rendering. Crawler indexieren iFrame-Content nicht mit dem Parent-HTML — das ist eine SEO-Schwachstelle, die mit Webflow vergleichbar oder schlechter ist.

Für SEO-kritischen Content (Hauptseiten, Conversion-Ziele) ist Wix

  • Embed-Script nicht empfehlenswert. Nutze Peacock dort eher über Astro/Next mit SSR und migriere weg von Wix.

Embed-Modus bleibt gut für: News-Banner, Blog-Snippets, Marketing- Boxen die Wix-native nicht abbildet, A/B-Testing-Variants.

Wix-Editor Republish nicht vergessen ​

Jede Wix-Änderung — auch im Embed-HTML-Widget — benötigt Publish (oben rechts im Editor). Bis du publishst, sehen Live-Visitors die alte Version.

Eine Peacock-Story-Änderung (z. B. neue Headline) ist sofort über die CDN live — kein Wix-Publish nötig. Das ist der Vorteil von Embed-Mode: dein Content-Team in Peacock arbeitet unabhängig von deinem Wix-Workflow.

Weiterlesen ​