TutuEdit · Widget incorporabile

Una riga di codice —aggiungi un editor di immagini al tuo sito in pochi secondi

Incorpora l'editor pro di TutuEdit (ritaglio / filtri / scontorno / testo) in qualsiasi sito web. I visitatori modificano le foto direttamente sul tuo sito; configura tema e strumenti, e gli aggiornamenti del prodotto si applicano automaticamente senza alcuna manutenzione.

Provalo dal vivo Visualizza il codice di incorporamento Genera una chiave (senza revisione)

Pronto da copiare e incollare · incollalo prima del tag </body> del tuo sito

<script src="https://tutuedit.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#dd-editor" defer></script>

Sostituisci pk_live_YOUR_KEY con la chiave pubblica che generi da solo nella console (qualsiasi utente registrato — senza revisione, immediata); il contenitore #dd-editor necessita di larghezza e altezza. Durante l'incorporamento, registra i tuoi URL di incorporamento (allowlist; per lo sviluppo locale usa localhost); viene mostrato solo sui siti che hai registrato.

Provalo dal vivo

Tocca il pulsante qui sotto per provare il editor di immagini incorporato direttamente in questa pagina.

JS API (per callback / personalizzazione)

<script src="https://tutuedit.com/embed.js"></script>
<script>
  const dd = TutuEdit.mount('#dd-editor', {
    key: 'pk_live_YOUR_KEY',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = l'immagine modificata (base64)
      upload(file.dataUrl);
    }
  });
  dd.open('https://your.site/photo.jpg'); // apri un'immagine
</script>

Configurazione completa

Parametro	Tipo	Descrizione
key	string	La tua chiave pubblica pk_ (generata nella console). Obbligatoria.
theme	'auto'\|'light'\|'dark'	Tema; auto segue la modalità chiara o scura dell'host/sistema.
hideToolbar	boolean	Nascondi la barra degli strumenti a sinistra (scenari di visualizzazione minimale / esportazione con un tocco).
hideHeader	boolean	Nascondi la barra superiore (quando crei la tua UI ed esporti tramite export()).
hideOpen	boolean	Nascondi il pulsante “Open image” (consenti immagini solo tramite dd.open).
hideExport	boolean	Nascondi il pulsante “Export & download” (usa solo “Done & send back”).
saveText	string	Etichetta del pulsante “Done” (predefinito “Done & send back”, ≤16 caratteri).
exportFormat	'png'\|'jpg'\|'webp'	Formato di esportazione al completamento.
exportQuality	number 0..1	Qualità JPG/WebP.

Metodi

dd.open(url, name?)Apri un'immagine nell'editor (url o dataURL).
dd.export(format?, quality?)Esporta il risultato corrente → Promise<{dataUrl,mime,size}>.
dd.setTheme('dark')Cambia tema a runtime.
dd.destroy()Smonta il widget (rimuove l'iframe).

Callback degli eventi

onReady()L'editor è pronto.
onSave(file)L'utente tocca “Done” → file.dataUrl è il risultato modificato.
onError(e)e.message è leggibile dall'utente (disabilitato / non autorizzato / caricamento non riuscito).
onClose()L'overlay a schermo intero è stato chiuso.

Sicurezza · Aggiornamenti automatici

· Self-service, approvazione automatica: qualsiasi utente registrato registra un nome sito + URL di incorporamento nella console per ottenere una chiave, effettiva immediatamente.
· La chiave pubblica è pubblica; è protetta da elenchi di autorizzazione/blocco degli URL registrati contro l'uso improprio (la blocklist prevale); le richieste da domini non registrati vengono rifiutate con un invito a registrarsi; attiva/disattiva in qualsiasi momento.
· Analisi dell'origine reale: ogni caricamento viene conteggiato per Origin (anche quelli bloccati); la console mostra una ripartizione per origine e i domini non registrati possono essere aggiunti all'allowlist con un tocco.
· L'editor viene eseguito sul dominio di proprietà di TutuEdit (isolato); la tua pagina non può accedere ad alcuna credenziale TutuEdit e le opere private TutuEdit dei visitatori non appaiono mai nel widget.
· Il widget è self-hosted e aggiornato automaticamente da TutuEdit — gli aggiornamenti delle funzionalità non richiedono modifiche al codice da parte tua, manutenzione zero.