Introdução:
Quando você compartilha um link nas redes sociais como Facebook, WhatsApp ou LinkedIn, uma prévia do conteúdo é exibida. Isso inclui o título, descrição e uma imagem associada ao link. Na Rockty, essas informações são configuradas usando o Open Graph, um protocolo que garante que sua página seja exibida de maneira visualmente atraente ao ser compartilhada. Neste guia rápido, você aprenderá a configurar a prévia da URL de forma fácil, personalizando as opções diretamente no construtor ou via script.
Acessando as Configurações do Open Graph:
Acesse o funil desejado e abra a página no construtor.
No topo do construtor, clique no menu ‘Configurações’.
Escolha a opção ‘Facebook (Open Graph)’.
Aqui você poderá configurar as informações de título, descrição e imagem que serão exibidas quando a página for compartilhada.
Como Preencher as Configurações:
Título do Post:
Insira o título que será exibido na prévia. Esse título deve ser cativante e descrever claramente o conteúdo da página.
Descrição do Post:
Escreva uma breve descrição que incentive os usuários a clicarem. Destaque o valor da página em poucas palavras.
Imagem:
Selecione uma imagem representativa. A imagem deve ter pelo menos 1200x630 pixels para garantir boa exibição nas redes sociais e no WhatsApp.
Salvar Configurações
Depois de configurar o título, descrição e imagem, clique no botão ‘Salvar’ para aplicar todas as alterações feitas.
Inserindo as Informações via Script (Opcional):
Você também pode optar por inserir as informações manualmente através de um script. Use o seguinte código no elemento de script, no header da página:
<meta property="og:title" content="Título da Página"/>
<meta property="og:description" content="Descrição da Página"/>
<meta property="og:image" content="URL da Imagem"/>
<meta property="og:url" content="URL da Página"/>
<meta property="og:type" content="website"/>
<meta property="og:site_name" content="Nome do Site"/>
og:title > Defina o título que aparecerá na prévia.
og:description > Insira uma descrição envolvente da página.
og:image > Forneça a URL da imagem (recomenda-se formato WebP e tamanho de 1200x630 pixels).
og:url > Adicione a URL da página que está sendo compartilhada.
og:type > Para páginas normais, use "website".
og:site_name > O nome do site ou marca que está sendo promovida.
💡 Dica: Para saber como inserir scripts no construtor da Rockty, veja este tutorial detalhado.
Como Obter a URL da Imagem no Construtor Rockty (Opcional):
Se você optar por usar o script, precisará da URL exata da imagem que deseja exibir na prévia. Veja como obter essa URL:
Acesse a biblioteca de imagens no construtor da Rockty.
Selecione a imagem que deseja configurar no Open Graph.
Clique com o botão direito do mouse sobre a imagem e escolha a opção “Copiar endereço da imagem”.
Use o endereço copiado para preencher o código de script do Open Graph, conforme o exemplo abaixo:
<meta property="og:image" content="https://rockfunnelsliveincluster.blob.core.windows.net/tenants/vhihTqHPmESwVD4xA4aa3A/images/3wm5p4c3N0auygoxQTq18w.webp"/>
📌 Observação: Não exclua a imagem da galeria da Rockty, pois ela precisa continuar nos servidores para que seja exibida corretamente quando a página for compartilhada.
Testando as Configurações
Após definir as informações do Open Graph, você pode verificar se estão funcionando corretamente utilizando a ferramenta Facebook Debug Tool. Siga os passos abaixo:
Publique a sua página na Rockty.
Acesse Debug Tool do Facebook.
Insira a URL da sua página e clique em ‘Depurar’.
Confira se a prévia aparece corretamente e, se necessário, force a atualização clicando em 'Extrair novamente'.
❗ Atenção: O WhatsApp pode levar mais tempo para exibir a prévia correta. Caso a prévia não apareça de imediato, aguarde alguns minutos ou tente compartilhar o link novamente.
Conclusão:
Com essas configurações, você garante que a sua página tenha uma boa apresentação visual quando for compartilhada em redes sociais. Não esqueça de ajustar a imagem de acordo com o tamanho recomendado para que ela seja aceita em todas as plataformas. Teste suas configurações no Debug Tool e garanta que os usuários vejam o melhor da sua página quando compartilharem o link!
Precisa de Ajuda?
Se tiver dúvidas ou precisar de suporte adicional, nossa equipe de suporte está à disposição para ajudar você!