Pasang Avatar Mybloglog di Kotak Komentar

Tutorial cara memasang avatar mybloglog di kotak komentar sebenarnya sudah lama, tapi dari beberapa kali saya berkunjung ke beberapa blog Teman, jarang sekali yang mengaplikasikannya.



Padahal menurut saya, tutorial memasang avatar di kotak komentar yang di populerkan oleh Amanda ini sangat bagus, karena kita bisa melihat wajah yang memberi komentar dengan syarat telah menjadi member mybloglog. Saran saya buat teman yang sudah ikutan mybloglog, sebelum komentar di blog saya sebaiknya ganti dulu foto yang lama dengan foto terbaik milik teman




Langsung saja, seperti biasa login terlebih dahulu ke blogger.



1. Buat yang belum mendaftar, jangan lupa untuk daftar dulu di mybloglog.



2. Kemudian pada halaman blogger, klik Rancangan.



3. Pilih Edit HTML.




4. Klik Download Template Lengkap, untuk jaga-jaga !



5. Lalu Centang Expand Widget Template.



6. Kemudian letakkan kode berikut diatas kode </head>

<script type='text/javascript'>


//<![CDATA[

/*

Merlinox and Napolux MyBlogLog Avatar Creator

created by Merlinox (blog.merlinox.com)

helped by Napolux (www.napolux.com)

version 0.1 (20061214)

version 0.2 (20061215)

compatible with all blogger blog


*/

if(typeof(myLayer)!='function'){

function myLayer (x){

//individuo l'oggetto

if(document.layers){ // browser="NN4";

lay=document.layers[x];

}

if(document.all){ // browser="IE";

lay=eval("document.all." + x);


}

if(!document.all && document.getElementById){ // browser="NN6+ or IE5+ if you're willing to dump the !document.all stuff";

lay=document.getElementById(x);

}

return lay;

}

}

//lo prendo da blogger


function myBlogAvatar(codiceCommento,autore,stile){

//scrivo lo span

//var myBlogSpan = "myBlog-" + codiceCommento;

//document.write("<span id='" + myBlogSpan + "'><i>myBlogLog...</i></span>");

//metto tutto minuscolo perchè indexOf è case sensitive

if (autore != ""){


alt="MyBlogLog: " + autore;

myBlog = "<a target='_blank' href=\"http://www.mybloglog.com/buzz/co_redir.php?href=" + autore + "\" rel='nofollow'><img src=\"http://pub.mybloglog.com/coiserv.php?href=" + autore + "\" alt=\"" + alt + "\" title=\"" + alt + "\" border=\"1\" class=\"myBlogAvatar\"></a>";

//myLayer(myBlogSpan).innerHTML = myBlog + myLayer(myBlogSpan).innerHTML;

//myLayer(myBlogSpan).innerHTML = myBlog;

document.write(myBlog);

}

}


//]]>

</script>

7. Setelah itu cari kode seperti dibawah ini :

<b:loop values='data:post.comments' var='comment'>

8. Kemudian letakkan kode berikut tepat setelah kode <b:loop values='data:post.comments' var='comment'> :

<div style='border:0;float:left;margin: 0 5px 0 0;'>


<script>

myBlogAvatar('<data:comment.id/>','<data:comment.authorUrl/>');

</script>

</div>

Untuk kode yang berwarna MERAH adalah jarak gambar dengan garis pinggir template, silahkan di otak-atik sendiri ya




Selamat Mencoba