TutuEdit · Widget incorporável

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

Incorpore o editor profissional do TutuEdit (recorte / filtros / recorte de fundo / texto) em qualquer site. Os visitantes editam fotos direto no seu site; configure o tema e as ferramentas, e as atualizações do produto são aplicadas automaticamente, sem manutenção.

Experimente ao vivo Ver código de incorporação Gerar uma chave (sem revisão)

Pronto para copiar e colar · cole-o antes do </body> do seu site

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

Substitua pk_live_SUA_CHAVE pela chave pública que você mesmo gera no console (qualquer usuário registrado — sem revisão, instantâneo); o contêiner #dd-editor precisa de largura e altura. Ao incorporar, registre suas URLs de incorporação (lista de permissões; para desenvolvimento local use localhost); ele só é exibido nos sites que você registrou.

Experimente ao vivo

Toque no botão abaixo para experimentar o editor de imagens incorporado nesta mesma página.

JS API (para callbacks / personalização)

<script src="https://tutuedit.com/embed.js"></script>
<script>
  const dd = TutuEdit.mount('#dd-editor', {
    key: 'pk_live_SUA_CHAVE',
    theme: 'auto',            // auto | light | dark
    onSave: (file) => {
      // file.dataUrl = a imagem editada (base64)
      upload(file.dataUrl);
    }
  });
  dd.open('https://your.site/photo.jpg'); // abrir uma imagem
</script>

Configuração completa

Parâmetro	Tipo	Descrição
key	string	Sua chave pública pk_ (gerada no console). Obrigatório.
theme	'auto'\|'light'\|'dark'	Tema; auto segue o modo claro ou escuro do host/sistema.
hideToolbar	boolean	Oculta a barra de ferramentas à esquerda (cenários de visualização minimalista / exportação com um toque).
hideHeader	boolean	Oculta a barra superior (quando você cria sua própria UI e exporta via export()).
hideOpen	boolean	Oculta o botão “Abrir imagem” (só permite imagens via dd.open).
hideExport	boolean	Oculta o botão “Exportar e baixar” (use apenas “Concluir e devolver”).
saveText	string	Texto do botão “Concluir” (padrão “Concluir e devolver”, ≤16 caracteres).
exportFormat	'png'\|'jpg'\|'webp'	Formato de exportação ao concluir.
exportQuality	number 0..1	Qualidade JPG/WebP.

Métodos

dd.open(url, name?)Abre uma imagem no editor (url ou dataURL).
dd.export(format?, quality?)Exporta o resultado atual → Promise<{dataUrl,mime,size}>.
dd.setTheme('dark')Alterna o tema em tempo de execução.
dd.destroy()Desmonta o widget (remove o iframe).

Callbacks de eventos

onReady()O editor está pronto.
onSave(file)O usuário toca em “Concluir” → file.dataUrl é o resultado editado.
onError(e)e.message é legível para humanos (desativado / sem autorizaçã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 para obter uma chave, efetiva instantaneamente.
· A chave pública é pública; ela é protegida por listas de URLs registradas de permissão/bloqueio contra uso indevido (a lista de bloqueio prevalece); solicitações de domínios não registrados são rejeitadas com um aviso para registrar; ative ou desative quando quiser.
· Análise de origem real: cada carregamento é contabilizado por Origin (os bloqueados também); o console mostra um detalhamento por origem, e domínios não registrados podem ser adicionados à lista de permissões com um toque.
· O editor roda no próprio domínio do TutuEdit (isolado); sua página não consegue acessar nenhuma credencial do TutuEdit, e as obras privadas do TutuEdit dos visitantes nunca aparecem no widget.
· O widget é auto-hospedado e atualizado automaticamente pelo TutuEdit — melhorias de recursos não exigem alterações de código do seu lado, zero manutenção.