Se você utiliza o Blogger e deseja que os links de uma Lista de Links (LinkList) abram automaticamente em uma nova aba, este artigo vai te mostrar como fazer isso de forma simples, sem afetar outras partes do seu blog, como menus ou postagens.
Por que abrir os links em nova aba?
Abrir links em nova aba melhora a navegação do usuário, permitindo que ele continue no seu blog enquanto acessa outros sites. Isso é especialmente útil para listas de links externos.
Passo 1: Encontrando o ID do Gadget da Lista de Links
Cada gadget no Blogger tem um ID único. Para descobrir o ID do gadget de Lista de Links que você deseja modificar, siga estes passos:
No painel do Blogger, clique em Layout.
Encontre o gadget da Lista de Links e clique em Editar.
Observe a URL na barra de endereço do navegador. Ela terá um trecho parecido com este:
https://www.blogger.com/rearrange?blogID=123456789&action=editWidget§ionId=sidebar&widgetType=LinkList&widgetId=LinkList3O ID do gadget é o valor após
widgetId=. No exemplo acima, o ID éLinkList3.
Passo 2: Adicionando o Código ao Blogger
Agora que você sabe o ID do gadget, siga estes passos para aplicar o código:
No painel do Blogger, clique em Tema.
Clique em Editar HTML.
Dentro do código, role até encontrar a tag
<head>.Logo antes de
</head>, cole este código:
<script>
document.addEventListener("DOMContentLoaded", function() {
var listaEspecifica = document.querySelector("#LinkList3"); // Substitua pelo ID correto
if (listaEspecifica) {
var links = listaEspecifica.querySelectorAll("a");
links.forEach(function(link) {
link.setAttribute("target", "_blank"); // Abre em nova aba
link.setAttribute("rel", "noopener noreferrer"); // Segurança extra
});
}
});
</script>Substitua
LinkList3pelo ID correto do seu gadget.Clique em Salvar tema.
Passo 3: Testando a Configuração
Agora, acesse seu blog e clique nos links da Lista de Links modificada. Eles deverão abrir em uma nova aba automaticamente!
E se eu quiser aplicar a mais de uma Lista de Links?
Caso você queira que várias listas abram os links em uma nova aba, utilize o seguinte código:
<script>
document.addEventListener("DOMContentLoaded", function() {
var idsListas = ["LinkList3", "LinkList5", "LinkList7"]; // Adicione os IDs desejados
idsListas.forEach(function(id) {
var lista = document.querySelector("#" + id);
if (lista) {
var links = lista.querySelectorAll("a");
links.forEach(function(link) {
link.setAttribute("target", "_blank"); // Abre em nova aba
link.setAttribute("rel", "noopener noreferrer"); // Segurança extra
});
}
});
});
</script>Basta substituir os IDs dentro do array idsListas pelos IDs corretos das suas listas.
Com esse método, você pode garantir que apenas as Listas de Links desejadas abram em nova aba, sem interferir em outros menus ou links do seu blog. Essa abordagem melhora a experiência do usuário e facilita a navegação no seu site.
Se você gostou desse tutorial, compartilhe com outros blogueiros e deixe seu comentário! 😊
