Tutorial dan Free Download

Membuat Recent Comments

Wah biasanya kita sampai kesulitan mengecek komentar terbaru yang ada pada blog kita, soalnya komentar di lontarkan di postingan kita yang berbeda-beda, jadi kita akan merasa kesulitan untuk mengetahui siapa saja yang memberi komentar dan dimana dia melontarkan komentarnya juga isi komentarnya bagaimana.
Tapi jangan kawatir saya akan beri tips jadul tapi manjur yaitu cara membuat recent comments dengan JavaScript.
Dulu anas udah posting cara menampilkan postingan terbaru yang saya tulis sebelumnya, kali ini anas tulis juga membuat recent comments dehhh... ikuti yukkk

Pastikan dulu sudah Log In di blogger yah!
lalu beranjak ke menu Layout Kemudian Page elements
Kalau sudah! hoi sudah belom! sudah- sudah yaa jangan nangis... Lo kok malah mbulet-mbulet. Ahh serius nihhh Pilih tempat yang mau dipasangi terus Add a Gadget
Lalu pilih Menu HTML/JavaScript
Taruh Code Dibawah ini Kedalam HTML/JavaScript

<script style="text/javascript" src="http://sites.google.com/site/anasku2000/comments.js"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 100;var standardstyling = true;</script><script src="http://NamaBlogKamu.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Keterangan:
- Tulisan NamaBlogKamu yang tercetal tebal dan merah diatas harus kamu ganti dengan alamat blog kamu
- Angka 5 yang tercetak tebal dan biru itu menunjukkan Komentar terakhir yang ditampilkan di blog, kamu bisa mengubah sesuai selera kamu
Kalau sudah Simpan dehhhh

Aduhhh gampang kannnnn cuma itu aja gak ada yang ribet kok.
ohh yaa jangan sampai lupa isi komentar kamu dibawah yaaaa thx lo sebelumnya.... ihhh gemes dechhhhh

Pasang Counter Di Blog

Yap... Anas kembali lagi dehhh kali ini anas bahas tentang web counter. Pernahkah anda mengunjungi Website nah di disidebarnyaa ada seperti Nomor-nomor nah itu yang disebut Counter, jika anda belum mudeng juga anas akan kasih tau penjelsanya dan contohnya.
Apa itu Web Counter?
Web counter adalah Aplikasi tambahan pada web atau blog yang berguna untuk menghitung pengunjung yang mengunjungi blog kita. Contohnya seperti dibawah ini

Nah jika anda Udah tau pengertianya dan anda minat ni anas kasih tau cara buatnya

Buka website www.wowcounters.net
Kemudian Klik Link ** Click Here to Sign Up for your Free Counter ** yang ada di Website tersebut
Kemudian Isi Form sesuai data diri anda dan pilih sebuah Style kemudian Sign Up
Kemudian Copy Code HTMLnya Dan taruh di Blog kamu, dengan cara ke menu Layout --> Page elements kemudian Add a page elements terus pilih HTML/Java Script

Selesai Dehhhh Gampang kannnn jangan lupa isi komentar anda dibawah yaaa

Situs yang menyediakan Counter dan Statistik Blog:
http://www.easycounter.com/
http://sitemeter.com/
http://blogaja.com/
http://hitstats.com/
http://oggix.com/

Auto Hide Navbar Blogger

Anas sebelumnya pernah menulis tentang menghilangkan navbar blogger tapi cara itu melanggar TOS Blogger, Maka dari itu saya menulis artikel yang bermanfaat ini yang aku ambil dari o-om, maka saya pertimbangkan saja untuk menulis ini, karena sangat bermanfaat, kita dapat manfaat kedua-duanya yaitu nggak melanggar TOS blogger dan kita dapat mempercantik blog kita.
Auto Hide ini menyembunyikan Navbar Blogger bukan menghilangkan, Navbar akan tersembunyi bila Pointer tidak diarahkan pada Navbar blogger tapi jika Pointer Diarahkan pada bagian atas Blog atau tempat Navbar itu maka Navbar akan muncul.

Setidaknya kaya diatas pengertianya dan kita akan melangkah ke pemasanganya yaitu:

Pastiakan udah log in di blogger
Ke menu Layout Kemudian Edit HTML
Kemudian Cari Code seperti ini ]]></b:skin> (untuk mempermudah pencarian ketik ctrl+F)
Lalu Diatas Code ]]></b:skin> tambahkan Code seperti dibawah
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
Selesai Deh tinggal SImpan Template dan lihat hasilnya..

