Direkt zum Hauptinhalt

Pro Editor Troubleshooting

Die häufigsten Probleme im Pro Editor und ihre Lösungen — inklusive ein paar Korrekturen gegenüber älteren Notizen, die hier vielleicht noch im Umlauf sind.

Editor lädt nicht / weißer Bildschirm

  • Browser-Cache leeren (Strg+Shift+R).
  • Browser-Konsole öffnen (F12), Fehler prüfen. Häufig: Adblocker oder Cookie-Blocker, der die Editor-Assets blockt.
  • Login-Session abgelaufen → einmal ausloggen, einloggen. Der Pro Editor braucht eine gültige Session (kein API-Token-Zugriff) — landest du beim Öffnen von /overlay/editor.php?id=… auf der Login-Seite, ist genau das der Grund.
  • URL ohne ?id= aufgerufen? Der Editor leitet dich dann automatisch zur Overlay-Übersicht /dashboard/overlays weiter, statt eine Fehlerseite zu zeigen — das ist normales Verhalten, kein Bug. Öffne den Editor immer über den Button ✨ Im Pro Editor öffnen auf einer Overlay-Karte.
  • "Overlay nicht gefunden" oder "Kein Zugriff": Prüfe, ob die Overlay-ID wirklich deinem Account (oder deinem Team, mit passender Rolle) gehört. Team-Mitglieder ohne die Berechtigung overlay.view bekommen hier bewusst eine 403.

Element lässt sich nicht verschieben

  • Layer-Liste (linke Seitenleiste, unter der Element-Palette) prüfen: ist das Element gesperrt? Schloss-Icon anklicken zum Entsperren.
  • Ein anderes Element mit höherem Z-Index liegt drüber und fängt den Klick ab. Setz das störende Element im Eigenschaften-Panel kurz auf einen niedrigeren Z-Index-Wert, verschiebe dein eigentliches Element, und setz den Wert danach zurück.
  • Element ist außerhalb der Canvas-Bounds gerutscht: in der rechten Eigenschaften-Spalte x/y manuell auf 0/0 setzen, dann neu positionieren.

Speichern schlägt fehl

  • Top-Bar zeigt Fehler-Toast: meistens Validierung (z. B. negative Größe, leerer Text in einem Pflichtfeld).
  • Browser-Konsole prüfen — das Speichern geht als PATCH auf /v1/overlays/{id}, ein Netzwerk-Tab-Blick zeigt dir die genaue Fehlerantwort.
  • Element-Limit erreicht: Der Zähler in der Layer-Liste zeigt aktuell/Limit. Das Limit richtet sich nach deinem Plan (Free/Starter 20, Creator/Pro 50, Pro Max/Elite/Studio 100, Team 150 als absolutes Maximum) — mehr dazu auf Pro Editor Grundlagen. Lösung: unnötige Elemente löschen oder Layout in mehrere Szenen splitten, nicht auf ein größeres API-Limit hoffen — 150 ist hart, auch mit Upgrade kommst du nicht drüber.
  • Read-only-Rolle im Team: Der 💾 Speichern-Button ist dann deaktiviert (Tooltip "Read-only"). Du brauchst die Berechtigung overlay.edit.

Browser-Source bleibt schwarz

  1. URL prüfen: Format ist /overlay/view?id=<id>&token=<token> — beide Parameter müssen vorhanden und vollständig sein.
  2. Token noch gültig? Im Editor auf 🔗 OBS-URL klicken, frische URL kopieren und vergleichen. Wurde der Token rotiert (z. B. weil jemand im Team "Token rotieren" geklickt hat), zeigt die alte URL nicht mehr das Overlay, sondern eine Setup-Hinweiskarte statt eines echten HTTP-401.
  3. Dieselbe URL direkt im Browser öffnen (Chrome/Firefox). Erscheint das Overlay dort, liegt's an OBS — Rechtsklick auf die Quelle → Cache der aktuellen Seite aktualisieren. Bleibt es auch im normalen Browser schwarz, ist es ein Problem im Layout selbst.
  4. Echter Debug-Modus, nicht ein Editor-Button: Häng &debug=1 an die OBS-Browser-Source-URL. Das blendet oben links ein Diagnose-Banner ein mit Canvas-Größe, tatsächlicher OBS-Viewport-Größe, Skalierungsfaktor und (bei High-DPI-Displays) dem Device-Pixel-Ratio. Stimmen Canvas- und Viewport-Größe nicht überein (z. B. weil OBS beim Anlegen der Quelle noch die Default-Größe 800×600 hatte), zeigt das Banner dir sogar die passenden Width/Height-Werte zum Eintragen in OBS an. Das Banner verblasst nach 30 Sekunden von selbst — debug=1 danach wieder aus der URL entfernen, wenn du live gehst.

