PASANG RECENT POSTS RECENT COMMENTS

Sebenere aku pengen banget masang "Recent Posts" dan "Recent Comments" dalam satu paket. Tapi setelah tak pikir-pikir pasang yang "Recent Posts" aja karena blogku masih jarang dikomentari, he..he.. Tapi bagi kalian yang pengen pasang keduanya silakan saja.
Sejatinya setiap pengunjung tidak selalu ingin membaca artikel kita. Mereka yang menemukan artikel kita melalui browsing sangat mungkin ingin mendapatkan bacaan lengkap yang sesuai dengan kebutuhan mereka. Maka untuk mereka yang seperti ini, artikel kita mungkin akan dibaca dan klo mungkin lagi akan dikomentari.

Kok dikomentari? Eh jangan salah, komentar itu penting lho, misal klo ada yang ngritik bisa kita gunakan sebagai cambuk untuk berbuat sesuatu yang lebih baik lagi. Ya to? Tapi jika yang berkunjung ke blog kita hanya mungkin sekedar untuk meningkatkan traffic, mungkin mereka tidak membaca seluruh artikel kita. Mereka hanya lihat-lihat judul postingan kita. Jika kita menyediakan elemen daftar judul postingan kita yang terbaru, mereka bisa langsung melihatnya. Dan kalau tertarik baru mereka akan baca artikel kita. Disinilah fungsi elemen "Recent Posts".
Sedangkan elemen "Recent Comments" memudahkan bagi kita untuk mengetahui apakah ada komentar terbaru dan anda tidak harus melihat satu per satu postingan, karena pengunjung bisa saja mengomentari banyak postingan. Blog yang tidak sigap dalam merespon komentar para pengunjungnya, maka jangan heran jika sang pengunjung tidak akan balik lagi. Ya seperti blog saya ini. Gimana mo balik, wong komentar saja enggak....he...he....
Nah jika anda tertarik untuk memasangnya baik keduanya ato salah satu saja, silahkan copy code dibawah ini, tapi jangan lupa baca keterangan dulu. Lantas tambahkan pada elemen blog anda. Sudah tahu caranya kan. Bagi yang belum, nih caranya.
1. Silahkan login ke blogger. Kemudian klik Layout.
2. Kemudian klik "add page element" di sidebar.
3. Pilih "html/java script". Nah kemudian pastekan kode dibawah ini.
4. Simpan perubahan. Selesai.

<h3> Recent Posts</h3>

<script src="http://www.geocities.com/uddin_81/recent-post.js"></script>

<script>var numposts = 5; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>

<script src="http://tipsblogging.co.cc/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">

</script>

<h3> Recent Comments </h3>

<script style="text/javascript" src="http://amen24.googlepages.com/showrecentcomments.js"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = false;var showposttitle = true;var numchars = 50;var standardstyling = true;</script><script src="http://tipsblogging.co.cc/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Keterangan :
1. Silahkan ganti alamat url yang berwarna biru diatas dengan alamat url blog anda
2. Silahkan ganti angka warna biru diatas dengan jumlah post/komentar yang ingin ditampilkan
3. Showcommentdate dan showpostdate untuk menampilkan tanggal. Jika "false" tidak ditampilkan, "true" ditampilkan. Pilih sesuka anda. Juga untuk shoepostsummary, showposttitle dan standarstyling.
4. Var numchars untuk menentukan jumlah huruf/karakter yang ditampilkan
5. Anda bisa memasang keduanya secara langsung maupun sendiri. Up to you!!
Selamat mencoba !

READMORE

Banner Statistik blog

Blogmu belum punya banner statistik? Ato sudah punya tapi pengen banner statistik yang cakep dan keren bin lengkap? Dengan status mbah Google Pagerank, alexa rank, berapa jumlah blog/web yang nge-link ke blogmu? Klo pengen masang yang seperti itu, kalian harus coba dari popuri.us yang ini......!!!!! Contoh seperti pada banner statsitik blogku disamping. Gimana, keren ga? Klo kamu bilang keren, coba kamu pasang di blogmu!

Caranya? Ikuti langkah saya!!!

Pertama buka blogger, pilih layout, tekan add page element, pilih javascript/html.
Langkah kedua CoPas kode bawah ini di content.

<a href="http://popuri.us"><img alt="My Popularity (by popuri.us)" src="http://popuri.us/widgets/?type=light"/></a>

Terdapat 2 warna yang menarik, silver (light) dan Black. Jika pengen yang warna hitam ganti Light dengan Black.
Tekan simpan perubahan.
Langkah ketiga tekan simpan.
Langkah keempat makan, maksudnya sudah slese jadi trus makan dech.....

READMORE

Read More Yahoo! Style

Blog anda sudah mengaplikasi Read More dan anda ingin membuat variasinya? Read more Yahoo! style ini mengacu pada tulisan "read more"-nya ala Yahoo. - yang posisinya di samping kanan. Variasi ini kelihatannya belum banyak yang mengaplikasikan. Anda mau mencoba? Ok, ikuti langkah-langkahnya ya?!

1. Memasukan kode
Login ke blogger, pilih layout, buka halaman Edit Html kemudian centang tulisan Expand Template Widget.
Setelah itu taruh kode ini di bawah ]]></b:skin>

.more {
bottom:5px;
font-family:verdana;
font-size:80%;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:normal;
padding-right:10px;
text-align:right;
white-space:nowrap;
}

2. Memasukan tag <p class='more'>..</p> pada elemen Html.

Cari tulisan "Read More" atau �Selengkapnya� atawa �Baca Selengkapnya�! Kamu bisa gunakan kotak pencarian browser ( Ctrl + F ).
Can you find it? Good�

<a expr:href='data:post.url'>Read More......</a>

Tambahkan tag <p class='more'>&#187; ..</p> seperti tulisan di bawah.

<a expr:href='data:post.url'> <p class='more'>&#187; Read More.... </p></a>

Silahkan berimprovisasi sendiri pada tulisan " Read More " misalkan diganti dengan �Baca Selanjutnya", �Seterusnya�, �teruskan bacanya ya?!�� dll. Up to you dech!!!
Ok beres. Simpan Perubahan.

3. Menambah Gambar.

Anda pun bisa menambahkan dengan gambar.

