TutuDocs · Componente incorporável

Uma linha de código: adicione um editor de documentos ao seu site em segundos

Incorpore o editor de documentos do TutuDocs (layout / tabelas / imagens / estrutura de tópicos) em qualquer site. Os visitantes escrevem documentos diretamente no seu site, os temas são configuráveis e as atualizações do produto se aplicam automaticamente — manutenção zero para você.

Copiar e colar — antes da tag </body> da sua página
<script src="https://tutudocs.com/embed.js"
        data-key="pk_live_YOUR_KEY"
        data-mount="#tutudocs-editor" defer></script>

Substitua pk_live_YOUR_KEY por uma chave que você mesmo gera no console (qualquer usuário registrado — sem revisão, instantâneo); o contêiner #tutudocs-editor precisa de largura e altura. Registre a URL de incorporação na configuração (lista de permissões; para desenvolvimento local use localhost); ele só aparece nos sites que você registrar.

Experimente ao vivo

Clique no botão abaixo para experimentar o editor de documentos incorporado aqui mesmo.

API JS (para retornos de chamada / personalização)

<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>

Opções de configuração completas

ParâmetroTipoDescrição
keystringSua chave pública pk_ (gerada no console). Obrigatório.
theme'auto'|'light'|'dark'Tema; auto segue o modo claro ou escuro do host/sistema.
saveTextstringTexto do botão «Concluir» (padrão «Concluir e devolver», ≤16 caracteres). Exibido na barra superior nativa do editor (ao lado de Compartilhar/Histórico).
hideSuitebooleanOculta o lançador da suíte (oculto por padrão quando incorporado para reduzir distrações).

Métodos

  • editor.export()Exporta o documento atual como .docx → Promise<{dataUrl,mime,size}>.
  • editor.setTheme('dark')Alterar o tema em tempo de execução.
  • editor.destroy()Desmonta o componente (remove o iframe).

Retornos de chamada de eventos

  • onReady()O editor está pronto.
  • onSave(file)O usuário clica em «Concluir» → file.dataUrl é o documento Word exportado (.docx).
  • onError(e)e.message está em linguagem clara (não ativado / sem permissão / falha ao carregar).
  • onClose()A sobreposição em tela cheia foi fechada.

Segurança · Atualizações automáticas

  • · Autoatendimento, aprovação automática: qualquer usuário registrado registra um nome de site + URL de incorporação no console e obtém uma chave que funciona instantaneamente.
  • · A chave é pública; uma lista de permissão/negação de URLs registradas impede o uso indevido (a lista de negação prevalece). Domínios não registrados são recusados com um aviso para registrá-los; você pode pausar ou retomar a qualquer momento.
  • · Análises de origem reais: cada carregamento é contabilizado por Origin (inclusive os bloqueados); o console mostra um detalhamento por origem, e você pode permitir um domínio não registrado com um clique.
  • · O editor é executado no próprio domínio do TutuDocs (isolado); sua página não consegue acessar nenhuma credencial do TutuDocs, e os documentos privados do TutuDocs de um visitante nunca aparecem no componente incorporado.
  • · O componente é auto-hospedado e atualizado automaticamente pelo TutuDocs —— as melhorias de recursos não exigem alterações de código do seu lado; manutenção zero.