С увеличением популярности твиттера в России в рунете расплодилось немало всяких скриптов и виджетов для твиттера. Один виджет привлёк моё внимание, о чём ниже и поговорим.
Виджет хорошоший, анимированный и очень гибкий. Работает от одного js, который лежит на хостинге у разработчика. Это и будет ссылка на первоисточник , а то скажут, мол присваивает чужие разработки себе, негодяй...
Небольшое отступление.
Нафига это нужно? Можно виджет повесить в сайдбар, можно на отдельную страницу к которой будет вести кнопка твиттера с главной, можно сделать совсем круто - подцепить виджет в выдвигающуюся панель...
Теперь смотрим демку:
И начинаем разбор полётов.
Первое, что нужно сделать - это сделать нехорошую вещь: скачать по вышеприведённой ссылке скрипт, исправить в нём все внешние ссылки (и одну надпись "Join to conversation"), которые любят оставлять авторы сервисов и положить на свой, повторяю, НА СВОЙ, хостинг.
Если не знаете, как пользоваться блокнотом, можете скачать мною исправленный скрипт здесь. Своих ссылок я "туды не сувал", можно смело качать. И, да, потом кладите на свой хостинг.
Код выглядит так (кладите в свой блог, куда хотите):
<div class="twitter">
<script src="http://ВАШ_ХОСТИНГ/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'search',
search: 'НАЗВАНИЕ_УЧЁТКИ_В_ТВИТТЕРЕ',
interval: 6000,
title: '',
subject: 'НАЗВАНИЕ_УЧЁТКИ_В_ТВИТТЕРЕ в прямом эфире',
width: 'auto',
height: 300,
theme: {
shell: {
background: '#ff751f',
color: '#ffffff'
},
tweets: {
background: '#ffffff',
color: '#ff751f',
links: '#1fcdff'
}
},
features: {
scrollbar: false,
loop: true,
live: true,
hashtags: true,
timestamp: true,
avatars: true,
toptweets: true,
behavior: 'default'
}
}).render().start();
</script></div>Настройки.
Цвета рамки виджета, ссылок и постов:
theme: {
shell: {
background: '#ff751f',
color: '#ffffff'
},
tweets: {
background: '#ffffff',
color: '#ff751f',
links: '#1fcdff'
}
},Названия html цветов можете взять здесь, покрутив колёсико.В этом блоке задаются размеры (ширина стоит авто (сама подстраивается), высота в 300 пикселей):
width: 'auto', height: 300,
Во features настраивается поведения твитов: убран скролбар, поставлена закольцованность, включены автарки и т.п.
Постового нет, а в качестве бонуса оставляю вот такую картинку:


Комментариев нет:
Отправить комментарий