Виджет вращающихся сообщений блога Blogspot



Установка в блог виджета сообщений с возможностью настройки показывать ранее опубликованные посты

!!! В связи с перенаправлением блогов блоггер по протоколу HTTPS с шифрованием, скрипт не работает.

Установка и настройка виджета вращающихся постов блогаЗдравствуйте дорогие посетители! Сегодня я предлагаю Вам виджет сообщений для блога, с небольшим секретом. Секрет в том, что у  кого в блоге написано уже много постов, в настройках кода мы сможем настроить показ ранее опубликованных записей, что несомненно позволит уменьшить показатель отказов.  А так же можем периодически изменять показ записей, исправив всего одну цифру. 


Виджет покажет сообщения из двух частей: в верхней части будет отображаться один пост вместе с названием (ссылка), именем автора, датой публикации и кратким содержанием начала записи. В нижней части будет виден список выбранных Вами постов. 

Виджет легко установить с помощью нашего Html/JavaScript:  в черновике blogger-дизайн-добавить гаджет. Пример смотрите в этом блоге справа над гаджетом Ярлыки.

Итак копируем вот такой код

<style>
.gfg-root {
width: 300px;
height : auto;
position : relative;
overflow : hidden;
margin: 0 auto;
text-align : center;
font-size: 12px;
border: 1px solid #DBDBDB;
}
.gfg-title {
font-size: 12px;
font-weight : bold;
color : #0e5198;
background:#F3F3F3;
background-repeat: repeat;
line-height : 1.4em;
overflow : hidden;
white-space : nowrap;
padding: 5px;
text-shadow: 0px 2px #fff;
}
.gfg-entry {
background-color: #FFFFFF;
width : 300px;
height : 9.2em;
position : relative;
overflow : hidden;
text-align : left;
margin-top : 3px;
}
.gf-title a {
text-transform: capitalize;
color: #0e5198;
font-size: 12px;
}
.gfg-subtitle {
display: none;
}
.gfg-list {
position : relative;
overflow : hidden;
text-align : left;
}
.gfg-listentry {
line-height : 1.5em;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
padding-left : 15px;
padding-right : 5px;
}
.gfg-listentry-odd {
background-color : #F3F3F3;
border-bottom : 1px dotted #8B5A2B;
padding: 5px;
}
.gfg-listentry-even {
background-color : #F3F3F3;
border-bottom : 1px dotted #8B5A2B;
padding: 5px;
}
.gfg-listentry-odd a{
color: #595959;
padding: 0 0px 0 10px;
}
.gfg-listentry-even a{
color: #242424;
padding: 0 0px 0 10px;
}
.gfg-listentry-highlight {
background: #FFFFFF;
}
.gfg-listentry-highlight:before {
position: absolute;
left: 0;
content: '\25BA ';
font-size: 14px;
color: #0e5198;
}
.gfg-listentry-highlight a {
color: #242424;
}
.gfg-root .gfg-entry .gf-result {
position : relative;
background-color: #ffffff;
width : auto;
height : 100%;
padding-left : 20px;
padding-right : 5px;
}
.gfg-root .gfg-entry .gf-result .gf-title {
font-size: 12px;
line-height : 1.2em;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
margin-bottom : 2px;
margin-top: 5px;
}
.gfg-root .gfg-entry .gf-result .gf-snippet {
height : 3.8em;
color: #444444;
margin-top : 3px;
}
.clearFloat {
clear : both;}</style>
<script src="http://www.google.com/jsapi" type="text/javascript"></script><script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>
<script type="text/javascript">
function showGadget() {var feeds = [{title:'List',url:'http://www.bdblogov.ru/feeds/posts/default?redirect=false&start-index=1&max-results=12'},];
new GFdynamicFeedControl(feeds, 'feedGadget',{title: 'Первые посты в блоге', numResults :8, displayTime : 5000, hoverTime : 500});} google.load("feeds", "1");
google.setOnLoadCallback(showGadget);
</script>
<div id="feedGadget">Loading...</div>



Настройки основные:  font-size: 12px;-размер шрифта; width: 300px;-ширина; color : #0e5198;-цвет названия виджета и цвет ссылки; color: #0e5198;-цвет стрелки; http://www.bdblogov.ru-URL Вашего блога; numResults :8-количество сообщений (должно быть равным); 

start-index=1-это число указывает, какой из Ваших постов будет первым в списке. В коде число 1, это последняя опубликованная Вами запись. Но если Вы захотите показать более ранние записи, то поставьте число 100, к примеру. У меня настроено от 153-ей записи.  

displayTime : 5000-время задержки между постами в миллисекундах; hoverTime : 500-минимальное время для сообщения в списке, которое будет отображаться в верхней части.


Надеюсь, что ничего не забыла. Да, проверила в браузерах Опера, Yandex, Google, Mozilla Firefox, все работает. На этом у меня все. Всего Вам Доброго. Делитесь с друзьями, оставляйте отзывы, комментируйте. 


Автор статьи ✎ Olga Protasova Выпуск ✹ 3/17/2014 Ярлыки ►


Открыть комментарии →

0 коммент. :

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


 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *