При описании стиля для дружественных ссылок возник вопрос по автоматическому добавлению соответствующего favicon. Совместными усилиями с r1mson и aam β-развитием этой темы стал javacript добавляющий к ссылкам favicon с сайта на который они ссылаются.
Скрипт размещается в шаблоне HTML перед закрывающим тегом </body>:
<script type='text/javascript'>
//<![CDATA[
var allUrls = document.evaluate(
'//div[contains(@class,"favicon")]//a[count(img)=0]',
document,
null,
XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
null);
for (i = 0; i < allUrls.snapshotLength; i++) {
var thisUrl = allUrls.snapshotItem(i);
var urlHref = thisUrl.getAttribute('href');
if (urlHref) {
urlHref = urlHref.replace(/^(.*:\/\/[^\/]*).*/, '$1/favicon.ico');
thisUrl.setAttribute('style', 'padding-left:20px;text-indent:0px;background-position:left center;background-repeat:no-repeat;background-size:16px;background-image:url('+urlHref+');');
}
}
//]]>
</script>
<!-- Добавить перед этим тегом -->
</body>
Скрипт будет действовать на ссылки, которые находятся внутри элементов со стилем favicon.
Для более точного указания области действия необходимо поставить флажок 'Расширить шаблоны виджета'. После этого найти нужные виджеты и добавить стиль favicon.
Для содержимого статьи:
<div class='post-body entry-content favicon'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Для общих новостей:
<b:widget id='HTML1' locked='false' title='Общие записи' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content favicon'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
После этого проверяем. Если Ваши ссылки ведут на сайты с favicon, то выглядеть они будут примерно так:

Известные ошибки:
* если у сайта нет favicon.ico, то перед ссылкой будет 20 пикселей пустого места.
Особенности:
* для ссылок содержащих картинки, favicon добавляться не будет,
* кавычки, если есть, должны входить в состав ссылки.
Скрипт размещается в шаблоне HTML перед закрывающим тегом </body>:
//<![CDATA[
var allUrls = document.evaluate(
'//div[contains(@class,"favicon")]//a[count(img)=0]',
document,
null,
XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
null);
for (i = 0; i < allUrls.snapshotLength; i++) {
var thisUrl = allUrls.snapshotItem(i);
var urlHref = thisUrl.getAttribute('href');
if (urlHref) {
urlHref = urlHref.replace(/^(.*:\/\/[^\/]*).*/, '$1/favicon.ico');
thisUrl.setAttribute('style', 'padding-left:20px;text-indent:0px;background-position:left center;background-repeat:no-repeat;background-size:16px;background-image:url('+urlHref+');');
}
}
//]]>
</script>
<!-- Добавить перед этим тегом -->
</body>
Скрипт будет действовать на ссылки, которые находятся внутри элементов со стилем favicon.
Для более точного указания области действия необходимо поставить флажок 'Расширить шаблоны виджета'. После этого найти нужные виджеты и добавить стиль favicon.
Для содержимого статьи:
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Для общих новостей:
<b:widget id='HTML1' locked='false' title='Общие записи' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content favicon'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
После этого проверяем. Если Ваши ссылки ведут на сайты с favicon, то выглядеть они будут примерно так:

* если у сайта нет favicon.ico, то перед ссылкой будет 20 пикселей пустого места.
Особенности:
* для ссылок содержащих картинки, favicon добавляться не будет,
* кавычки, если есть, должны входить в состав ссылки.
2 комментария:
>> * для ссылок ведущих с картинок тоже будет добавлен favicon.
Без картинок:
//div[contains(@class,"favicon")]//a[count(img)=0]
Спасибо, поправил.
Отправить комментарий