Links Classifier – links mais bonitos

Esse é um plugin simples e muito útil. O Links Classifier analisa todos os links em posts e comentários e aplica nomes de classes CSS de acordo com a URL do link. Isso permite criar um arquivo CSS para dar um tratamento particular a cada “tipo” de link. Veja como ele funciona:

  • Se é uma URL absoluta e completa, o protocolo vira nome de classe (http, https, ftp, etc.)
  • Se é um link para um arquivo (para ver ou baixar), a extensão do arquivo vira nome de classe (doc, htm, mpeg, etc.)
  • Se trata-se de um link para uma página do blog, a classe “internal” é adicionada, senão “external”
  • Se o atributo TARGET está definido para “_blank”, a classe “blank” é adicionada, senão “self”
  • Se o link é uma âncora, a classe “anchor” é adicionada
  • Se é um link para um e-mail, a classe “mailto” é adicionada
  • Se é um link para executar um Javascript, a classe “javascript” é adicionada

Assim, um link como

<a href="http://www.seublog.com/2007/" target="_blank">

seria impresso assim:

<a href="http://www.seublog.com/2007/" target="_blank" class="http internal blank">

Aí basta organizar seu CSS para usar o sistema. Exemplo:

/* Links Classifier */

a.pdf, a.doc, a.rtf, a.zip,
a.internal, a.external,
a.javascript, a.mailto {
padding-right:14px;
background-position:right;
background-repeat:no-repeat;
}
a.external {
background-image:url(images/links/external.gif);
}
a.internal {
background-image:url(images/links/internal.gif);
}
a.pdf {
background-image:url(images/links/pdf.png);
}
a.doc, a.rtf {
background-image:url(images/links/doc.png);
}
a.zip, a.rar, a.gz, a.tar, a.gzip {
background-image:url(images/links/zip.png);
}
a.javascript {
background-image:url(images/links/javascript.gif);
}
a.mailto {
background-image:url(images/links/mailto.gif);
}

O título desse post fala em “links + bonitos”, mas mais importante que isso é que seus links ficam mais amigáveis e informativos, permitindo ao usuário leigo reconhecer imediatamente se aquele link leva a outra página do blog, a um site externo, se abre em uma nova janela, se é um link para download, etc.

Enfim é um recurso que aumenta o grau de usabilidade de seu site.
O pacote também inclui alguns ícones para usar como imagens de fundo nos links.

Clique para fazer o download

Compartilhe o artigo com um colega!
Imagem padrão
Cau
Artigos: 11

Deixe uma resposta