Kami berusaha berbagi cara membuat blog, tips ngeblog, dan hal unik lainnya

Cara Membuat Readmore di Blog

Membuat readmore di blog adalah hal sangat mudah. Banyak blogger berkeinginan untuk membuat readmore di blognya. Apa sih alasannya? Memang terkesan kurang bagus jika kita membuka blog yang kita punya terus langsung melihat artikel blog secara keseluruhan dan panjang-panjang. Terlebih lagi apabila dalam menu beranda atau home artikel yang tampil banyak juga, maka lengkaplah panjang tampilan blog kita.

Memang menampilkan artikel panjang tanpa readmore, di halaman beranda mempunyai beberapa kekurangan. Tidak adanya readmore di blog, akan memperbanyak penggunaan halaman blog. Dan kemudian akan berdampak pada kecepatan loading blog. Semakin banyak yang diloading baik itu gambar maupun paragraf, semakin lambat kecepatan blog sobat.

Dalam google adsense kecepatan loading blog juga sangat berpengaruh. Apabila blog sobat lambat saat loading maka calon pembaca blog sobat akan pergi dari blog sobat dan beralih ke blog yang lain. Oleh karena itu google membutuhkan blog dengan loading yang cepat.

Selain itu dengan adanya readmore akan membuat blog sobat menjadi lebih rapih dan menarik kelihatannya.

Apa sih readmore itu?
Arti kata readmore dalam bahasa indonesia berarti "Baca Selengkapnya". Readmore sebenarnya adalah memotong paragraf dari suatu artikel yang telah diposting menjadi beberapa hurus atau beberapa kata. Kata yang tampil dalam readmore dapat kita sesuaikan menurut keinginan kita.

Tampilan readmore pada blog kurang lebih seperti dibawah ini:

Blog dengan Readmore
Tampilan Blog dengan Readmore
Silahkan sobat perhatikan tampilan blog dengan readmore di atas keren bukan? Perhatikan bagian bawah sebelah kanan artikel ada tertulis readmore jika sobat pengunjung blog sobat meng-klik disitu maka akan tampil artikel pada blog sobat selengkapnya.

Reademore itu sendiri terdiri atas dua jenis (menurut pengalaman). Menurut pembuatannya readmore terdiri atas.

Pertama reademore dengan cara manual. Yaitu reademore yang dibuat secara manual dalam pembuatan artikel. Ini akan sedikit merepotkan. Karena setiap akan memposting artikel kita akan membuat readmore lagi. Artinya membuat readmore secara berulang-ulang.

Kedua readmore otomatis. Readmore otomatis merupakan kebalikan dari readmore manual. Dengan readmore otomatis sobat tidak perlu lagi membuat readmore berulang-ulang. Akan sendirinya memotong artikel blog sobat. Ini juga akan mempermudah pekerjaan kita.

Lalu, bagaimana cara pembuatan kedua jenis readmore ini?

Membuat readmore manual di blogger.com

Pada blogger.com sudah tersedia tombol untuk membuat readmore. Langkah-langkah membuat readmore di blogger.com sebenarnya sangat mudah. Tidak perlu hal yang bermacam-macam. Hal pertama yang sobat sediakan tentunya artikel yang akan di posting. Apabila artikel tersebut mempunyai banyak paragraf dan sobat ingin memotongnya berikut cara membuat readmore manual di blogger.com:

1. Buka blog sobat silahkan masuk di blogger.com

2. Kemudian klik New Post.

3. Silahkan ketik artikel sobat. Jika sudah, misalnya kita mempunyai artikel artikel seperti beikut. Saya akan membuat tombol read more di antara paragraf yang bergaris merah.

Tampilan editor post di blogger.com

4. Klik di antara paragraf tersebut. Kemudian klik simbol Insert Jump Break terletak di bagian atas editor postingan. Simbolnya kertas yang terbagi dua atau ada  kertas robek terbagi dua. Berikut simbolnya.
Insert Jump Break
simbol Insert Jump Break
5. Maka akan tampil garis pemisah seperti gambar di bawah ini. Kata atau paragraf yang berada di atas garis itulah yang akan muncul, selebihnya akan dipotong dengan tombol read more.

Cara Membuat Readmore di Blog
Tampilan insert jump break

6. Silahkan Posting artikel sobat. Selesai

Demikian cara membuat readmore manual di blogger.com. Bagaimana mudahkan? namun cara di atas akan merepotkan jika artikel yang kita akan posting cukup banyak. Akan lebih mudah jika kita memakai readmore otomatis di blog. Lalu bagaimana langkah-langkah membuat readmore otomatis di blogger.com? berikut langkah-langkahnya.

Membuat readmore otomatis di blogger.com
Cara Membuat Readmore di Blog
sumber: http://vivittrianti.blogspot.com
Nah, sekarang kita akan lanjut ke tutorial selanjutnya. Bagaimana cara membuat readmore otomatis di blogspot atau blogger.com. Berikut langkah-langkanya, baca baik-baik ya sob.

1. Login dulu di blogger.com

2. Kemudian klik Design. Kemudian klik Edit HTML jangan lupa centang Expand template widget.


3. Langkah selanjutnya yaitu cari code </head> dengan cara CTRL+F kemudian ketik  </head> lalu enter atau cari.

4. Setelah dapat, kemudian paste code berikut tepat dibawah code  </head> yang tadi kita sudah dapatkan.
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>
 5. Kemudian cari kode <data:post.body/> atau <p><data:post.body/></p> Jika sobat menemukan 2 kode yang sama, gunakan atau ganti yang pertama.

6. Jika sobat sudah ketemu kode tersebut, silahkan ganti kode tersebut dengan kode di bawah ini.
<b:if cond='data:blog.pageType != &quot;item&quot;'><div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'><img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img></a></span></b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
7. Terakhir, simpan template sobat.

Sobat dapat merubah sendiri tampilan readmore sesuai yang sobat inginkan. Dengan cara mengganti nilai kode yang berwarna biru. Berikut keterangannya

summary_noimg = 430 : Jumlah huruf yang akan tampil apabia tidak terdapat gambar dalam artikel
summary_img = 340 : Jumlah huruf yang akan tampil apabia terdapat gambar dalam artikel
img_thumb_height = 100 : Tinggi gambar yang akan tampil dalam readmore
img_thumb_width =  120 : Lebar gambar yang akan tampil dalam readmore

Sobat juga dapat mengganti url icon readmore http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif dengan tulisan READ MORE untuk menampilkan tombol readmore dalam bentuk teks biasa.

Oke demikian Cara Membuat Readmore di Blog.  Semoga bermanfaat
6 Komentar untuk "Cara Membuat Readmore di Blog"

mantap..sangat berguna sekali readmore-nya.
salam bligger

mantap..sangat berguna sekali readmore-nya.
salam bligger

belum worked, apa tergantung template nya ?

Back To Top