Häufigste Ursache für "sieht in OBS anders aus als im Editor": genau dieser Canvas/Viewport-Mismatch. Miss die Zahlen mit dem Debug-Banner nach, bevor du am Layout rumschraubst.

Animation läuft nicht / ruckelt

  • Hardware-Beschleunigung in OBS prüfen, wenn die Browser-Source generell flackert.
  • Mehrere Animationen gleichzeitig (Hype-Train + Alert + ein animiertes Widget): das ist ein Renderer-Limit, kein Bug. Reduzieren oder eines davon statisch stellen.
  • Cam-Sync mit hoher Auflösung (4K-Webcam) kombiniert mit weiteren animierten Elementen kann ans GPU-Limit stoßen. Cam-Quelle in OBS auf 1080p runtersetzen.

Counter zeigt falsche Zahl

  • Prüfen, ob das Overlay überhaupt einen Twitch-Channel gebunden hat (Pille oben in der Top-Bar). Ohne Channel-Bindung bleibt die Live-Vorschau leer, weil der Worker keine Chat-/Event-Daten publishen kann.
  • Backend direkt prüfen: GET /v1/overlays/{id}/elements zeigt dir die rohen Element-Daten inkl. der gebundenen Quelle des Zähler-Elements.
  • Twitch-Scope: Nach einer Neu-Verbindung der Integration plötzlich 0 statt echter Zahl? Fehlt evtl. ein OAuth-Scope. Unter /dashboard/integrations → erneut autorisieren.
  • Zum Testen ohne auf ein echtes Event zu warten: POST /v1/overlays/{id}/test-alert löst einen Test-Alert im Overlay aus.

Versions-Rollback

  • Anders als man erwarten könnte, ist das Wiederherstellen sofort aktiv — es gibt keinen zusätzlichen Speichern-Schritt danach. Ein Klick auf "Wiederherstellen" im Versionen-Modal fragt zur Bestätigung, legt automatisch eine Sicherungsversion vom aktuellen Stand an und ruft direkt POST /v1/overlays/{id}/versions/{version_id}/restore auf. Die Seite lädt danach neu. Wenn du also aus Versehen die falsche Version wiederherstellst: keine Panik, dein vorheriger Stand liegt als frische Sicherungsversion direkt darüber in der Liste — einfach die wiederherstellen.
  • Schlägt der Restore-Aufruf fehl (Fehler-Alert nach dem Bestätigungsdialog): meistens hat sich seit der alten Version das Datenmodell geändert (z. B. ein Widget-Typ wurde entfernt oder umbenannt). Screenshot vom Fehlercode an den Support.

"Debug"-Modus in der Support-Kommunikation

Es gibt keinen "Debug-Logs herunterladen"-Button im Editor. Die technische Diagnose läuft stattdessen über eine eigene Dashboard-Seite: /dashboard/overlay-debug?id=<overlay_id>, erreichbar auch über den 🔧 Debug-Link auf jeder Overlay-Karte in /dashboard/overlays. Sie zeigt Token-Status, WebSocket-Status, Event-Queue und die letzten vom Browser-Source gemeldeten Renderer-Fehler. Wenn du den Support kontaktierst, ist der schnellste Weg:

  1. Die Overlay-ID nennen (steht in der URL des Editors und der Debug-Seite).
  2. Einen Screenshot der Debug-Seite anhängen.
  3. Bei OBS-spezifischen Problemen zusätzlich einen Screenshot des debug=1-Banners aus der Browser-Source (siehe Abschnitt "Browser-Source bleibt schwarz").

Die Debug-Seite enthält keine Passwörter und keine vollständigen Tokens im Klartext — trotzdem: Screenshots davon nicht öffentlich posten (z. B. im Stream oder in öffentlichen Discord-Kanälen), sondern nur direkt an den Support.

Wenn nichts hilft

Halte bereit: Overlay-ID, ungefähre Uhrzeit des Problems, ob es im normalen Browser genauso auftritt wie in OBS, und einen Screenshot der Debug-Seite. Damit lässt sich in den Server-Logs gezielt nach der Overlay-ID suchen, statt im Blindflug zu raten.

Verwandte Seiten