sekian yah semoga bermanfaat bagi anda.. terus berkreasi majukan komunitas blogger indonesia

Mengganti Haloscan Ke Comment Blogger

Oughhh sekarang para blogger menggunakan commentsbox dari blogger yaitu "embedded comments" ini salah satu dari fitur blogger in draft. Tapi dulu sebelum "embedded comments" muncul banyak para blogger menggunakan Commentsbox dari haloscan yang fasilitasnya sama seperti Comments box dari blogspot yang sekarang. Tapi para blogger berbondong-bondong mengganti dengan comments box dari blogspot sendiri dengan alasan sering mendapat masalah dari haloscan dan haloscan adalah pihak luar dari blogspot. jadi kalau ada yang asli ngapain gak pakai yang asli/orisinil iya gak.
Tapi buat yang terlanjur menggunakan haloscan dan pengen kembali ke jalan yang benar, maksud aku kembali ke Comments asli blogspot yang bisa muncul di bawah postingan langsung ini dibawah ada caranya:

pertama-tama ke menu Layout--->Edit HTML
"Download Full Tempaltes" Untuk membackup Template
Centang Checkbox "Expand widgets Tempaltes"
Kemudian Cari Code dibawah

<span class='post-comment-link'>

<b:if cond='data:blog.pageType != "item"'>

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


<script src='http://www.haloscan.com/load/lovemanisa' type='text/javascript'> </script>
<span class='post-comment-link'>
<a class='comment-link' expr:href='"http://www.haloscan.com/comments/lovemanisa/" + data:post.id + "/"' expr:onclick='"HaloScan(" + "\""+ data:post.id + "\"" + ");return false;"'>
<script type='text/javascript'>postCount('<data:post.id/>');</script>
</a> |
<a class='comment-link' expr:href='"http://www.haloscan.com/tb/lovemanisa/" + data:post.id + "/"' expr:onclick='"HaloScanTB(" + "\""+ data:post.id + "\"" + ");return false;"'>
<script type='text/javascript'>postCountTB('<data:post.id/>');</script>
</a>
</span>


</b:if>
</b:if>

</span>

Kemudian ganti Code diatas Dengan Code dibawah ini

<span class='post-comment-link'>

<b:if cond='data:blog.pageType != "item"'>

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

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>

<b:if cond='data:post.numComments == 1'>1

<data:top.commentLabel/>

<b:else/>

<data:post.numComments/>

<data:top.commentLabelPlural/>

</b:if></a>

</b:if>

</b:if>

</span>
Kemudian ke langkah selanjutnya, cari Code dibawah

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

<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>


<script src='http://www.haloscan.com/load/lovemanisa' type='text/javascript'> </script>
<span class='post-comment-link'>
<p><a class='comment-link' expr:href='"http://www.haloscan.com/comments/lovemanisa/" + data:post.id + "/"' expr:onclick='"HaloScan(" + "\""+ data:post.id + "\"" + ");return false;"'>
<script type='text/javascript'>postCount('<data:post.id/>');</script>
</a> |
<a class='comment-link' expr:href='"http://www.haloscan.com/tb/lovemanisa/" + data:post.id + "/"' expr:onclick='"HaloScanTB(" + "\""+ data:post.id + "\"" + ");return false;"'>
<script type='text/javascript'>postCountTB('<data:post.id/>');</script>
</a></p>
<script expr:src='"http://www.haloscan.com/comments/lovemanisa/" + data:post.id + "/?m=1"' type='text/javascript'/>
<noscript><a expr:href='"http://www.haloscan.com/comments/lovemanisa/" + data:post.id + "/"'>Comments</a> | <a expr:href='"http://www.haloscan.com/tb/lovemanisa/" + data:post.id + "/"'>Trackback</a></noscript><br/>
</span>


</b:if>

<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>
kemudian langkah selanjtnya adalah gantilah Code Diatas dengan Code dibawah ini

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

<div class='comments' id='comments'>

<a name='comments'/>

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

<h4><b:if cond='data:post.numComments == 1'>1

<data:commentLabel/>:<b:else/><data:post.numComments/>

<data:commentLabelPlural/>:

</b:if>

</h4>

<dl id='comments-block'>

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

<dt class='comment-author' expr:id='"comment-" + data:comment.id'><a expr:name='"comment-" + data:comment.id'/>

<b:if cond='data:comment.authorUrl'><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/>

</a><b:else/><data:comment.author/></b:if><data:commentPostedByMsg/>

</dt>

<dd class='comment-body'>

<b:if cond='data:comment.isDeleted'>

