Похожие статьи для блога

Я в своем блоге использовала 

linkwithin, но там есть постоянная ссылка на этот сайт. Мне это не очень нравиться, тк может в будущем уводить моих читателей. Поэтому меня заинтересовал вот этот вариант.

Делаем резервное копирование шаблона, затем нажимаем изменить шаблон. Ищем (как писала в первом посте) 

<data:post.body/>

после него вставляем код:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class='similiar'>

<div class='widget-content'>

<br/>

<div id='data2007840981'/>

<div id='data2007840980'/><br/>

<script type='text/javascript'>

var headerN = "Похожие статьи:"; /* Заголовок виджета, когда в нём отображается более чем одна метка. */

var header1 = "Еще статьи из категории \"__LABEL__\":"; /* Заголовок виджета, когда в нём отображается одна метка. Если в заголовке есть слово __LABEL__, то вместо него будет подставлено имя метки. */

var header0 = ""; /* Текст, выводимый, если нет ни одной метки и ссылки. */

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;; /* Адрес блога, откуда берём список постов. */

var maxNumberOfPostsPerLabel = 5; /* Максимальное число постов, отображаемых для каждой метки. */

var maxNumberOfLabels = 4; /* Максимальное число отображаемых меток. */

var excludeEmptyLabels = true; /* Скрывать ли метки, для которых нет подходящих постов. true - скрывать, false - отображать. */

var excludeLabels = []; /* Метки, которые не следует отображать. */

/* Смена отображаемых имён.

Здесь перечисляем соответствия реального имени метки и названия, которое будет показано на странице.

Если для двух меток указать одно название, они при отображении склеятся в одну метку.

Если метка здесь не перечисляется, то отображается под своим настоящим названием.

*/

var renameLabels = {};

function is_in(item, array) {

for (k in array)

if (array[k] == item) return true;

return false;

}

function label_title(label) {

if (renameLabels[label])

return renameLabels[label];

return label;

}

totalLabels = 0;

receivedReplies = 0;

var receivedItems = [];

var k_label;

