Como abrir links externos em uma nova guia no Ghost

Quem utiliza o Ghost como padrão percebe que links externos não são abertos em novas guias, pelo contrário, ao clicar nesses links, o leitor sai do seu blog e adentra o outro conteúdo.

Para fins de análise, o leitor não fica tempo suficiente no seu blog, além de não gerar engajamento. Para contornar esse problema, muitos autores colocam os links no final do artigo, o que pode ser um martírio para o leitor, principalmente se o conteúdo for muito extenso.

Nesse tutorial vou explicar de forma simples como você pode garantir que todos os links externos no seu blog abram em uma nova guia, utilizando JavaScript. 😎

Como injetar código JavaScript

Esse método consiste em inserir um código JavaScript no rodapé (Site footer) do seu site. Ele será responsável por abrir todos os links externos em outra guia.

Passo 1: Acesso o painel administrativo do Ghost

Faça login no painel de administração do Ghost.

O link de acesso para esse painel costuma seguir essa lógica:

https://www.seublog.com.br/ghost

Passo 2: Navegue até a injeção de código

Após o login, você verá a área de administração. No rodapé esquerdo da página procure pelo ícone de Configurações (engrenagem) e clique, em seguida procure por "Code injection".

Passo 3: Adicione o código JavaScript

Na seção "Code injection", selecione a opção "Site footer". Você deverá copiar o código abaixo e colar neste campo.

<script>
  document.addEventListener('DOMContentLoaded', function() {
    var links = document.querySelectorAll('a');
    links.forEach(function(link) {
      if (link.hostname != window.location.hostname) {
        link.target = '_blank';
      }
    });
  });
</script>

Este código identificar links externos e define o atributo "target" como "_blank" garantindo que eles abram em uma nova guia.

Passo 4: Salve as configurações e teste

Depois de adicionar o código, salve as alterações. O Ghost aplicará as novas configurações e seus links externos serão abertos em uma nova guia.

Conclusão

Esse método é o mais acessível para pessoas com menor experiência com código. Porém, usuários avançados poderão alterar o próprio tema Ghost, que permitirá um maior controle e customização, adequadas as necessidades específicas.

Em geral, essa solução está adequada todos os públicos. Espero ter auxiliado.