TutuCut
Einbettbares Widget

Eine Zeile Code — füge deiner Website in Sekunden einen Video-Editor hinzu

Bette den TutuCut-Timeline-Editor (Zuschneiden / Untertitel / Effekte / Übergänge) in jede deiner Websites ein. Besucher bearbeiten Videos direkt auf deiner Seite; konfiguriere Theme und Werkzeuge, Updates greifen automatisch und du wartest nichts.

Kopieren & einfügen · vor dem </body> deiner Website platzieren
<script src="https://tutucut.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#cc-editor" defer></script>

Ersetze pk_live_YOUR_KEY durch einen Schlüssel, den du selbst in der Konsole erstellst (jeder registrierte Nutzer, ohne Prüfung, sofort wirksam); der Container #cc-editor braucht Breite und Höhe. Registriere beim Einbinden deine Embed-URL (Whitelist; für lokale Entwicklung localhost) — es wird nur auf den von dir registrierten Seiten angezeigt.

Live ausprobieren

Klicke auf den Button unten, um den eingebetteten Video-Editor direkt auf dieser Seite auszuprobieren.

JS-API (für Callbacks / Anpassung)

<script src="https://tutucut.com/embed.js"></script>
<script>
  const cc = TutuCut.mount('#cc-editor', {
    key: 'pk_live_YOUR_KEY',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = current frame image (base64)
      upload(file.dataUrl);
    }
  });
  cc.open('https://your.site/clip.mp4'); // import a media clip
</script>

Vollständige Parameterreferenz

ParameterTypBeschreibung
keystringDein öffentlicher Schlüssel pk_ (in der Konsole erstellt). Erforderlich.
theme'auto'|'light'|'dark'Theme; auto folgt dem Hell-Dunkel-Modus von Host/System.
hideHeaderbooleanBlendet die obere Leiste aus (wenn du eigenes UI baust und über export() exportierst).
hideOpenbooleanBlendet die Schaltfläche „Medien öffnen" aus.
hideExportbooleanBlendet die Schaltfläche „Exportieren & herunterladen" aus.
saveTextstringText der Schaltfläche „Fertig" (Standard „Fertig & zurücksenden", ≤16 Zeichen).

Methoden

  • cc.open(url, name?)Importiert einen Medienclip in die Timeline (Video-/Audio-/Bild-URL oder dataURL).
  • cc.export(format?)Exportiert das aktuelle Bild → Promise<{dataUrl,mime,size}>.
  • cc.setTheme('dark')Wechselt das Theme zur Laufzeit.
  • cc.destroy()Entfernt das Widget (entfernt das iframe).

Event-Callbacks

  • onReady()Der Editor ist bereit.
  • onSave(file)Nutzer tippt auf „Fertig" → file.dataUrl ist das aktuelle Bild.
  • onError(e)e.message ist verständlich (nicht aktiviert / keine Berechtigung / Laden fehlgeschlagen).
  • onClose()Das Vollbild-Overlay wurde geschlossen.

Sicherheit · automatische Updates

  • · Self-Service, automatisch freigegeben: Jeder registrierte Nutzer erhält einen Schlüssel, indem er in der Konsole einen Site-Namen + Embed-URL registriert — sofort wirksam.
  • · Der Schlüssel ist öffentlich; Missbrauch verhindert eine Allow-/Deny-Liste registrierter URLs (Deny hat Vorrang). Nicht registrierte Domains werden mit einem Registrierungshinweis abgelehnt; du kannst jederzeit aktivieren oder deaktivieren.
  • · Echte Origin-Statistik: Jeder Ladevorgang wird nach Origin gezählt (auch blockierte); die Konsole zeigt eine Aufschlüsselung pro Origin, und nicht registrierte Domains lassen sich mit einem Klick freigeben.
  • · Der Editor läuft auf TutuCuts eigener Domain (isoliert); deine Seite kann keine TutuCut-Anmeldedaten abrufen, und die privaten Werke eines Besuchers auf TutuCut erscheinen nie im eingebetteten Widget.
  • · Das Widget wird von TutuCut selbst gehostet und automatisch aktualisiert — Funktions-Upgrades erfordern keine Code-Änderungen von dir und keinerlei Wartung.