function labelReceived() {

receivedReplies++;

if (receivedReplies != totalLabels)

return;

var labelCount = 0;

for (k_label in receivedItems) {

var items = receivedItems[k_label];

if (items.length == 0 &amp;&amp; excludeEmptyLabels)

continue;

labelCount++;

}

var labelCount1 = 0;

for (k_label in receivedItems) {

var items = receivedItems[k_label];

if (items.length == 0 &amp;&amp; excludeEmptyLabels)

continue;

var ul = document.createElement(&#39;ul&#39;);

var itemsCount = 0;

for (var k_item in items) {

item = items[k_item];

var li = document.createElement(&#39;li&#39;);

var a = document.createElement(&#39;a&#39;);

a.href = item.href;

var txt = document.createTextNode(item.title);

a.appendChild(txt);

li.appendChild(a);

ul.appendChild(li);

itemsCount++;

if (itemsCount == maxNumberOfPostsPerLabel)

break;

}

var txt = document.createTextNode(k_label);

var h = document.createElement(&#39;b&#39;);

h.appendChild(txt);

var div1 = document.createElement(&#39;div&#39;);

if (!(labelCount == 1 &amp;&amp; header1.search &amp;&amp; header1.search(/(LABEL)/) != -1))

div1.appendChild(h);

div1.appendChild(ul);

document.getElementById(&#39;data2007840980&#39;).appendChild(div1);

labelCount1++;

if (labelCount1 == maxNumberOfLabels)

break;

}

var txt;

if (labelCount == 1 &amp;&amp; header1)

txt = document.createTextNode(header1.replace("__LABEL__", k_label));

else if (labelCount)

txt = document.createTextNode(headerN);

else if (header0)

txt = document.createTextNode(headerN);

if (txt)

{

var h = document.createElement("h4");

h.appendChild(txt);

document.getElementById(&#39;data2007840981&#39;).appendChild(h);

}

}

function receiveReply_123(json) {

var label = "";

for (var l = 0; l &lt; json.feed.link.length; l++) {

if (json.feed.link[l].rel == &#39;alternate&#39;) {

var raw = json.feed.link[l].href;

var label = raw.substr(homeUrl3.length+13);

var k;

for (k=0; k&lt;20; k++)

label = label.replace(&quot;%20&quot;, &quot; &quot;);

label = decodeURI(label);

break;

}

}

var labelTitle = label_title(label);

if (typeof receivedItems[labelTitle] != "object")

receivedItems[labelTitle] = [];

for (var k in json.feed.entry) {

var entry = json.feed.entry[k];

var href = "";

for (var kl in entry.link) {

if (entry.link[kl].rel == "alternate") {

href = entry.link[kl].href;

break;

}

}

if(href != "" &amp;&amp; href != location.href) {

var item = { "href" : href, "title" : entry.title.$t};

receivedItems[labelTitle].push(item);

}

}

labelReceived();

}

function sendQueryForLabel(query, label) {

var script = document.createElement(&#39;script&#39;);

script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;

+ label +

&#39;?alt=json-in-script&amp;callback=receiveReply_123&#39;);

script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);

document.documentElement.firstChild.appendChild(script);

}

var parsedlabels = [];

var labelsCount = 0;

function list_items(textLabel) {

if (labelsCount &gt;= maxNumberOfLabels ||

is_in(textLabel, excludeLabels) ||

is_in(textLabel, parsedlabels)) {

labelReceived();

return;

}

labelsCount++;

parsedlabels.push(textLabel);

sendQueryForLabel(homeUrl3, textLabel);

}

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

totalLabels++;

</b:loop>

</b:loop>

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

list_items(&quot;<data:label.name/>&quot;);

</b:loop>

</b:loop>

</script>

</div>

</div>

</b:if>

 А дальше можем изменить то, что нас не устраивает и сохранить.

 

Можно использовать другой код (Все, что было раньше делаем также, только код другой)

 

<b:if cond='data:blog.pageType == "item"'>

<div class='similiar'>

<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->

<!-- *****************Related Articles by Labels - Take Two****************** -->

<!--

Modifiedby JackBook.Com to make it easier to use.

1. Now, users don't need to change anything to use this widget. just copy and paste, and done!

2. The current article will also be listed, now it's no more.

-->

<div class='widget-content'>

<h3>Related Posts by Categories</h3>

<div id='data2007'/><br/><br/>

<div id='hoctro'>

Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>

</div>

<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;

var maxNumberOfPostsPerLabel = 4;

var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;

maxNumberOfLabels = 3;

function listEntries10(json) {

var ul = document.createElement(&#39;ul&#39;);

var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?

json.feed.entry.length : maxNumberOfPostsPerLabel;

for (var i = 0; i &lt; maxPosts; i++) {

var entry = json.feed.entry[i];

var alturl;

for (var k = 0; k &lt; entry.link.length; k++) {

if (entry.link[k].rel == &#39;alternate&#39;) {

alturl = entry.link[k].href;

break;

}

}

var li = document.createElement(&#39;li&#39;);

var a = document.createElement(&#39;a&#39;);

a.href = alturl;

if(a.href!=location.href) {

var txt = document.createTextNode(entry.title.$t);

a.appendChild(txt);

li.appendChild(a);

ul.appendChild(li);

}

}

for (var l = 0; l &lt; json.feed.link.length; l++) {

if (json.feed.link[l].rel == &#39;alternate&#39;) {

var raw = json.feed.link[l].href;

var label = raw.substr(homeUrl3.length+13);

var k;

for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);

var txt = document.createTextNode(label);

var h = document.createElement(&#39;b&#39;);

h.appendChild(txt);

var div1 = document.createElement(&#39;div&#39;);

div1.appendChild(h);

div1.appendChild(ul);

document.getElementById(&#39;data2007&#39;).appendChild(div1);

}

}

}

function search10(query, label) {

var script = document.createElement(&#39;script&#39;);

script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;

+ label +

&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);

script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);

document.documentElement.firstChild.appendChild(script);

}

var labelArray = new Array();

var numLabel = 0;

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

textLabel = &quot;<data:label.name/>&quot;;

var test = 0;

for (var i = 0; i &lt; labelArray.length; i++)

if (labelArray[i] == textLabel) test = 1;

if (test == 0) {

labelArray.push(textLabel);

var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?

labelArray.length : maxNumberOfLabels;

if (numLabel &lt; maxLabels) {

search10(homeUrl3, textLabel);

numLabel++;

}

}

</b:loop>

</b:loop>

</script>

</div>

</div>

</b:if>

Виджеты на определенной странице

отображать виджеты в Blogger на определённой странице. Я не совсем еще поняла, не получается. Вот на будущее, разберусь.

Только на внутренних страницах:

<b:if cond='data:blog.pageType == "item"'>

2.

содержимое виджета/код

3.

</b:if>

Только на статических страницах:

<b:if cond='data:blog.pageType == "static_page"'>

2.

содержимое виджета/код

3.

</b:if>

Только на архивных страницах:

<b:if cond='data:blog.pageType == "archive"'>

2.

содержимое виджета/код

3.

</b:if>

Только на главной (домашней) странице:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

2.

содержимое виджета/код

3.

</b:if>

Только на страницах ярлыков/тегов (labels):

<b:if cond='data:blog.searchLabel'>

2.

содержимое вижета/код

3.

</b:if>

На определённой странице:

<b:if cond='data:blog.url == "url_страницы"'>

2.

содержимое виджета/код

3.

</b:if>

Дополнительное условие:

"!=" - означающее кроме.

Например, показывать на всех страницах, кроме указанной:

<b:if cond='data:blog.url != "url_страницы"'>

2.

содержимое виджета/код

3.

</b:if>

Или показывать виджет везде, кроме главной:

<b:if cond='data:blog.url != data:blog.homepageUrl'>

2.

содержимое виджета/код

3.

</b:if>

сделать так, чтобы виджет отображался на странице с определенным ярлыком

код html/javascript виджета (HTML7)

<b:widget id='HTML7' locked='false' title='' type='HTML'>

<b:includable id='main'>

<b:if cond='data:blog.searchLabel == &quot;сервисы&quot;'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content'>

<data:content/>

</div>

</b:if>

</b:includable>

</b:widget>

Где в строке:

<b:if cond='data:blog.searchLabel == &quot;сервисы&quot;'> сервисы - это ярлык в вашем блоге.

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

Следовательно:

<b:if cond='data:blog.searchLabel == &quot;название_ярлыка&quot;'>содержимое виджета/код</b:if> позволяет отображать виджет на заданном ярлыке.

b:if cond='data:blog.searchLabel == "сервисы"' - это к сожалению не подходит. тут показывается виджет на странице ярлыка а не на странице самого поста. (взято здесь - http://blogger.omg-linux.ru/2011/11/widgets-in-custom-place-of-blogger.html )

Код для галереи

/*!

* jQuery Cycle Lite Plugin

* http://malsup.com/jquery/cycle/lite/

* Copyright (c) 2008-2012 M. Alsup

* Version: 1.7 (20-FEB-2013)

* Dual licensed under the MIT and GPL licenses:

* http://www.opensource.org/licenses/mit-license.php

* http://www.gnu.org/licenses/gpl.html

* Requires: jQuery v1.3.2 or later

*/

;(function($) {

"use strict";

var ver = 'Lite-1.7';

var msie = /MSIE/.test(navigator.userAgent);

$.fn.cycle = function(options) {

return this.each(function() {

options = options || {};

if (this.cycleTimeout)

clearTimeout(this.cycleTimeout);

this.cycleTimeout = 0;

this.cyclePause = 0;

var $cont = $(this);

var $slides = options.slideExpr ? $(options.slideExpr, this) : $cont.children();

var els = $slides.get();

if (els.length < 2) {

if (window.console)

console.log('terminating; too few slides: ' + els.length);

return; // don't bother

}

// support metadata plugin (v1.0 and v2.0)

var opts = $.extend({}, $.fn.cycle.defaults, options || {}, $.metadata ? $cont.metadata() : $.meta ? $cont.data() : {});

var meta = $.isFunction($cont.data) ? $cont.data(opts.metaAttr) : null;

if (meta)

opts = $.extend(opts, meta);

opts.before = opts.before ? [opts.before] : [];

opts.after = opts.after ? [opts.after] : [];

opts.after.unshift(function(){ opts.busy=0; });

// allow shorthand overrides of width, height and timeout

var cls = this.className;

opts.width = parseInt((cls.match(/w:(\d+)/)||[])[1], 10) || opts.width;

opts.height = parseInt((cls.match(/h:(\d+)/)||[])[1], 10) || opts.height;

opts.timeout = parseInt((cls.match(/t:(\d+)/)||[])[1], 10) || opts.timeout;

if ($cont.css('position') == 'static')

$cont.css('position', 'relative');

if (opts.width)

$cont.width(opts.width);

if (opts.height && opts.height != 'auto')

$cont.height(opts.height);

var first = 0;

$slides.css({position: 'absolute', top:0}).each(function(i) {

$(this).css('z-index', els.length-i);

});

$(els[first]).css('opacity',1).show(); // opacity bit needed to handle reinit case

if (msie)

els[first].style.removeAttribute('filter');

if (opts.fit && opts.width)

$slides.width(opts.width);

if (opts.fit && opts.height && opts.height != 'auto')

$slides.height(opts.height);

if (opts.pause)

$cont.hover(function(){this.cyclePause=1;}, function(){this.cyclePause=0;});

var txFn = $.fn.cycle.transitions[opts.fx];

if (txFn)

txFn($cont, $slides, opts);

$slides.each(function() {

var $el = $(this);

this.cycleH = (opts.fit && opts.height) ? opts.height : $el.height();

this.cycleW = (opts.fit && opts.width) ? opts.width : $el.width();

});

if (opts.cssFirst)

$($slides[first]).css(opts.cssFirst);

if (opts.timeout) {

// ensure that timeout and speed settings are sane

if (opts.speed.constructor == String)

opts.speed = {slow: 600, fast: 200}[opts.speed] || 400;

if (!opts.sync)

opts.speed = opts.speed / 2;

while((opts.timeout - opts.speed) < 250)

opts.timeout += opts.speed;

}

opts.speedIn = opts.speed;

opts.speedOut = opts.speed;

opts.slideCount = els.length;

opts.currSlide = first;

opts.nextSlide = 1;

// fire artificial events

var e0 = $slides[first];

if (opts.before.length)

opts.before[0].apply(e0, [e0, e0, opts, true]);

if (opts.after.length > 1)

opts.after[1].apply(e0, [e0, e0, opts, true]);

if (opts.click && !opts.next)

opts.next = opts.click;

if (opts.next)

$(opts.next).unbind('click.cycle').bind('click.cycle', function(){return advance(els,opts,opts.rev?-1:1);});

if (opts.prev)

$(opts.prev).unbind('click.cycle').bind('click.cycle', function(){return advance(els,opts,opts.rev?1:-1);});

if (opts.timeout)

this.cycleTimeout = setTimeout(function() {

go(els,opts,0,!opts.rev);

}, opts.timeout + (opts.delay||0));

});

};

function go(els, opts, manual, fwd) {

if (opts.busy)

return;

var p = els[0].parentNode, curr = els[opts.currSlide], next = els[opts.nextSlide];

if (p.cycleTimeout === 0 && !manual)

return;

if (manual || !p.cyclePause) {

if (opts.before.length)

$.each(opts.before, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });

var after = function() {

if (msie)

this.style.removeAttribute('filter');

$.each(opts.after, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });

queueNext(opts);

};

if (opts.nextSlide != opts.currSlide) {

opts.busy = 1;

$.fn.cycle.custom(curr, next, opts, after);

}

var roll = (opts.nextSlide + 1) == els.length;

opts.nextSlide = roll ? 0 : opts.nextSlide+1;

opts.currSlide = roll ? els.length-1 : opts.nextSlide-1;

} else {

queueNext(opts);

}

function queueNext(opts) {

if (opts.timeout)

p.cycleTimeout = setTimeout(function() { go(els,opts,0,!opts.rev); }, opts.timeout);

}

}

// advance slide forward or back

function advance(els, opts, val) {

var p = els[0].parentNode, timeout = p.cycleTimeout;

if (timeout) {

clearTimeout(timeout);

p.cycleTimeout = 0;

}

opts.nextSlide = opts.currSlide + val;

if (opts.nextSlide < 0) {

opts.nextSlide = els.length - 1;

}

else if (opts.nextSlide >= els.length) {

opts.nextSlide = 0;

}

go(els, opts, 1, val>=0);

return false;

}

$.fn.cycle.custom = function(curr, next, opts, cb) {

var $l = $(curr), $n = $(next);

$n.css(opts.cssBefore);

var fn = function() {$n.animate(opts.animIn, opts.speedIn, opts.easeIn, cb);};

$l.animate(opts.animOut, opts.speedOut, opts.easeOut, function() {

$l.css(opts.cssAfter);

if (!opts.sync)

fn();

});

if (opts.sync)

fn();

};

$.fn.cycle.transitions = {

fade: function($cont, $slides, opts) {

$slides.not(':eq(0)').hide();

opts.cssBefore = { opacity: 0, display: 'block' };

opts.cssAfter = { display: 'none' };

opts.animOut = { opacity: 0 };

opts.animIn = { opacity: 1 };

},

fadeout: function($cont, $slides, opts) {

opts.before.push(function(curr,next,opts,fwd) {

$(curr).css('zIndex',opts.slideCount + (fwd === true ? 1 : 0));

$(next).css('zIndex',opts.slideCount + (fwd === true ? 0 : 1));

});

$slides.not(':eq(0)').hide();

opts.cssBefore = { opacity: 1, display: 'block', zIndex: 1 };

opts.cssAfter = { display: 'none', zIndex: 0 };

opts.animOut = { opacity: 0 };

opts.animIn = { opacity: 1 };

}

};

$.fn.cycle.ver = function() { return ver; };

// @see: http://malsup.com/jquery/cycle/lite/

$.fn.cycle.defaults = {

animIn: {},

animOut: {},

fx: 'fade',

after: null,

before: null,

cssBefore: {},

cssAfter: {},

delay: 0,

fit: 0,

height: 'auto',

metaAttr: 'cycle',

next: null,

pause: false,

prev: null,

speed: 1000,

slideExpr: null,

sync: true,

timeout: 4000

};

})(jQuery);

Динамическая шапка блога

Шаг 1. Подготовка изображений.

1.1 Продумайте какую анимацию Вы хотите создать, подберите подходящие фото. Обработайте их а той программе, к которой Вы привыкли.

Например, в моей анимации слайды это коллажи из трёх изображений украшений. Изображения в виде квадратов, поэтому я заранее сделала коллажи в программе Пикасса с соотношеним сторон 3:1, чтобы не искажать картинки.

2.1 Измените размер Ваших слайдов до необходимого.

Например, у меня ширина блога 1100 пикселей, соответсвенно слайды мне нужны были 1050 пикселей, с высотой в три раза меньше - 350 пикселей.

Шаг 2. Создание GIFF анимации в программе Photoshop.

2.1 Откройте Фотошоп. Файл - создать - ширина 1050, высота 350, фон прозрачный.

2.2 Создайте столько копий фона, сколько слайдов будет в Вашем слайд-шоу. Для этого в меню слои, зажав левой кнопкой слой Фон перетащите его на значок чистого листа (создать новый фон).

У меня 3 слоя.

2.4 Делаем активным первый слой, нажав на нем в меню слои (слева)

Файл - Поместить - Выбираем первый подготовленный файл - Ввод.

Благодаря тому, что мы файлы уже подготовили по размеру, изображение идеально помещается на слой.

Делаем активным второй слой, помещаем туда второе изображение и т.д.

2.5 Переходим в режим Движение.

Окно - Рабочая среда - Движение

2.6 Нажимаем Create Video Timeline.

Видим такое окно:

2.7 Далее путем перетаскивания слайдов по шкале времени создаем нашу анимацию. Для просмотра промежуточных результатов можно нажать Воспроизведение.

У меня получилось так:

2.8 Сохраняем???

Файл - Сохранить для Web и устройств.

Проверяем параметры анимации. Формат файла - GIFF. Параметры повторов - я выбрала постоянно.

2.9 Проверяем полученный файл на диске компьютера. Нравится? :)

Обратите внимание, что файл очень маленького размера. У меня около 600 КБ, и это анимация!!!

Шаг 3. Размещение слайд-шоу в Blogger.

3.1 Откройте ваш блог - Настроить - Дизайн - Добавить гаджет - Изображение

3.2 Пишем название, загружаем изображение, указываем ссылку (если хотите). Сохраняем :)

3.3 В меню Дизайн перетаскиваем наш гаджет на необходимую позицию в блоге. Нажимаем Сохранить расположение.

http://www.anna-miracle.com/2013/11/blog-post_25.html

Последние комментарии на блог

Виджет последние комментарии на блог:

Добавить гаджет - HTML/JavaScript:

<style type="text/css">

ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}

.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}

.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}

.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}

.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}

.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}

</style>

<script type="text/javascript">

//<![CDATA[

// Recent Comments Settings

var

numComments = 45,

showAvatar = true,

avatarSize = 60,

roundAvatar = true,

characters = 140,

defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",

hideCredits = true;

//]]>

</script>

<script src="http://bloggerndch.googlecode.com/files/w2b-recent-comments-w-gravatar.js.txt" type="text/javascript">

</script>

<script src="http://blogodel.comURL ВАШЕГО БЛОГА/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=ВСТАВЬТЕ ЦИФРУ КОММЕНТАРИЕВ" type="text/javascript">

</script>

Для черного блога:

<style type="text/css">

ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}

.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;font-size: 13px;}

