Como Incorporar um Espaço do Perplexity em um Site
🔍 WiseChecker

Como Incorporar um Espaço do Perplexity em um Site

Você quer exibir um Espaço do Perplexity diretamente no seu site para que os visitantes pesquisem sua base de conhecimento curada sem sair da página. Os Espaços do Perplexity permitem organizar fontes, prompts e instruções personalizadas em um ambiente de busca focado. Incorporar um Espaço usa um código iframe que carrega a interface do Espaço dentro do seu site. Este artigo explica como gerar o código de incorporação, ajustar sua aparência e adicioná-lo à sua página.

Principais conclusões: Incorporar um Espaço do Perplexity

  • Menu Compartilhar do Espaço > Copiar código de incorporação: Gera um snippet iframe para o seu Espaço.
  • Atributos de largura e altura no iframe: Controla como o Espaço aparece na sua página.
  • Configuração de visibilidade do Espaço como Público: Seu Espaço deve estar definido como Público para que a incorporação funcione.

ADVERTISEMENT

O que é um Espaço do Perplexity e por que incorporá-lo

Um Espaço do Perplexity é um ambiente de busca curado onde você define as fontes, instruções e área de foco. Você pode adicionar URLs, enviar documentos e definir prompts personalizados. Quando alguém pesquisa dentro de um Espaço, o Perplexity retorna respostas limitadas às fontes que você forneceu.

Incorporar um Espaço coloca essa interface dentro de uma página da web. Os visitantes podem digitar perguntas e obter respostas sem sair do seu site. Isso é útil para hubs de documentação, bases de conhecimento, páginas de suporte ao cliente ou wikis internos.

Antes de incorporar, você precisa de uma conta Perplexity Pro. O Espaço deve estar definido como Público. Você também precisa ter acesso ao código HTML do seu site ou a uma plataforma que suporte iframes.

Passos para obter o código de incorporação de um Espaço do Perplexity

  1. Abra seu Espaço no Perplexity
    Faça login na sua conta do Perplexity. Navegue até o Espaço que deseja incorporar. O Espaço já deve ter fontes adicionadas e estar salvo.
  2. Clique no botão Compartilhar
    No canto superior direito da página do Espaço, clique no ícone Compartilhar. Ele se parece com uma corrente de link ou uma seta saindo de uma caixa.
  3. Defina a visibilidade do Espaço como Público
    No menu Compartilhar, encontre a configuração de visibilidade. Altere de Privado para Público. Um Espaço Público é necessário para incorporação. Espaços Privados não podem ser incorporados.
  4. Copie o código de incorporação
    Após definir o Espaço como Público, o menu Compartilhar exibe uma opção chamada Copiar código de incorporação. Clique nela. O código é um snippet iframe que se parece com isto: <iframe src="https://www.perplexity.ai/s/..." width="100%" height="600"></iframe>. A URL contém um identificador único para o seu Espaço.
  5. Cole o código no seu site
    Abra o editor HTML do seu construtor de sites, CMS ou template de página. Cole o código iframe onde deseja que o Espaço apareça. Salve e publique a página.

Ajustar a largura e altura do iframe

O código de incorporação padrão usa width="100%" e height="600". Você pode alterar esses valores para se adequar ao seu layout. Para uma barra lateral, use width="300". Para uma seção de página inteira, use width="100%" e height="800". A altura é em pixels. Teste o Espaço em dispositivos móveis para garantir que o iframe não transborde.

Adicionar borda ou estilização

Você pode envolver o iframe em uma div com estilização CSS. Por exemplo, adicione uma borda, cantos arredondados ou uma sombra. Aqui está um exemplo:

<div style="border:1px solid #ccc;border-radius:12px;overflow:hidden;">
  <iframe src="https://www.perplexity.ai/s/SEU_ID_DO_ESPACO" width="100%" height="600" style="border:none;"></iframe>
</div>

O style="border:none;" dentro do iframe remove a borda padrão do iframe. A div externa fornece a borda visível e os cantos arredondados.

ADVERTISEMENT

Problemas comuns ao incorporar um Espaço do Perplexity

O Espaço não aparece na página

Se o iframe mostrar uma área em branco, verifique se o Espaço está definido como Público. Abra o menu Compartilhar novamente e confirme a visibilidade. Verifique também se a URL do iframe está correta. A URL deve começar com https://www.perplexity.ai/s/. Se você copiou o link errado, repita os passos acima.

O Espaço mostra um prompt de login

Um prompt de login aparece quando o Espaço é Privado ou quando o código de incorporação foi copiado antes de tornar o Espaço Público. Volte ao Espaço, altere a visibilidade para Público e copie o código de incorporação novamente. Substitua o código iframe antigo no seu site pelo novo.

O iframe é muito pequeno em telas móveis

Navegadores móveis podem cortar ou encolher o iframe. Defina a largura como 100% e use uma altura responsiva. Adicione uma media query CSS para aumentar a altura em telas pequenas:

@media (max-width: 600px) {
  .perplexity-embed iframe {
    height: 800px;
  }
}

Substitua .perplexity-embed pelo nome da classe da sua div container.

O Espaço carrega lentamente

Os Espaços do Perplexity carregam conteúdo dinamicamente. Se o iframe demorar mais que alguns segundos, verifique sua conexão com a internet. O próprio Espaço pode ter muitas fontes ou documentos grandes. Reduza o número de fontes no Espaço para melhorar o tempo de carregamento.

Comparação: Incorporação de Espaço do Perplexity vs Link Direto

Item Iframe Incorporado Link Direto
Experiência do usuário Permanece no seu site Abre uma nova aba
Personalização Ajustar largura, altura, borda, estilização Nenhum controle sobre a aparência
Requer Espaço Público Sim Sim
Impacto SEO Mecanismos de busca indexam a URL do iframe, não o conteúdo interno Mecanismos de busca indexam a página do Espaço separadamente
Compatibilidade móvel Funciona com CSS responsivo Funciona nativamente no navegador móvel

Agora você pode incorporar um Espaço do Perplexity em qualquer site que suporte iframes. Use o menu Compartilhar para copiar o código de incorporação após tornar o Espaço Público. Ajuste a largura e altura para corresponder ao layout da sua página. Para uma aparência polida, envolva o iframe em uma div estilizada. Se o Espaço não aparecer, verifique a configuração de visibilidade e a URL do iframe.

ADVERTISEMENT