Você quer exibir uma página do Notion ao vivo no site da sua empresa ou blog, mas o conteúdo incorporado não é atualizado automaticamente quando você edita a página de origem no Notion. Por padrão, as incorporações do Notion são iframes estáticos que exigem uma atualização manual do navegador para mostrar alterações. Este artigo explica como configurar uma incorporação de página do Notion com atualização automática em um site externo usando o recurso de compartilhamento público do Notion e uma ferramenta de incorporação de terceiros.
Principais Conclusões: Incorporação de Página do Notion com Atualização Automática em Site Externo
- Notion Compartilhar > Publicar > Copiar Link: Gera uma URL pública que pode ser incorporada em sites externos; sem esta etapa, a incorporação não será exibida.
- Embed.pub ou ferramenta similar: Envolve a URL da página do Notion em um iframe com um intervalo de atualização configurável para forçar atualizações a cada N segundos ou minutos.
- CSS personalizado e configurações de intervalo de atualização: Ajuste a aparência da incorporação e defina o tempo de atualização automática para corresponder à frequência de atualização do seu conteúdo.
Como Funciona a Incorporação de Páginas do Notion e Por Que a Atualização Automática é Necessária
O Notion permite que você compartilhe qualquer página publicamente por meio de uma URL única. Quando você incorpora essa URL pública em um site externo usando um iframe padrão, o navegador carrega um instantâneo estático da página. O Notion não envia atualizações em tempo real para iframes incorporados. Isso significa que os visitantes veem a versão da página que existia no momento do carregamento da incorporação. Quaisquer edições feitas no Notion após esse ponto permanecem invisíveis até que o visitante atualize manualmente a aba do navegador.
A atualização automática resolve isso forçando o iframe a recarregar sua URL de origem em um intervalo definido. A atualização não vem do Notion em si. Em vez disso, um serviço de incorporação de terceiros ou um pequeno script JavaScript no seu site recarrega o conteúdo do iframe periodicamente. O intervalo de atualização deve corresponder à frequência com que o conteúdo da sua página do Notion muda. Uma atualização de 30 segundos funciona para painéis ou páginas de status. Uma atualização de 5 minutos é adequada para documentação ou wikis de equipe.
Pré-requisitos para Configurar a Atualização Automática
Antes de começar, confirme que você tem o seguinte:
- Um espaço de trabalho do Notion com acesso de editor ou administrador à página que deseja incorporar.
- A capacidade de publicar a página publicamente. Os planos Free, Plus, Business e Enterprise do Notion suportam compartilhamento público de páginas.
- Acesso ao código HTML do site externo onde a incorporação aparecerá. Se você usa um CMS como WordPress ou Squarespace, precisa de um bloco HTML personalizado ou um plugin de incorporação de iframe.
- Um serviço de incorporação de terceiros ou a capacidade de adicionar um pequeno trecho de JavaScript ao seu site. Este guia usa o Embed.pub como exemplo porque oferece um nível gratuito e configuração simples.
Passos para Configurar uma Incorporação de Página do Notion com Atualização Automática em um Site Externo
Siga estes passos para publicar sua página do Notion, gerar um código de incorporação com atualização automática e colocá-lo em seu site externo.
- Publique a página do Notion publicamente
Abra a página do Notion que deseja incorporar. Clique no botão Compartilhar no canto superior direito da página. Em Compartilhar na web, ative a opção para Ligado. Clique em Copiar link para copiar a URL pública. Essa URL termina com uma longa sequência alfanumérica. Guarde este link para o próximo passo. - Abra a página pública do Notion em um navegador para testá-la
Cole a URL copiada em uma nova aba do navegador e pressione Enter. Confirme se a página carrega corretamente e mostra todo o conteúdo que deseja incorporar. Se a página parecer errada, volte ao Notion e ajuste o layout ou as permissões antes de continuar. - Acesse o site Embed.pub
Navegue até embed.pub no seu navegador. Este serviço converte qualquer URL em um iframe incorporável com atualização automática, dimensões personalizadas e opções de CSS. Nenhuma conta ou pagamento é necessário para uso básico. - Cole a URL pública do Notion no Embed.pub
Na página inicial do Embed.pub, localize o campo de entrada rotulado Enter URL. Cole a URL pública do Notion que você copiou no passo 1. A ferramenta tentará carregar uma prévia da página. - Configure as configurações de incorporação
Abaixo da entrada de URL, você verá várias opções. Defina Width como100%ou um valor fixo em pixels como800. Defina Height como um valor que se ajuste ao seu layout, por exemplo600. Em Auto Refresh, insira o intervalo de atualização em segundos. Para um painel que atualiza a cada 30 segundos, insira30. Para um wiki de equipe que muda a cada hora, insira3600. Deixe o campo CSS em branco, a menos que queira substituir a estilização da página do Notion. - Gere o código de incorporação
Clique no botão Generate Embed. O Embed.pub exibe um trecho de iframe HTML. O trecho contém um atributosrcapontando para uma URL do Embed.pub que envolve sua página do Notion. Também inclui o parâmetro de intervalo de atualização. - Copie o código de incorporação gerado
Selecione todo o trecho HTML e copie para a área de transferência. O trecho se parece com isto:<iframe src="https://embed.pub/seu-id-unico?refresh=30" width="100%" height="600" frameborder="0"></iframe>. - Cole o código de incorporação no seu site externo
Abra o editor de páginas do seu site externo. Se você usa WordPress, adicione um bloco HTML personalizado e cole o trecho. Se usa Squarespace, use um bloco Código. Se edita arquivos HTML brutos, cole o trecho onde deseja que a incorporação do Notion apareça. Salve ou publique a página. - Teste o comportamento de atualização automática
Abra seu site externo em uma aba do navegador. Observe a incorporação do Notion. Faça uma pequena edição na página original do Notion, como alterar uma palavra ou adicionar uma nova linha. Volte ao seu site externo e aguarde o intervalo de atualização que você definiu. Após o intervalo, a incorporação deve recarregar e mostrar o conteúdo atualizado. Se não funcionar, verifique se a página do Notion ainda está publicada publicamente e se a URL de incorporação está correta.
Se a Incorporação do Notion Não Atualizar Automaticamente ou Exibir Incorretamente
Vários problemas comuns podem impedir a atualização automática ou fazer com que a incorporação seja exibida incorretamente. Abaixo estão os problemas mais frequentes e como resolvê-los.
A Incorporação Mostra uma Caixa Branca Vazia
Uma incorporação em branco geralmente significa que a página do Notion não está publicada publicamente. Volte à página do Notion, clique em Compartilhar e confirme se a opção Compartilhar na web está Ligado. Verifique também se você copiou a URL pública, não a URL interna do espaço de trabalho do Notion. A URL interna começa com notion.so/nome-do-espaco/ e não funcionará em sites externos.
A Incorporação Carrega, Mas Nunca Atualiza
Se a incorporação carregar a página uma vez, mas não atualizar, o intervalo de atualização automática pode estar definido como zero ou o serviço de incorporação pode não suportar atualização automática no nível gratuito. Volte ao Embed.pub e confirme se você inseriu um número positivo no campo Auto Refresh. Se estiver usando um serviço de incorporação diferente, verifique se ele suporta o parâmetro refresh ou fornece uma configuração semelhante.
A Incorporação Mostra uma Tela de Login do Notion
Isso acontece quando a página do Notion não foi publicada publicamente. Apenas páginas públicas podem ser incorporadas em sites externos. Se você precisa incorporar uma página que contém dados confidenciais, considere usar o recurso de incorporação oficial do Notion dentro de outra página do Notion. Esse cenário não suporta atualização automática em sites externos.
O Intervalo de Atualização Automática é Muito Curto e Causa Problemas de Desempenho
Definir um intervalo de atualização abaixo de 10 segundos pode causar alto uso de CPU no dispositivo do visitante e pode acionar limites de taxa no serviço de incorporação. Para a maioria dos casos de uso, um intervalo de 30 segundos a 5 minutos oferece um bom equilíbrio entre atualização e desempenho. Se seu conteúdo muda constantemente, considere usar um serviço em tempo real como a API do Notion com WebSocket em vez de uma incorporação de iframe.
Opções de Incorporação de Página do Notion Comparadas
| Item | Incorporação Padrão do Notion (iframe) | Embed.pub com Atualização Automática |
|---|---|---|
| Método de atualização | Atualização manual do navegador | Automática em intervalo definido |
| Tempo de configuração | 2 minutos | 5 minutos |
| Custo | Gratuito | Nível gratuito disponível |
| CSS personalizado | Não suportado | Suportado via Embed.pub |
| Faixa de intervalo de atualização | N/A | 10 segundos a 24 horas |
| Requer serviço de terceiros | Não | Sim |
Agora você pode incorporar uma página do Notion ao vivo e com atualização automática em qualquer site externo. Comece publicando sua página do Notion publicamente, depois use uma ferramenta de incorporação de terceiros como o Embed.pub para envolver a URL com um parâmetro de atualização automática. Teste a incorporação no seu site e ajuste o intervalo de atualização com base na frequência com que seu conteúdo muda. Para controle avançado, considere usar a API do Notion para criar uma incorporação personalizada com atualizações via WebSocket em vez de polling periódico.