.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}

.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}

.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}

.w2b_recent_comments li span{margin-top:4px;color: #ffffff;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}

</style>

<script type="text/javascript">

//<![CDATA[

// Recent Comments Settings

var

numComments = 45,

showAvatar = true,

avatarSize = 60,

roundAvatar = true,

characters = 140,

defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",

hideCredits = true;

//]]>

</script>

<script src="http://bloggerndch.googlecode.com/files/w2b-recent-comments-w-gravatar.js.txt" type="text/javascript">

</script>

<script src="URL ВАШЕГО БЛОГА/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=10" type="text/javascript">

</script>

И вариант без аватарок:

<div style="padding: 0px 0px 0px 20px; color: #343f4a"><script type="text/javascript">

//<![CDATA[

var comsmaxamostrar = 7;

var comslongitud = 60;

function showrecentcomments(json) {

var entry, comulr, comcontent, salida;

for (var i=0;i<comsmaxamostrar;i++) {

entry = json.feed.entry[i];

if (i==json.feed.entry.length)break;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

comulr=entry.link[k].href;

break;

}

}

comulr=comulr.replace("#","#");

if ("content" in entry){

comcontent = entry.content.$t;

} else if("summary" in entry) {

comcontent = entry.summary.$t;

} else {

comcontent = "";

}

var re=/<\S[^>]*>/g;

comcontent=comcontent.replace(re,"");

if (comcontent.length>comslongitud) {

comcontent = comcontent.substring(0,comslongitud) + " &hellip;";

}

salida = "<li style='list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz7N1OZ2oxH92Uj4-8q1x2S2Z3NpeiexmqLHfx05ju_STlubjDKAEtbWrFOdDuu88k8o2oC1XxgA-1rx3nycCRUXU-Rk7f3VbT1P0hI_sClTmYacFQw5__wOdArlqJ-6rcD4hLQwavrP2k/s1600/komment.png);>";

salida += "<span class='simgvaga001'></span><b>" + entry.author[0].name.$t + "</b><br />";

salida += "<a rel='nofollow' href='" + comulr + "'>" + comcontent +"</a>";

salida += "</li>";

document.write(salida );

}

}

//]]>

</script>

<ul id="poslednie-comment"><script src="URL ВАШЕГО БЛОГА/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script></ul></div>

 Источник: 

http://blogodel.com/2012/11/vidzhet-kommentarii-blogger-blogspot.html