Cuando queremos caracterizar los enlaces externos en nuestro blog Wordpress sin necesidad de utilizar ningún plugin para wordpress, lo mejor es hacer uso de CSS para de esta forma darles un toque más personal a los mismos.
Llevar a cabo la personalización de dichos enlaces es muy sencillo y basta simplemente con tener el siguiente código dentro de nuestro fichero de estilos, es decir, el fichero stlyle.css
/* enlaces externos */
a
{
padding-right: 13px;
background: url(imagenes/external.gif) no-repeat center right;
} /* emails */
a
{
padding-right: 20px;
background: url(imagenes/email.png) no-repeat center right;
}
/* tipos de ficheros */
a
{
padding-right: 18px;
background: url(imagenes/acrobat.png) no-repeat center right;
}
Una de las razones por las que se “debe” especificar los tipos de enlaces externos es para indicar al visitante que el dicho enlace lo llevará a otra página que no es la que está actualmente leyendo. Con esto facilitamos al lector la posibilidad de hacer clic o no en dicho enlace.
Me he fijado que por ejemplo en la famosa Wikipedia los enlaces externos los señalan con un icono como este , el cual me parece el más apropiado incluso para este blog.
Para destacar que el tipo de enlace a dirección de correo emplearé este otro icono y con los formatos de ficheros también se puede hacer, por ejemplo para indicar un enlace externo a fichero tipo pdf este otro icono y así podríamos seguir con cualquier otro tipo de ficheros.
Explicando un poco…:
Veamos…, existe una posibilidad que consiste en crear una clase distinta, como por ejemplo “.enlace-externo” la cual se puede aplicar a todos los enlaces que no fueran de nuestro sitio, pero eso supone añadir dicha clase a cada enlace de nuestro blog, lo que conllevaría incluso tener que modificar todos los enlaces que hemos incluido en entradas anteriores uno a uno.
La solución más adecuada pasa por utilizar selectores de atributo y CSS3. De momento no es una especificación aprobada y no todos los navegadores soportan este tipo de selectores.
Esta técnica no es compatible con Internet Explorer 6 o versiones inferiores, por lo que será ignorada, en cambio es visible en navegadores como Firefox, Safari, Opera 10 e IE7.
