Este é um guia para criar pré-visualizações de links ricas com o Onebox no Discourse. Ele explica como criar Oneboxes, usar o Oneboxing embutido, evitar o Oneboxing, usar hiperlinks e lidar com iFrames avançados.
Nível de usuário exigido: Todos os usuários
O Onebox converte seus links da web em trechos de pré-visualização úteis que ajudam a informar os leitores sobre o destino antes de eles clicarem.
Sumário
Este guia aborda como:
- Criar Oneboxes
- Usar Oneboxing embutido
- Evitar o Oneboxing
- Usar hiperlinks em vez de Oneboxing
- Lidar com iFrames avançados
Criando um Onebox
Para criar um Onebox, basta colar qualquer link em uma postagem em uma linha própria, assim:
https://www.google.com/
Isto resulta em:
O Onebox suporta tags oEmbed e OpenGraph gerais, e possui regras personalizadas para sites populares como Wikipedia, Twitter, Amazon, YouTube e outros.
Tente colar links em suas postagens e veja o que acontece. Apenas lembre-se que, para o Oneboxing funcionar, o link deve estar em uma linha própria!
Oneboxing Embutido
Com a configuração do site enable inline onebox on all domains (esta funcionalidade está habilitada por padrão), colar o link embutido com o texto substituirá o link bruto pelo título da página, como este Understanding Discourse Trust Levels
como este https://blog.discourse.org/2018/06/understanding-discourse-trust-levels/
Evitando Oneboxes
Se você deseja que o link apareça como um link bruto simples e sem formatação, coloque-o entre colchetes \u003c \u003e:
\u003chttps://blog.discourse.org/2018/06/understanding-discourse-trust-levels/\u003e
Alternativamente, você pode colocar um espaço antes do link ou quaisquer caracteres depois do link.
Usando hiperlinks
Você pode adicionar um link ao seu texto:
- Usando o botão de elo de corrente na barra de ferramentas do editor
- Selecionando algum texto em sua postagem e colando um link da sua área de transferência
- Adicionando links em Markdown / BBCode / HTML:
[link aqui](https://example.com)
[link=https://example.com]link aqui[/link]
\u003ca href=\"https://example.com\"\u003elink here\u003c/a\u003e
iFrames Avançados
Por padrão, \u003ciframe\u003e é bloqueado por razões de segurança. No entanto, se os iframes forem de fontes altamente confiáveis, um administrador do Discourse pode adicionar esse domínio à configuração do site allowed iframes.
Você também pode precisar colar o código de incorporação completo, como o do mapa abaixo:
\u003ciframe src=\"https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d24202.451099423397!2d-74.06201522657554!3d40.68924937923285!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25090129c363d%3A0x40c6a5770d25022b!2sStatue+of+Liberty+National+Monument!5e0!3m2!1sen!2suk!4v1533203877892\" width=\"600\" height=\"450\" frameborder=\"0\" style=\"border:0\" allowfullscreen\u003e\u003c/iframe\u003e
Isto resulta em:
\u003ciframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d24202.451099423397!2d-74.06201522657554!3d40.68924937923285!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25090129c363d%3A0x40c6a5770d25022b!2sStatue+of+Liberty+National+Monument!5e0!3m2!1sen!2suk!4v1533203877892\" width="600" height="450" frameborder="0" style="border:0" allowfullscreen\u003e\u003c/iframe\u003e
Recursos adicionais
Para mais informações e solução de problemas com o Oneboxes, visite o tópico relacionado abaixo: