Pasang Avatar disamping Nama Author

Sebelumnya saya berbagi Cara Pasang Image disamping Judul Artikel dan Cara Pasang Avatar Author disamping Judul Artikel :q; yang sekarang masih tetap pada Avatar cuma penempatannya disamping Nama Author atau Admin :q; 

Nama Admin [pemilik Blog] biasanya diikuti dengan tanggal dan waktu posting yang penempatannya dibawah Judul atau dibawah Isi Artikel :r; 

Kalau kawan ingin memasangnya di Blog Kodenya hampir sama dengan Cara Pasang Avatar Author disamping Judul Artikel, yang beda cuma ukurannya :y; kalau ditempatkan dibawah Judul ukurannya lebih kecil disebabkan memakai huruf lebih kecil sedangkan kalau dibawah Isi Artikel ukurannya sedikit lebih besar dibandingkan yang lainnya :x; 

Cara membuatnya :

• Seperti biasa masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML
• Cari tag  ]]></b:skin> 
• Kalau sudah ketemu hapus atau ganti dengan script berikut 

.avatar-author{float:left;margin:0 5px 5px 0;border:0px solid #999;border-radius:50%;padding:0;width:20px;height:20px}
]]></b:skin>
<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>

Teks yang saya beri warna biru adalah posisi penempatannya - disesuaikan

Teks yang saya beri warna merah adalah besarnya Avatar - disesuaikan

• Selanjutnya cari  <data:post.body/> yang kedua, terus scroll keatas untuk mencari Judul atau kebawah untuk akhir Isi Artikel, yang kodenya kurang lebih seperti berikut :

<span class='vcard author'><span class='fn'>
<span itemprop='reviewer'><data:post.author/>
</span></span></span>,
<data:post.dateHeader/>
<script>document.write(date);</script>
- <span class='updated'>
<data:post.timestamp/></span>
-------------------dstnya
<data:post.body/> 

• Tambahkan kode berikut diatasnya  <script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;amp;callback=av&quot;'/> sehingga menjadi seperti berikut 

<script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;amp;callback=av&quot;'/>
<span class='vcard author'><span class='fn'>
<span itemprop='reviewer'><data:post.author/>
</span></span></span>,
<data:post.dateHeader/>
<script>document.write(date);</script>
<span class='updated'>
<data:post.timestamp/></span>
--------------- dstnya
<data:post.body/>

• Simpan Template kawan 

Read more ...

Pasang Avatar Author disamping Judul Artikel

Sebelumnya saya sudah berbagi dengan kawan Cara Pasang Image disamping Judul Artikel :q; sekarang saya akan berbagi lagi hal yang sama, cuma yang sekarang ini dengan Avatar Author atau Foto Profil kawan sendiri :r; bagaimana, perhatikan screenshotnya dibawah ini 

Kalau kawan ingi tahu caranya, silahkan dilanjutkan membacanya ! :y; 

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML 
• Copas script berikut diatas ]]></b:skin> 

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

• Selanjutnya Copas script berikut dibawah ]]></b:skin> atau diatas </head>

<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>

• Simpan sementara Template kawan
• Temukan <b:if cond='data:post.title'> yang kodenya kurang lebih seperti berikut

 <b:includable id='post' var='post'>

<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Copas script berikut disini....!

    <b:if cond='data:post.title'>  

<h2 class='post-titles' itemprop='name'>
      <b:if cond='data:post.link'>
           .................. seterusnya....

• Copas script berikut diatas <b:if cond='data:post.title'>  

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

• Simpan Template kawan dan lihat hasilnya 

Read more ...