<span class='deleted-comment'>

<data:comment.body/>

</span><b:else/>

<p><data:comment.body/></p>

</b:if></dd><dd class='comment-footer'>

<span class='comment-timestamp'>

<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>

<data:comment.timestamp/>

</a>

<b:include data='comment' name='commentDeleteIcon'/>

</span>

</dd>

</b:loop>

</dl>

<p class='comment-footer'>

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a></p>

</b:if>

<div id='backlinks-container'>

<div expr:id='data:widget.instanceId + "_backlinks-container"'>

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

<b:include data='post' name='backlinks'/>

</b:if>

</div>

</div>

</div>

</b:includable>
Setelah langkah diatas selesai mari kita lanjut ke langkah selanjutnya
Cari Code dibawah Ini

<p class='comment-footer'>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</p>
Kemudian ganti Dengan Code dibawah ini

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
selesai kemudian Save Template dehhh

Jika anda ingin membuat Commentsbox Blogger (baca artikel sebelumnya)

Sekian deh semoga bermanfaat yaaaaaa jangan lupa is komentar yahhhh

Membuat Link Warna-warni

link yang berupa teks sangat banyak di blog anda yang berguna untuk navigasi ke halaman lainya misalnya Link Bloggroll, Link Judul Posting, Link Label dan lainya. Nah teks yang terinfeksi Link jika kita letakkan pointer didaerah link tersebut maka warna teks akan berubah sesuai warna yang telah anda atur.
Nah apa jadinya jika link di blog anda memiliki macam-macam warna yang bisa berubah-ubah... wuihhh makin cool aja tuh blog anda, seperi di blog maynanda ini jika anda meletakkan pointer di teks Yang terinfeksi Link (kaya virus aja terinfeksi) maka warnanya akan berubah-ubah.
gimana tertarik gak...? jika iya lihat caranya dibawah

Cari Kode <head>
kemudian taruh kode dibawah tepat dibawah kode <head>

<script src='http://anas.ku93.googlepages.com/rainbow.js'>
</script>
Kurang lebih jadinya

<head>
<script src='http://anas.ku93.googlepages.com/rainbow.js'>
</script>
Semudian Save dan Lihat hasilnya ok!

Sekian semoga bermanfaat

Buat Read More Versi Pertama

Yupz apa jadinya jika postingan yang amat banyak menutupi halaman utama kita... waduh-waduh kan jadi kurang menarik tuh apalagi jika ada Iklan di bawah postingan kita yang amat banyak pasti akan menambah ketidak nyamanan mata, weleh lihat deh website besar pasti ada "read more" nya.... hah apa kau gak iri tuh melihat yang kaya gitu..... yawdah deh biar anda tidak penasaran dan pengen buatnya ayo ikuti langkah saya disini key..... perhatikan dibawah

Beranjak ke menu Layout --> Edit HTML
Centang cexbox"Expand Widget tempalte"
Lalu carilah code dibawah (untuk mempermudah tekan ctrl+F untuk kotak pencarian browser)
<div class='post-header-line-1'/>
Nah dibawah Code diatas ada code yang mirip kaya dibawah, ingat code dibawah berbeda-beda di setiap template blogger

<div class='post-body entry-content'>

<p><data:post.body/></p>
Lalu ganti kode diatas dengan kode dibawah ini

<div class='post-body entry-content'>

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

<p><data:post.body/></p>

<a expr:href='data:post.url'>Selengkapnya....</a>
</b:if>

Nah kamu perhatikan saja Code yang berwarna biru karena code yang berwarna merah berbeda-beda di setiap template blogger

Perhatikan Code diatas Tulisan Selengkapnya.... adalah link untuk menuju ke postingan keseluruhan yang bisa kamu ganti dengan sesuka hati misalnya Read More.... atau Baca Selengkapnya...
Lalu simpan Template

Nah langkah pertama sudah selesai... lalu kita melangkah ke langkah selanjutnya

Lalu Ke menu Setting Lalu pilih menu Formatting
Lalu Cari Kotak Post Template Isikan kode dibawah

<span class="fullpost">

</span>
Kemudian Di save

Tips Posting:
Disini tulisan sebelum link Read more....<span class="fullpost">
Disini adalah postingan sisa dari diatas
</span>

Membuat Recent Comments

Pasang Counter Di Blog

Auto Hide Navbar Blogger

Read More Versi Kedua

Mengganti Haloscan Ke Comment Blogger

Membuat Link Warna-warni

Buat Read More Versi Pertama

Top Menu

Daftar isi