Tambahkan saja properti Background:url (alamat gambarmu) no-repeat right; di bawah kode more {

.more {
background:none;url(http://i120.photobucket.com/albums/o190/jaloewig/blogger/reedmore-bg.gif) no-repeat right;
bottom:5px;
font-family:verdana;
font-size:80%;

Penjelasan.
.more {
bottom:5px;
font-family:verdana;
font-size:80%; = ukuran teks bisa juga pake satuan pixel misal 10px.
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold; = ukuran tebal teks lawannya Normal
line-height:normal;
padding-right:10px;
text-align:right; = posisi teks di samping kanan lawanya left or center
white-space:nowrap;
}
Hoi bro, coba donk. Jangan Cuma baca and duduk-duduk�..

READMORE

Icon baru untuk status Yahoo! Messenger

Yang Baru untuk status yahoo! Messengermu. Untuk menampilkan icon status online yahoo ! messenger, sekarang kita bisa memilih banyak pilihan icon statusnya..Tercatat sebanyak 15 pilihan baru yang lebih keren,catchy dan atraktif. Yakni style id 0 sampe id 1 4. Apa perbedaan dari style id baru ini? Perbedaannya adalah ukuran dari icon dan tampilan gambar yang berbeda beda , untuk melihat perbedaan style id, silahkan sobat perhatikan gambar berikut; dan bisa pilih salah satu.

















<a href="ymsgr:sendIM?YaMesmu"> <img src="http://opi.yahoo.com/online?u=YaMesmu&m=g&t=14&l=us"/></a>

YaMesmu = diganti dengan account yahoo messenger mu
14 = Ganti dengan nomor pilahanmu. Pilih angka dari 0-14

Sumber : www.tanpatinta.blogspot.com

READMORE

Membuat Read More versi 2

Artikel ini saya dapat dari Mas Kendhin.
Lho? maksudnya apa? gini lho kalo read more yang lama, yang sudah pernah dibahas kita bahas dulu (udah baca belum?, kalo belum baca dulu gih), kan kalo kita ng-klik tulisan read more atau Baca Selengkapnya itu kita akan membuka halaman baru sehingga akan meloading lagi halaman web kita, ya tho?. Nha Read more yang ini, yang akan kita bahas ini nggak gitu cara kerjanya, cara kerjanya yaitu berangkat jam 08.00 pagi pulang jam 16.00 WIB (emangnya PNS) Gini lho cara kerjanya :
Di trik Read more yang baru ini, kita akan membuat link Read more yang jika kita meng-klik link tersebut, maka keseluruhan artikel akan terpampang dibawahnya, jadi tidak perlu meload ke halaman yang lain. Piye? uenak tho? bagi yang sudah kebelet ingin menyimak trik ini silahkan langsung ikuti trik berikut ini (langsung loncat dua baris ke bawah). Dan bagi yang kebelet mo pipis silahkan ke kamar mandi dulu, he...he..

Berikut ini langkah-langkahnya:

1. Login ke Blogger
2. Pilih Setting --> Template --> Edit HTML
3. Kamu mau memback-up template kamu dulu nggak?, kalo iya kilik tulisan Download Template lalu simpan.
4. Beri tanda centang pada kotak yang bertuliskan Expand Template Widget
5. Kopi kode berikut ini dan taruh tepat diatas kode </head>

<script src='http://www.geocities.com/kendhin_x/blog/Readmore.js'
type='text/javascript'/>

6. Sudah? sudah belum? ditanya kok diam aja gimana sih ?
7. Kalo sudah cari kode dibawah ini

<div class='post-header-line-1'/>

8. Nha dibawahnya kan ada kode gini <div class='post-body entry-content'> Nha ganti kode tersebut menjadi seperti ini:

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

9.Terus dibawahnya kan kan ada kode gini <p><data:post.body/></p>
10. Tembahkan kode ini dibawahnya.

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

11. jadi seluruh kodenya akan menjadi seperti ini :

<div class='post-header-line-1'/>
<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

12. Tulisan 'Selengkapnya' dan 'Ringkasan' bisa diganti dengan apa aja kata yang kamu suka.
13. Lalu simpan template.
14. Pilih menu Setting -->> Formatting
15. Di bagian bawah ada kotak yang disampingnya ada tulisan "Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.

<span id="fullpost">


</span

Ohya, kalo memposting pilih yang "Edit Html", letakkan abstraksi posting yg akan ditampilkan di halaman muka di atas kode <span id="fullpost"> sementara sisanya letakkan di antara kode <span id="fullpost"> dan </span
Trus bagaimana bagi yang sudah pakai 'read more' yang lama dan pingin ganti dengan 'read more' yang baru ini?
gini caranya:

'Read more' yang lama kan kodenya seperti ini :

<div class='post-header-line-1'/>
<div class='post-body entry-conten'>
<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'>Read More......</a>
</b:if>

hapus text yang berwarna biru, lalu ikuti langkah-langkah diatas.
oh ya jangan lupa ikuti langkah berikut ini
1. Pilih menu Setting -->> Formatting
2. Di bagian bawah ada kotak yang disampingnya ada tulisan "Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.

<span id="fullpost">


</span

bedanya apa sama read more yang dulu? perhatikan text yang berwarna merah, kalo dulu kan tulisannya "class" sekarang ganti menjadi "id".

Gimana? Sudah bisa belum?
Pinter.... anak siapa siiihhh??? duh lutunya
Sumber: Kendhin (www.trik-tips.blogspot.com)

READMORE