Bagi para blogger berbasis blogspot, sampai hari ini mungkin agak kesusahan untuk membuat tampilan berita / news yang panjang secara efisien. Masalahnya secara default, blogger akan menampilkan seluruh teks berita yang diposting. Coba bayangkan kalo kita posting 5 berita saja yang cukup panjang, trus kita mau melihat berita yang ke-5 ato yang paling bawah, waduh... musti bersusah payah men-scroll layar nya ber x xx nih. .....
Trus pengunjung tentu lama-lama jadi sebel, bahkan kita dicap sebagai blogger yang kurang prof... ya ..ga?
Gimana cara menampilkan sebagian kecil berita (beberapa baris teratas) kemudian disusul dengan teks "Read More" atao "lanjut" atao apalah yang penting terlihat ringkas dan enak buat surfing berita. Baru setelah pengunjung tertarik pengin baca berita lebih lanjut, dia tinggal klik aja tuh teks "Read More" or "Lanjut" tadi. Bagi para surfer di internet pasti cara yang diuraikan tadi bukan sesuatu yang asing ya..khan..
A. MEMASANG KODE PADA TEMPLATE
Ga usah kebanyakan basa-basi yah... kita langsung saja ke permasalahan "Cara menambahkan Read More" dalam artikel berbasis Blogspot.
1. Buka template klik link: Layout-> Edit HTML -> Kasih tanda cek pada CheckBox "expand widget tempate"
2. Letakkan kode berikut PERSIS di ATAS nya kode </head>
(Pengin cepat, gunakan fasilitas Find pada browser kamu).
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
3. Klo sudah, cari kode berikut:
<p><data:post.body/></p>
(kalo ga ada, cari aja kode: <data:post.body/>-tanpa embel-embel:<p> maupun </p>)
Letakan kode berikut persis di bawahnya:
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>
4. Klik Simpan. Selesai.
5. Pergilah ke halaman SETTING, dengan klik link SETTINGS atau Pengaturan, terus klik FORMATTINGatau Format. Di paling bawah ada kotak kosong di samping menu TEMPLATE POSTING. Tengoklah apakah sudah ada isi kode berikut. Jika belum isi saja kodenya secara manual. Kode dimaksud adalah ini nih....:
<span class="fullpost">
</span>
Trus, jangan lupa simpan hasil SETTING atao PENGATURAN-mu.
wa... melelahkan ya..? eit jangan khawatir, langkah-langkah tadi cukup kamu lakukan SEKALI SEUMUR HIDUP..... :-) :-), kecuali kalo kamu mao ganti template, langkah tadi ya kamu ulangi lagi.... Makanya jangan keseringan gonta-ganti template ya...
Nah... sekarang gimana cara menggunakannya??
Klo yang ini musti kamu lakukan setiap kali kamu posting berita. Tapi kodenya cuma dikit kok, dan kamu bisa lakukan dengan teknik copy-paste.
B. PENERAPAN / PENGGUNAAN
Langsung aja ke contoh ya...
Misal berita posting kamu ASLI nya begini: (tanpa tanda kutip)
"Sebagai bloger atau webmaster, jika ingin memasukkan gambar ke blog/web, kita harus memilih tipe gambar yang akan kita pakai, apakah JPG, GIF, atau PNG. Jikaformat yang dipilih tidak sesuai dengan jenis gambarnya, gambar tersebut ukurannya akan lebih besar daripada yang semestinya, dan menyebabkan waktu loading blog/website kita lebih lama. Padahal, pengunjung suka terhadap blog atau web yang loadingnya cepat dan tidak boros bandwidth. Untuk itu, kita harus mengusahakan agar gambar-gambar dalam blog atau website kita memiliki ukuran sekecil mungkin. Caranya bagaimana?"
Trus kalo kamu tambahi SEDIKIT KODE -lihat yang diberi warna kuning- dalam Modus Edit Html BUKANCompose menjadi begini: (tanpa tanda kutip)
"Sebagai bloger atau webmaster, jika ingin memasukkan gambar ke blog/web, kita harus memilih tipe gambar yang akan kita pakai, apakah JPG, GIF, atau PNG. Jikaformat yang dipilih tidak sesuai dengan jenis gambarnya, gambar tersebut ukurannya akan lebih besar daripada yang semestinya, dan <span class="fullpost">menyebabkan waktu loading blog/website kita lebih lama. Padahal, pengunjung suka terhadap blog atau web yang loadingnya cepat dan tidak boros bandwidth. Untuk itu, kita harus mengusahakan agar gambar-gambar dalam blog atau website kita memiliki ukuran sekecil mungkin. Caranya bagaimana?</span>"
Maka hasil di posting kamu kira-kira akan jadi gini nih....: (tentunya tanpa tanda kutip)
"Sebagai bloger atau webmaster, jika ingin memasukkan gambar ke blog/web, kita harus memilih tipe gambar yang akan kita pakai, apakah JPG, GIF, atau PNG. Jikaformat yang dipilih tidak sesuai dengan jenis gambarnya, gambar tersebut ukurannya akan lebih besar daripada yang semestinya, dan ........ Read more"
Lalu teks:
"menyebabkan waktu loading blog ...."
akan disembunyikan......
Nah... keren dan ringkas kan...
Catatan:
- kode <span class="fullpost"> diletakkan di posisi di mana berita posting kamu akan dipotong (=tempat meletakkan teks "Read More")
- kode: </span> HARUS diletakkan di-AKHIR berita / posting.
SELAMAT MENCOBA....
Categories
- 2015-2016 1
- 7 3
- 8 3
- 9 6
- Design 1
- Kelas 7 Smstr 1 2
- Kelas 8 semstr 1 2
- kelas 9 semester 1 2
- Operating System 2
- Pemrograman 2
- Photosop Design 1
- TI 6
- Tips Blogger 1
- Ulangan Kelas 7 Smstr 1 1
http://id.wikipedia.org/wiki/Layar_sentuh. Powered by Blogger.
Link List
Navigation
Recent Post
Link
Pages
About Me
About Me
Blogger news
Fakta
Link Partners
Bayu Budianto, S.Kom
Sponsors
Followers
Recent
Weekly
-
Menghitung Luas Permukaan dan Volume Bola Dengan Menggunakan Borland Delphi Berikut Adalah Listing Programnya : unit bola; interface uses ...
-
Khusus kelas 9 silahkan download Link di bawah ini : Kisi - Kisi US 2015/2016 Silahkan di download caranya sama seperti kemarin... SELA...
-
Komunikasi Data Komunikasi data adalah merupakan bagian dari telekomunikasi yang secara khusus berkenaan dengan transmisi atau pemindahan ...
-
1. F ungsi utama computer adalah untuk mengesekusi instruksi.Bagaimanakah suatu instruksi dieksekusi? Jawaban “load” program ke memori ...
-
KISI – KISI KELAS 9 1. Deskripsi internet 2. Protocol di internet di sebut 3. Singkatan PDA 4. Bah...
-
KISI-KISI UTS 9 SEMESTER GENAP 1. Perangkat pengolah gambar yang dapat digunakan untuk memperbaiki foto dan gambar 2. Pi...
-
Dalam ilmu komputer, kernel adalah suatu perangkat lunak yang menjadi bagian utama dari sebuah sistem operasi. Tugasnya melayani bermacam pr...
-
KISI-KISI USBN KELAS 9 TH 2017/2018 Berikut bahan kisi-kisi USBN Kelas 9 : Link : Kisi-kisi USBN Kelas 9 Selamat belajar dan ...
-
KISI-KISI UTS KELAS 7 1. Contoh hak cipta perangkat lunak 2. Teknik dan posisi tubuh saat mengetik 3. Cara mem...