Cara Memasang Thumbnail Avatar di samping Post Info

adscblog

Thumbnail Avatar Biasa nya anda lihat di beberapa template yang di letakan baik itu di samping Post Info ataupun di samping Judul artikel halaman,namun tergantung mereka yan ingin menerapkan nya dimana,namun jika kita lihat kebanyakan orang menyimpan Thumbnail Avatar ini di samping Post Info dan Juga di samping judul Artikel halam

Maka dengan begitu blog anda akan semakin unik dan juga menarik,dan akan membuat terkesang oleh para pengunjung apalagi pencinta blog pasti mereka akan menyukai hal seperti itu,kaena itu bisa saja membawa pengunjung untuk betah di blog kita dan selalu mengunjungi blog yang kita miliki,

Banyak saja Para blogger untuk mempercantik template nya tersebut baik itu dari Widget,Font yang dimiliki,ataupun Style template yang mereka Edit dengan sedemikian rupa hanya karena untuk membuat pengunjung agar betah di blog nya

Cara Membuat Avatar Thumbnail di dalam Postingan

Namun paktor utama nya tetaplah keunikan artikel yang dimiliki oleh blog tersebut bukan karena template atupun desain lain nya,sehingga search engine pun munyukai blog tersebut,dan disini saya akan berbagi pengalaman tentang memasang Thumbnail Avatar berada di samping Post Info di dalam postingan sehingga postingan anda semakin semakin menarik,dan untuk cara pembuatan nya bisa anda lakukan langkah-langkah nya sebagai berikut

• Seperti biasa anda masuk atau login ke blogger dengan email atau Pasword anda
• Setelah itu silahkan anda Klik Template
• Kemudian klik lagi Edit Html
• Setelah anda berada di peng editan,silahkan anda cari kode </b:skin> dan letakan kode berikut sebelum kode tersebut

.post-info {float:left;Border-radius :9px;border:none;background:transparent;margin-top:5px;margin-bottom:5px;color:#fff;font-size:12px;text-align:left;padding:0;box-shadow:none;}
.post-info a {display:inline;background:transparent;color:#666;padding:4px 6px 4px 6px;transition:all .3s ease-out;}
.post-info a:hover {color:#e76e66;}
.author-info, .time-info, .comment-info, .label-info, .review-info {
margin-right:8px!important;display:inline-block;color:#666;padding:10px;}
.post-info .avatar-author {float:left;border:0;padding:0;width:38px;height:38px;box-shadow:none;}
.post-info {font-size:small;text-align:center;background:#69bedd;padding:0;}
.author-info, .time-info, .comment-info, .label-info, .review-info, .post-info a,.post-info a:hover {color:#fff;}

• Setelah anda meletakan kode tersebut,langkah selanjut nya silahkan anda cari markup berikut

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

Kemudian silahkan anda cari lagi kode

<div class='post-info'>

Kemudian silahkan simpan kode berkut setelah kode tersebut

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

Kemudian silahkan anda cari lagi kode </head> setelah itu silahkan anda simpan kode berikut sebelum kode tersebut

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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*)\//,'/s38$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}
//]]>
</script>
</b:if>

Langkah terakhir Save template

adscblog

Recommendation Apps

ads1

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by Dede Ubed, Published at 08 Juni and have 0 komentar