Cara Membuat Auto Readmore Versi Yahoo

Jika blog sudah mengaplikasi cara Read More tetapi masih ingin membuat variasinya? Read more versi Yahoo!  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…..
Anda baru saja membaca artikel yang berkategori blogging / tips ngeblog / trik blogging dengan judul Cara Membuat Auto Readmore Versi Yahoo. Anda bisa bookmark halaman ini dengan URL http://ianz-galau.blogspot.com/2013/01/cara-membuat-auto-readmore-versi-yahoo.html. Terima kasih!
Ditulis oleh: Ian Kelana -

Belum ada komentar untuk "Cara Membuat Auto Readmore Versi Yahoo"

Post a Comment

Silahkan Tinggalkan Komentar, Komentar Anda Sangat Berarti....