Привет Всем. Сегодня я к Вам еще с одним интересным виджетом для blogger -  виджет случайные сообщения. 
Этот виджет примечательный тем,  что каждый раз, когда страница перезагружается, там показывается каждый раз новые случайные посты.  Я нашла  несколько вариантов оформления такого виджета.

Такой

Вот скрипт
<style type="text/css">
.noop-random-posts ul li {
    list-style-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzTfEIxgFsEW9DcD8OrLYwF-cG4pEnPwWMdyzBJaoTuR3XnpLQGQ3uxeKmeDd40hL3VQuq1PubA54y3w8wcoU1pG5_SAVyXhXlmfybJ-HQ0MysELIUhgYwqa_gUIQPpP9p1k7Bqn8HG9o/s1600/tick+list+style.png");
}
</style>
<div class="noop-random-posts"><script type="text/javascript">
    var randarray = new Array();var l=0;var flag;
    var numofpost=5;function nooprandomposts(json){
    var total = parseInt(json.feed.openSearch$totalResults.$t,10);
    for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
    if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
    for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
    for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
    document.write(item);}}
    }document.write('</ul>');}
    </script>
<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=nooprandomposts"></script></div>
    var numofpost=5 количество выводимых сообщений.



И такой
Вот скрипт:
<style type="text/css">
.noop-random-posts ul li {    list-style-image:none;}.noop-random-posts ul {list-style-type: none;margin: 0;padding: 5px 0;}.noop-random-posts ul li {border: 0 none;margin: 5px 0;padding: 10px;position: relative;}.noop-random-posts ul li:first-child {background: none repeat scroll 0 0 #FF4C54;width: 90%;}.noop-random-posts ul li:first-child:after {content: "1";}.noop-random-posts ul li:first-child + li {background: none repeat scroll 0 0 #FF764C;width: 87%;}.noop-random-posts ul li:first-child + li:after {content: "2";}.noop-random-posts ul li:first-child + li + li {background: none repeat scroll 0 0 #FFDE4C;width: 84%;}.noop-random-posts ul li:first-child + li + li:after {content: "3";}.noop-random-posts ul li:first-child + li + li + li {background: none repeat scroll 0 0 #C7F25F;width: 81%;}.noop-random-posts ul li:first-child + li + li + li:after {content: "4";}.noop-random-posts ul li:first-child + li + li + li + li {background: none repeat scroll 0 0 #33C9F7;width: 78%;}.noop-random-posts ul li:first-child + li + li + li + li:after {content: "5";}.noop-random-posts ul li:first-child + li + li + li + li + li {background: none repeat scroll 0 0 #7EE3C7;width: 75%;}.noop-random-posts ul li:first-child + li + li + li + li + li:after {content: "6";}.noop-random-posts ul li:first-child + li + li + li + li + li + li {background: none repeat scroll 0 0 #F6993D;width: 72%;}.noop-random-posts ul li:first-child + li + li + li + li + li + li:after {content: "7";}.noop-random-posts ul li:first-child + li + li + li + li + li + li + li {background: none repeat scroll 0 0 #F59095;width: 69%;}.noop-random-posts ul li:first-child + li + li + li + li + li + li + li:after {content: "8";}.noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li {background: none repeat scroll 0 0 #C7F25F;width: 66%;}.noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li:after {content: "9";}.noop-random-posts ul li:first-child:after, .noop-random-posts ul li:first-child + li:after, .noop-random-posts ul li:first-child + li + li:after, .noop-random-posts ul li:first-child + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li:after {background: none repeat scroll 0 0 #353535;border-radius: 50% 50% 50% 50%;color: #FFFFFF;font-size: 25px;height: 30px;position: absolute;right: -17px;text-align: center;top: 1px;width: 30px;}.noop-random-posts ul li a {color: #444444;font-size: 13px;text-decoration: none;}</style><div class="noop-random-posts"><script type="text/javascript">    var randarray = new Array();var l=0;var flag;    var numofpost=5;function nooprandomposts(json){    var total = parseInt(json.feed.openSearch$totalResults.$t,10);    for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}    if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');    for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];    for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";    document.write(item);}}    }document.write('</ul>');}    </script><a href="http://netoopsblog.blogspot.com" style="font-size:0pt">Blogger Widgets</a><script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=nooprandomposts"></script></div>

Куда вставить скрипт:

Нашла скрипты тут http://netoopsblog.blogspot.com/. Па-па

Система Orphus

28 коммент.:

  1. Когда будет побольше записей в блоге - возможно, установлю себе этот виджет :)

    ОтветитьУдалить
    Ответы
    1. :D Он пригодится вам если надумаете уменьшить показатель отказов)).

      Удалить
  2. А что это показатель отказов,Ань?

    ОтветитьУдалить
    Ответы
    1. http://studying-blogin.blogspot.com/2013/09/pokazatel-otkazov.html Это время нахождения и количество кликов посетителя блога (сайта)

      Удалить
  3. Приглашаем принять участие в нашем предновогоднем конкурсе, который проходит в инстаграмм. Победителей будет несколько!

    Подробности читайте в http://beautyselective.blogspot.ru/2013/12/parfumselective.html

    ОтветитьУдалить
  4. а можно такое, что бы под постом были изображения из статей и эти вот ссылки?

    ОтветитьУдалить
    Ответы
    1. Можно. Можно воспользоваться сервисом linkwithin http://studying-blogin.blogspot.com/2012/12/linkwithin.html а можно поковырять шаблон http://studying-blogin.blogspot.com/2013/04/soobshenie-v-miniaturax-blogpost.html. Для оптимизации лучше поковырять шаблон.

      Удалить
    2. спасибо! побежала пробывать)

      Удалить
  5. Аня подскажи плиз, а как сделать виджет похожие сообщения, как у тебя к примеру. А то я все никак не могу восстановить все, что слетело...

    ОтветитьУдалить
    Ответы
    1. Elmira скидывала чуть выше ссылки. если нужны квадратные как у меня то сделаю пост.http://studying-blogin.blogspot.com/2013/04/soobshenie-v-miniaturax-blogpost.html.

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

      Удалить
    3. Я поняла). Та ссылка что я дала тебе как раз то что ты хочешь, просто дизайн круглый, если нужны такие как у меня, то напишу пост

      Удалить
  6. Этот комментарий был удален автором.

    ОтветитьУдалить
  7. Видел данную фишку на многих блогах , а вот установил у себя благодаря вашей статье , что то подтолкнуло . Спасибо , Анна .

    ОтветитьУдалить
  8. Виджет классный, жаль, не очень вписываются оба варианта в мое оформление =(
    Буду ковыряться в коде, вдруг что придумаю ;)

    ОтветитьУдалить
  9. Анна , в данном виджете размещена ссылка открытая к индексации на другой ресурс . С Вашего блога она выдает ссылку на " Blogger Виджет " . Что бы избавиться от нее удалите из кода следующую строку : Blogger Виджет

    ОтветитьУдалить
  10. Форма отправки комментариев не дает сохранить строку ссылки . Размещена она между двумя скриптами в верхнем варианте .

    ОтветитьУдалить
    Ответы
    1. вы за это href="http://netoopsblog.blogspot.com" ? можно проста вставить свой адрес

      Удалить
  11. Зачем вам лишняя ссылка ? Просто удалите ее из кода .

    ОтветитьУдалить
  12. Какую то странную позицию Вы выбрали , у Вас , что с netoopsblog.blogspot.com договор ? Все ( по возможности ) ссылки исходящие с Вашего блога Вы закрываете , а эту отстаиваете , как родную . Я вижу , что часть ссылки убрана , но остаток кода - мусор , который просто грузит систему . И чем высказывать свое недовольство , можно было просто сказать спасибо .

    ОтветитьУдалить
  13. Встречал первый код когда-то и при попытке вставить в онлайн редактор всё зависло.Такая же история и с Вашим кодом.Повнимательнее нужно быть и при установке сторонних кодов всё же стоит их проверять в онлайн редакторах.

    ОтветитьУдалить
  14. Работает, да не всегда. То ни одно сообщение не появляется, то два или 3.

    ОтветитьУдалить
  15. Спасибо, очень полезный виджет!

    ОтветитьУдалить
  16. Спасибо, как раз искала такой виджет!

    ОтветитьУдалить

Есть вопросы? Или просто хочется поговорить? Оставляйте комментарии