Dev-Modus

Für größere Custom Widgets ist der Editor im Popup irgendwann zu klein. Mit dem Dev-Modus entwickelst du lokal in deinem eigenen Setup, mit deinem Editor, deinem Bundler und Hot Reload.

So funktioniert's

Starte einen beliebigen lokalen HTTP-Server (Vite, python -m http.server, egal was).

Öffne im Overlay-Editor die Settings deines Custom Widgets und aktiviere den Dev Mode.

Trage den Port deines Servers ein.

Das Widget im Editor zeigt jetzt http://localhost:PORT an, dein Browser greift direkt auf deinen lokalen Server zu.

Kopiere den angezeigten SDK-Snippet in dein lokales HTML, damit Pixl verfügbar ist:

<script src="https://pixl.lennox.zip/sdk/pixl.js?token=__WIDGET_TOKEN__"></script>

Zurück in Produktion

Dev-Modus ausschalten, fertigen HTML/CSS/JS-Code in den Editor übernehmen und speichern. In Produktion injiziert pixl das SDK automatisch, den Script-Tag brauchst du dann nicht mehr.

Kein Tunnel, keine CLI: Der Browser auf deinem Rechner greift direkt auf localhost zu. Der Dev-Modus funktioniert deshalb nur auf der Maschine, auf der dein Server läuft.

So funktioniert's

Zurück in Produktion

On this page