Você quer exibir uma página do Notion diretamente em seu site para que os visitantes possam vê-la sem sair do seu site. O Notion oferece um recurso integrado de Compartilhar e Publicar que gera um link público e um código de incorporação para qualquer página. Este artigo explica como gerar esse código, as configurações necessárias e como colá-lo em seu construtor de sites ou CMS.
Principais Conclusões: Incorporar uma Página do Notion
- Compartilhar > Publicar > Copiar link: Gera uma URL pública que você pode incorporar com um iframe.
- Compartilhar > Publicar > Permitir duplicar como modelo: Deve estar desativado para impedir que visitantes copiem sua página.
- Código de incorporação iframe: Use
<iframe src="seu-link-publico"></iframe>no HTML do seu site.
Como Funciona a Incorporação de Páginas do Notion
O Notion não oferece um botão de incorporação com um clique. Em vez disso, você publica a página na web e depois usa a URL pública gerada dentro de um iframe HTML em seu site. A página deve estar acessível publicamente, ou seja, qualquer pessoa com o link pode visualizá-la. Você pode controlar se os visitantes podem indexar a página nos mecanismos de busca ou se podem duplicá-la como modelo.
Antes de começar, certifique-se de que sua página do Notion não seja uma página de workspace privada ou restrita a equipes que contenha informações confidenciais. Uma vez publicada, a página fica visível para qualquer pessoa que tenha o link. Você não pode proteger uma página do Notion com senha, então publique apenas conteúdo que deseja que toda a internet veja.
A página incorporada manterá sua formatação, incluindo bancos de dados, imagens e blocos de código. No entanto, elementos interativos como seletores de data ou fórmulas de rolagem podem não funcionar dentro de um iframe. A página também será responsiva, ajustando-se ao contêiner do iframe em seu site.
Passos para Incorporar uma Página do Notion em um Site
- Abra a página do Notion que deseja incorporar
Navegue até a página em seu workspace do Notion. Certifique-se de que a página esteja totalmente editada e pronta para visualização pública. - Clique no botão Compartilhar no canto superior direito
Um painel é aberto mostrando as opções de compartilhamento da página atual. - Ative o controle deslizante Compartilhar na web para Ligado
Isso torna a página acessível publicamente. Um link público aparece abaixo do controle deslizante. - Opcional: Desative Permitir duplicar como modelo
Se você não quiser que os visitantes copiem a estrutura da sua página, desmarque esta caixa. Mantenha-a marcada se quiser que outros reutilizem seu modelo. - Opcional: Ative a indexação por mecanismos de busca
Se você quiser que a página apareça nos resultados de busca do Google, marque esta caixa. Deixe desmarcada para uma incorporação privada. - Clique em Copiar link
Isso copia a URL pública para sua área de transferência. O link se parece comhttps://www.notion.so/seu-id-da-pagina. - Abra seu editor de sites ou CMS
Vá para a página ou post onde deseja incorporar a página do Notion. A maioria dos construtores de sites tem um bloco HTML personalizado ou um widget de incorporação. - Insira um iframe com a URL copiada
Cole este código no bloco HTML, substituindoSEU_LINKpela URL que você copiou:<iframe src="SEU_LINK" width="100%" height="800px" style="border:none;"></iframe>
Ajuste o valor da altura para se adequar ao seu layout. O estiloborder:noneremove a borda padrão do iframe. - Publique ou atualize seu site
Salve as alterações e visualize a página ao vivo para confirmar se a página do Notion aparece corretamente.
Problemas Comuns ao Incorporar uma Página do Notion
O iframe mostra um espaço em branco
Isso geralmente significa que a página não foi publicada. Volte ao painel Compartilhar e confirme se o controle deslizante Compartilhar na web está Ligado. Verifique também se a URL no atributo src do iframe corresponde exatamente ao link copiado, incluindo o prefixo https://.
A página incorporada está muito alta ou muito baixa
As páginas do Notion têm altura variável com base no conteúdo. Defina uma altura fixa no iframe que acomode a página inteira. Uma altura de 800px funciona para a maioria das páginas, mas você pode aumentá-la para 1200px para páginas mais longas. Se quiser que o iframe redimensione automaticamente, você precisará de JavaScript personalizado, que o Notion não suporta nativamente.
Visitantes veem uma tela de login do Notion em vez da página
Isso ocorre quando a página é compartilhada com pessoas específicas em vez de publicada na web. Certifique-se de ter usado Compartilhar na web, não a opção Adicionar pessoas. O controle deslizante Compartilhar na web deve estar Ligado para que a página possa ser incorporada.
Recursos interativos do banco de dados não funcionam na incorporação
Os bancos de dados do Notion dentro de um iframe são somente leitura. Os visitantes não podem filtrar, classificar ou adicionar novas entradas a uma visualização de banco de dados. Se precisar de interatividade, considere vincular à página do Notion ao vivo em vez de incorporá-la.
Notion Incorporado vs Link Direto: Principais Diferenças
| Item | Iframe incorporado | Link público direto |
|---|---|---|
| Experiência do usuário | A página aparece dentro do seu site sem sair | O visitante é redirecionado para o site do Notion |
| Marca | Seu site controla o layout ao redor | A interface e a barra de ferramentas do Notion ficam visíveis |
| Interatividade | Bancos de dados são somente leitura; sem edição | Funcionalidade completa do Notion, incluindo edição se as permissões permitirem |
| SEO | Mecanismos de busca podem não indexar conteúdo incorporado facilmente | A página pode ser indexada se a indexação de busca estiver ativada |
| Responsividade móvel | Escala com a largura do iframe, mas a altura é fixa | Totalmente responsivo em dispositivos móveis |
Agora você pode incorporar qualquer página do Notion em seu site usando o método iframe. Comece publicando a página no Notion e cole a URL pública em um bloco iframe no seu construtor de sites. Para uma aparência mais limpa, defina a borda do iframe como none e combine a cor de fundo com a do seu site. Se precisar de atualizações em tempo real, observe que a página incorporada refletirá automaticamente as alterações feitas no Notion sem a necessidade de republicação.