TutuDocs · Componente incorporabile
Una riga di codice — aggiungi un editor di documenti al tuo sito in pochi secondi
Incorpora l'editor di documenti TutuDocs (impaginazione / tabelle / immagini / struttura) in qualsiasi tuo sito web. I visitatori scrivono documenti direttamente sul tuo sito, i temi sono configurabili e gli aggiornamenti del prodotto si applicano automaticamente — zero manutenzione per te.
Copia e incolla — prima del tag
</body> della tua pagina <script src="https://tutudocs.com/embed.js"
data-key="pk_live_YOUR_KEY"
data-mount="#tutudocs-editor" defer></script> Sostituisci pk_live_YOUR_KEY con una chiave che generi tu stesso nella console (qualsiasi utente registrato — senza revisione, immediata); il contenitore #tutudocs-editor deve avere larghezza e altezza. Registra il tuo URL di incorporamento durante la configurazione (elenco consentiti; per lo sviluppo locale usa localhost); appare solo sui siti che registri.
Provalo dal vivo
Fai clic sul pulsante qui sotto per provare il editor di documenti incorporato proprio qui.
JS API (per callback / personalizzazione)
<script src="https://tutudocs.com/embed.js"></script>
<script>
const editor = TutuDocs.mount('#tutudocs-editor', {
key: 'pk_live_YOUR_KEY',
theme: 'auto', // auto | light | dark
onSave: (file) => {
// file.dataUrl = the exported Word document (.docx, base64)
upload(file.dataUrl);
}
});
// After the user clicks Done, onSave returns the .docx; or call it directly:
// const { dataUrl } = await editor.export();
</script>Configurazione completa dei parametri
| Parametro | Tipo | Descrizione |
|---|---|---|
| key | string | La tua chiave pubblica pk_ (generata nella console). Obbligatoria. |
| theme | 'auto'|'light'|'dark' | Tema; auto segue la modalità chiara/scura dell'host/sistema. |
| saveText | string | Etichetta del pulsante «Fine» (predefinito «Completa e rinvia», ≤16 caratteri). Mostrata nella barra superiore nativa dell'editor (accanto a Condividi/Cronologia). |
| hideSuite | boolean | Nascondi il launcher della suite (nascosto per impostazione predefinita quando incorporato, per ridurre le distrazioni). |
Metodi
editor.export()Esporta il documento corrente come .docx → Promise<{dataUrl,mime,size}>.editor.setTheme('dark')Cambia tema a runtime.editor.destroy()Smonta il componente (rimuove l'iframe).
Callback di eventi
onReady()L'editor è pronto.onSave(file)L'utente fa clic su «Fine» → file.dataUrl è il documento Word esportato (.docx).onError(e)e.message è in linguaggio comprensibile (non abilitato / senza permesso / caricamento fallito).onClose()L'overlay a schermo intero è stato chiuso.
Sicurezza · Aggiornamenti automatici
- · Self-service, approvazione automatica: qualsiasi utente registrato inserisce nella console un nome del sito + URL di incorporamento e ottiene una chiave che funziona immediatamente.
- · La chiave è pubblica; la protezione dagli abusi si basa su un elenco consentiti/bloccati di URL registrati (l'elenco bloccati prevale). I domini non registrati vengono rifiutati con un invito a registrarsi; puoi sospendere o riprendere in qualsiasi momento.
- · Statistiche reali sulle origini: ogni caricamento è conteggiato per Origin (inclusi quelli bloccati); la console mostra un dettaglio per origine e puoi aggiungere un dominio non registrato all'elenco consentiti con un clic.
- · L'editor gira sul dominio proprio di TutuDocs (isolato); la tua pagina non può accedere ad alcuna credenziale di TutuDocs e i documenti privati di TutuDocs del visitatore non compaiono mai nel componente incorporato.
- · Il componente è self-hosted e aggiornato automaticamente da TutuDocs — i miglioramenti delle funzionalità non richiedono modifiche al codice da parte tua; zero manutenzione.