Как поставить значок к ссылкам

В прошлой статье я показывал, как выводить фавикон для внешних ссылок.
В этой заметке посмотрим на прикольный jQuery скриптик link_external_icon.js, который прилепит любой значок к ссылке, что позволит выделить её на ковре монотонного текста. Скрипт ставит картинку лишь в том случае, если найдёт target="_blank", что считается, в принципе, внешней ссылокой (хотя мы привыкли прописывать этот атрибут для любых ссылок, чтобы, не дай Бог, не потерять пользователя и не ростить проценты отказов).

Демка:


Use Яндекс !!!

Установка:
1) Да-да, jQuery, она самая.
2) Перед тегом (в шаблоне блога) /head подключить основной скрипт:

<script type="text/javascript" src="link_external_icon.js"></script>

Качаем здесь. "Ложим" на внешний хостинг =).
3) И скрипт настроек:

<script language="javascript" type="text/javascript">
$(function() {
$("body").link_external_icon({
icon_path:"http://3.bp.blogspot.com/-xiJ93PnzOdE/T2A9IBhYBqI/AAAAAAAAJV0/Oj97mQAv8MQ/s1600/external.gif"
});
});
</script>

Где:
icon_path:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpwgxrsendFqAcjxqC_Dj7is70DjJv2hErCtkx1q3wuv3xcMC7kF6e2nS_pPBhnko0jhyphenhypheng0YWo9ltikyybZUq7ub7CJP-L1cNBN37DLmY2o04kFZZsgAvuEC7M04rW0ThJN347pXf8-4A/s1600/external.gif" - это путь к картинке-иконке для ссылки.
"body" - обрабатываемая область.

На самом деле, указывание body - очень грубый ход. Скрипт обработает счётчики и любые другие области, где задействован атрибут target. Поэтому надо правильно определить область поста в шаблоне блога. Например, у меня это .itemtext.
В статье "Превращаем все текстовые ссылки Youtube в видеоклипы" я уже писал об этом.

А если вы ищите бесплатные иконки для сайта, то советую заглянуть и почитать статью FindIcons – огромная база иконок для сайта.

По поводу халявных постовых читаем здесь, раздача продолжается.

Источник разработки.