Bagaimana menampilkan sebagian postingan dengan “baca selengkapnya..” di blogspot
Banyak yang nanya bagaimana memotong postingan di blogspot dengan kata “baca selengkapnya..” atau “read more..” sehingga yang tampil di halaman depan hanya separuh postingan dan postingan lengkap akan muncul apabila link “baca selengkapnya..” atau “read more..” di klik.
mas, mau nanya boleh? saya dah lama penasaran sama yg namanya kode untuk mempersingkat postingan….yang biasanya berbunyi : “read more” atau “cerita selengkapnya..”. soalnya kalo ga digituin puanjaaaang…suka pusying. makasih loh. ditunggu jawabannya.
Sebenarnya fasilitas ini nggak ada di blogger/blogspot, tapi kalo kamu pake wordpress fasilitas ini udah ada, cukup klik dimana kamu pengen memotong postingan, kemudian klik icon SPLIT POST USING READ MORE TAG.
Untuk pengguna blogspot, berikut ini langkah modifikasi yang bisa dilakukan. Trik ini menggunakan css untuk menyembunyikan sebagian post, sehingga hanya bagian yang diinginkan saja yang tampil di halaman depan.
Pertama buka template blogger kamu, kemudian tambahkan CSS berikut, CSS biasanya terletak di antara tag <style> dan </style>
<MainOrArchivePage>span.selengkapnya {display:none;}</MainOrArchivePage><ItemPage>span.selengkapnya {display:inline;}</ItemPage>
Dengan style ini, kita membuat sebuah class di css dengan nama “selengkapnya” dan hanya akan tampil ketika postingan berdiri sendiri (post page). Sebagian dari berita akan menggunakan class ini seperti yang akan saya jelaskan kemudian.
Langkah kedua adalah menambahkan kode untuk menampilkan link “baca selengkapnya…” tambahkan kode berikut setelah kode < $BlogItemBody$> pada template kamu:
<mainorarchivepage><br /><a href="<$BlogItemPermalinkURL$>">baca selengkapnya..</a></mainorarchivepage>
Kamu bisa mengganti tulisan “baca selengkapnya..” dengan kata lain yang kamu suka!
Setelah mengkopi kode-kode diatas kedalam template kamu, Save Template dan Republish.
Langkah terakhir adalah melakukan modifikasi setiap kali kamu membuat postingan. Ketika membuat berita yang akan dipotong, selalu gunakan mode Edit Html bukan Compose mode , dan tambahkan kode seperti contoh berikut ini:
Ini adalah awal postingan dan akan dipotong disini. <span class="selengkapnya"> Ini adalah akhir postingan saya </span>
maka akan menghasilkan sebuah postingan seperti ini:
Ini adalah awal postingan dan akan dipotong disini baca selengkapnya..
ketika link di klik maka akan menampilkan postingan secara penuh seperti ini:
Ini adalah awal postingan dan akan dipotong disini. Ini adalah akhir postingan saya.
Selamat mencoba !
September 3rd, 2006 at 18:44:58
hello i managed to finish this tutorial…the only thing is that…if my post is short, the “baca selengkapnya..” is still there…though i did not put the testing123 in my post…. hopefully can get ur answer…
September 3rd, 2006 at 18:50:07
actually between the testing123, there is span thingy ….but it didn’t show up there….heheheh
September 13th, 2006 at 12:16:32
Klo yang di wordpress kayak gini gimana bikinnya bang?
September 27th, 2006 at 16:26:36
udah pernah nyoba .. tapi yang keluar malah cuma judulnya aja, sedang isinya gak keluar sama sekali >_
October 21st, 2006 at 18:55:01
thanks boss dengan tips yang anda berikan tampilan read more di blog saya sesuai harapan. Padahal dengan tip yang sama yang diberikan orang lain beberapa kali gagal.sukses untuk anda. sering sering kasih tips yang lain ya …
November 25th, 2006 at 09:28:45
SAYA MENGGUNAKAN BLOGGER VERSI BETA, MAU MENGGUNAKAN TRIK “READ MORE” JUGA, HANYA KOK DI HTML AKU GA ADA tag dan TUK MEMASUKKAN CSS DIATAS,THANK’S B4
November 25th, 2006 at 11:22:52
IMO : belum nyoba untuk blogger beta
December 20th, 2006 at 14:41:35
Iya nih boss….. buat yang versi BETA kok susah banget yah…… aku dah coba tapi gak bisa2, mungkin ada cara lain lagi?……..
klo dah bisa email aku yah……..
January 26th, 2007 at 16:55:00
Kalau utk wordpress cara memotong postingan dengan read more ada di bagian apa ya mas? mohon bisa dibantu, terima kasih
January 27th, 2007 at 03:41:59
dah aku coba mas… tapi koq gak bisa
efeknya tiap akhir postingan pasti ada tulisan link baca selengkapnya….
waktu aku coba potong postingan dengan
January 28th, 2007 at 04:20:14
mau tanya cara mindah isi blog ke blog yang lain..
ex: dari blogaspot….pengen kupindah ke wordpress….
Thanks
January 28th, 2007 at 16:02:21
Tutorialnya bagus banget, tapi ada beberapa hal yang saya tidak suka yaitu: tampilan “baca selengkanpnya” muncul semuanya di akhir isi kontenya, padahal ada bebrapa yg saya tadak inginkan untuk di “read more”. Gimana caranya mas dan tampilan “read morenya letaknya dibawah isi kontennya, saya mau di akhir isnya.
tanks
February 12th, 2007 at 01:26:13
Thanks untuk tipsnya. tapi karena sekarang blogger sudah ada versi beta, gmn caranya buat hal sama di Blogger BETA? tolong ya….
March 1st, 2007 at 00:33:16
Udah ikutin semua step-stepnya tp hasilnya postingan bener terpotong tp tampilan “baca selengkapnya” gak muncul. jadi gak bisa baca sisa postingannya. kenapa ya mas? mas jangan gak dijawab ya mas soalnya penasarn nih bikin gak bisa tidur. thx
March 1st, 2007 at 01:18:24
mas mas gak dijawab juga gak apa2 deh..soalnya saking penasarannya aku utak atik sendiri..eeh ternyata berhasil..tp sama dgn mas iwan di atas “read more”nya muncul di setiap postingan. Tapi gak apa2lah..aku potong aja semua postingan ku…thx banget ya mas
March 1st, 2007 at 02:47:14
Riana : memang seperti itu
March 8th, 2007 at 11:39:35
[...] Untuk versi template classic aku udah pernah bikin tutorialnya, akhir-akhir ini banyak banget yang nanya, akhirnya aku nyari info, malah ketemu di helpnya blogger, How can I create expandable post summaries?. Tapi jangan langsung di cobain, aku udah nyoba beberapa kali tapi gagal kalo ngikutin yang dari helpnya blogger, terutama pada bagian style/css nya. [...]
March 20th, 2007 at 21:05:02
Tulisan yang menarik sekali. Template yang disediakan juga bagus2. Buat teman2 yang sedang mencari lirik lagu2 indo terbaru silahkan kunjungi blog saya di liriklagudanmusik.blogspot.com
April 6th, 2007 at 21:45:35
mas punya ku gak bisa memotong artikel di blog saya ?, padahal aq dah ikuti semua tips nya. knp ya ?
May 11th, 2007 at 19:58:01
besok coba ah. benar benar good info, you get better
May 23rd, 2007 at 07:12:52
Thanks atas infonya. btw, apa sih bedanya yg classic dg yg nggak classic?
June 21st, 2007 at 13:58:55
Makasih Mas atas infonya.
btw, kenapa ya, read more saya muncul di paling bawaaah sekali setelah labels. Pdhl saya naruh kodenya pas dibawah post/tulisan…
June 22nd, 2007 at 09:42:37
wah syukran - syukran (bhasa arabnya terima kasih…) tapi kodenya ada yang kurang tuh mas kurang
kalo itu tidak ada maka tulisan baca selengkapnya muncul paling bawah dan beritanya tidak dapat di potong….
January 6th, 2008 at 17:14:52
[...] selamat mencoba. (sumber) [...]
January 7th, 2008 at 15:09:13
mas cara di atas bisa utk blogger beta gk…??
aq pake (lagi) template dari mas yg
———————————————————————-
Blogger Template Style
Name: Bloggerized Adsense
Designer: Isnaini
URL: http://www.isnaini.com
Date: 01 Des 2007
———————————-
gimana caranya read more……
January 7th, 2008 at 21:41:14
“tapi kalo kamu pake wordpress fasilitas ini udah ada, cukup klik di mana kamu pengen memotong postingan, kemudian klik icon SPLIT POST USING READ MORE TAG”
Ya ampuun.. itu tho gunanya ’split post’ di Wordpress. Aku juga lagi nyari2, baru ngeh setelah baca tulisan Mas (maklum gaptek :P) Makasih ya Mas ….
February 27th, 2008 at 10:43:33
[...] This Tutorial help you to make “read more” action when posting in blogger. If you are using classic templates blogger please read this article. [...]
March 22nd, 2008 at 21:17:24
setelah saya cari sepertinya gk da tuch tulisan/kalimat dimana kode akan ditempatkan….kira2 knp?
May 19th, 2008 at 01:34:30
mkasih ya omm atas scibnya
June 10th, 2008 at 16:36:59
rimakasih mas atas infonya…
ilmu anda sangat bermanfaat sekali bagi sesama, semoga tuhan membalas kebaikan anda. Aminnnn
July 11th, 2008 at 19:42:22
Sblm’y salam knl, di postingan komentar saya dksh almat blog ini,ky’y infrmasi nya brguna bgt. Maklum postingan,edit blog sy smuanya dlakukan di hp via operamini4.1.. so amat sangat sdrhana jdnya. Dah gt sy msh br bgt didunia perblogan ini. Mohon saran dan kritik’y.TQ blogger_never_sleep!
July 21st, 2008 at 14:45:31
thanks bgt boss dah lama cari aritikel ini… membantu sekali…kapan kapan bikin plugin untuk recent comment dunk…?
August 10th, 2008 at 15:45:51
Thx ya Broooo
infonya berhasil sukses
August 10th, 2008 at 20:28:43
thanks ats postingannya Bost…. Sekarang jadi lebih mudheng tentang blogger umumnya dan posting khususnya.. Thanks..
sukses selalu…
August 26th, 2008 at 16:04:55
waduh…
aku pengen tis ini di blogspotku.. tp kok gak ketemu ya…???
pa yg d tunjukin d ats..>>>
napa alasane cb?
September 13th, 2008 at 12:14:16
Matur nuwun mas,..artikelnya bagus2. Insya Allah tak teko maneh,..
Wong Sragen,..
September 15th, 2008 at 12:17:02
Mas koq tag di template saya ga ada….knp ya?
October 20th, 2008 at 05:16:52
[...] versi template classic aku udah pernah bikin tutorialnya, akhir-akhir ini banyak banget yang nanya, akhirnya aku nyari info, malah ketemu di helpnya [...]
November 20th, 2008 at 16:12:29
saya baru terjun ke dunia blogger, terus berkarya biar tambah pahala..