Notification

×

Membuat Author Tampil disetiap Postingan

24 July 2010 | 11:55 WIB Last Updated 2021-09-18T09:20:14Z

Membuat Author Tampil disetiap Postingan

Sobat blogger semua, mungkin pada template yang digunakan kebanyakan yang tampil hanya authornya saja tidak disertai dengan foto dan bahkan hanya tampil satu baris saja. tampilan ini dapat dimodifikasi menjadi sedemikian rupa, untuk itu pada tutorial kali ini saya akan memaparkan bagaimana cara membuat author image tampil di setiap postingan.penasaran bagaimana cara membuatnya?ok mari kita ke TKP blogger untuk tutorialnya

Berikut adalah cara membuatnya:
  1. Login ke account blogger milik anda
  2. klik menu rancangan lalu klik edit html
  3. expand widget templates
  4. cari kode ]]></b:skin> dan tambahkan kode css dibawah ini diatas kode tadi .tweetmeme{ margin-left:10px; padding-top:17px; font-size:11px; float:left; }
  5. cari <data:post.body/>
  6. letakan kode dibawah ini diatas <data:post.body/> :
<br/>
<div class='line-border'>
<div style='float: left; padding-top: 0px;'>
<img alt='izal' height='48' src='http://i726.photobucket.com/albums/ww267/asrizalwahdanwilsa/C-OM%20Blogz/Admin.jpg' title='izal' width='48'/>
</div>
<div class='profile-name'>
<a href='http://ALAMATBLOGANDA.blogspot.com' rel='dofollow' target='_blank' title='izal'><b>By izal</b></a>
</div>
<div class='tags-name'>
Date
<span class='post-timestamp'>
&#8594;
<data:post.dateHeader/>

</span>
<br/>

<div class='labelpost'><b:if cond='data:post.labels'>Tags &#8594; <b:loop values='data:post.labels' var='label'><a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/>
</b:if>

</b:loop></b:if>
</div>

</div>
<div class='tweetmeme'>
<script type='text/javascript'>
tweetmeme_style = &#39;compact&#39;;
tweetmeme_url = &#39;<data:post.url/>&#39;;
tweetmeme_source = &#39;freedown4u&#39;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'>
</script>
</div>
<div class='spacer'/></div><br/>
Keterangan: Yang berwarna Hijau adallah lokasi foto sobat
Teks yang bercetak Merah adallah nama sobat silahkan di ganti
Yang berwarna Biru adallah alamat blog sobat

Simpan hasil kerja anda, dan lihat hasilnya, semoga berhasil....

×