Hiển thị avatar người viết bài bên cạnh tiêu đề bài viết

Thủ thuật blog sẽ hướng dẫn các bạn thêm bên cạnh tiêu đề bài viết avatar của người viết bài. Việc hiển thị avatar này giúp mọi người dễ dàng nhận biết nhận xét của người viết bài khi người đó viết nhận xét. Ngoài ra nếu blog bạn có nhiều cộng tác viên viết bài thì nó giúp phân biệt những người viết bài khác nhau. 
Thủ thuật rất hay phải không?
Và đây là hình demo:

Và tất nhiên việc hiển thị avatar này là hoàn toàn tự động, sẽ tự cập nhật nếu người viết bài thay đổi avatar.


Bước 1: Thêm đoạn mã dưới đây vào trước thẻ ]]></b:skin> trong template của bạn.

.avatar-author{float:left;margin-right:10px;border:0;border-radius:50%;padding:0;width:30px;height:30px}

Bước 2: Thêm đoạn mã dưới đây vào trước thẻ </head> trong template của bạn.

<script>
//<![CDATA[
function av(a){var b=a.entry.author[0];c=b.name.$t;d=b.gd$image.src.replace(/\/s[0-9]+(-*c*)\//,'/s30$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}
//]]>
</script>

Bước 3: Tìm thẻ <b:if cond='data:post.title'> và thêm vào trước nó đoạn mã dưới đây: 

<script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;amp;callback=av&quot;'/>

Ở bước 3 cần tìm đúng thẻ <b:if cond='data:post.title'> dành cho phiên bản web, có thể nó là thẻ thứ 2 khi tìm kiếm.

Chúc các bạn thành công!