Membuat Read More untuk Template klasik

Send by -True Violet- 15 November 2009
Tutorial ini khusus bagi anda yang masih menggunakan template klasik, jika anda sudah menggunakan template baru (xml/beta).

Wah judul yang aneh, "membuat Read More" maksudnya apa? Begini sobat, sebenarnya saya kurang setuju dengan judul tersebut, tadinya saya ingin memberi judul "Membuat menu Selengkapnya", tapi berhubung kata "Read More" yang paling di kenal di jagad blog, ya saya pun ikut-ikutan (dasar tukang ngekor). Ya sudahlah kepanjangan ngobrolnya. Kita mulai pembahasannya. Bagi para sobat yang baru mulai membuat blog, mungkin belum mengetahui informasi ini dan mudah-mudahan dengan membaca artikel ini dapat menambah pengetahuan kita tentang yang namanya nge-blog.

Sobat mungkin melihat bahwa artikel-artikel saya terlihat hanya berupa judul-judul dengan satu atau dua buah paragrap saja, dan untuk melihat keseluruhan artikel harus meng klik link yang bertuliskan >> Selengkapnya...", ini di sebut pengkaburan atau pengkamuflasean postingan (ribet banget nyebutnya). Bagi sobat yang baru posting artikel hanya satu atau dua artikel saja mungkin menganggap tidak perlu menyingkat artikel sobat, namun jika nanti artikel sobat sudah banyak, maka mungkin saja ada terbersit ingin membuat menu ini.

Oke... kelamaan ngawurnya, mending langsung saja. Untuk membuat menu Read more kita harus menambahkan beberapa kode HTML ke dalam template blog kita. Tapi untuk postingan kali ini, saya khususkan untuk blogger yang memakai template klasik saja, untuk yang memakai template baru silahkan tunggu pada postingan yang akan datang.

Silahkan ikuti langkah-langkah berikut :

  • Login ke blogger.com dengan id sobat


  • Klik menu bertuliskan Template


  • Klik menu Edit HTML


  • jangan lupa Copy seluruh kode template milik sobat lalu paste pada notepad dan kemudian simpan, untuk membuat back up data. Ini dimaksudkan apabila terjadi kesalahan dalam template setelah kita otak-atik, kita masih punya cadangan data untuk mengembalikannya.


  • Copy kode HTML di bawah, kemudian paste persis di atas kode </style> :

<MainOrArchivePage>

div.fullpost {display:none;}

</MainOrArchivePage>

<ItemPage>

div.fullpost {display:inline;}

</ItemPage>

Untuk mempercepat pencarian kode </style>, silahkan sobat klik menu Edit yang ada pada bar menu browser, kemudian klik Find (on this page)..., lalu tulis </style> trus klik tombol find next, maka secara otomatis akan di bawa ke kode tersebut.

langkah selanjutnya adalah, silahkan copy kode berikut lalu paste setelah kode <$BlogItemBody$> :

<MainOrArchivePage><br/>

<a href="<$BlogItemPermalinkURL$>">Read more!</a>

</MainOrArchivePage>

Lagi-lagi Untuk mempercepat pencarian kode <$BlogItemBody$>, silahkan sobat klik menu Edit yang ada pada bar menu browser, kemudian klik Find (on this page)..., lalu tulis <$BlogItemBody$> trus klik tombol find next, maka secara otomatis akan di bawa ke kode tersebut.

  • Klik tombol yang bertuliskan SAVE SETTINGS


  • Langkah selanjutnya adalah klik menu Setting


  • Klik menu Formatting


  • Dibagian bawah menu tersebut ada kotak di samping tulisan Post Template, nah isi kotak kosong tersebut dengan kode di bawah ini :

  • <div class="fullpost">


    </div>

    Sebenarnya langkah diatas tidak wajib dilakukan,akan tetapi ini di maksudkan agar ketika kita mau posting artikel, kode tersebut akan muncul secara otomatis tanpa harus di tulis dahulu, tentunya ini akan lebih mempermudah dan tidak harus selalu mengingat kode tersebut.


  • kemudian jangan lupa klik tombol Save Settings


  • Selesai


  • Cara Posting Artikel

    Oke, sesudah beberapa tahap kita lalui, sekarang kita masuk ke tahap bagaimana cara memposting suatu artikel agar ada menu Readmore nya.

    • Klik menu Posting


    • klik menu Edit HTML, nah di sana secara otomatis akan tampak kode yang kita simpan tadi, yakni :
    <div class="fullpost">


    </div>

    simpan artikel sobat yang ingin di tampilkan sebelum kode <div class="fullpost">, kemudian simpan sisa keseluruhan artikel setelah kode <div class="fullpost"> dan sebelum kode </div>

    Agar lebih jelas, saya beri contoh, misal artikelnya begini :

    Ini adalah contoh tulisan yang di simpan pada awal artikel yang akan selalu muncul pada blog kita, sedangkan tulisan yang lainnya tidak akan muncul.
    <div class="fullpost">
    dan tulisan yang ini adalah tulisan yang akan muncul ketika para pengunjung meng klik link yang bertuliskan Read more.
    </div>

    Hasilnya yang akan tampak pada blog kita adalah seperti ini :

    Ini adalah contoh tulisan yang di simpan pada awal artikel yang akan selalu muncul pada blog kita, sedangkan tulisan yang lainnya tidak akan muncul.

    Read more!

    Bagaimana sobat, sudah jelaskan. bila belum jelas silahkan di tanyakan kembali pada komentar.

    Sedikit clue, kata Read more! sebenarnya bisa kita ganti sesuai dengan keinginan kita, misalkan kita rubah menjadi Baca selengkapnya..., Selengkapnya.., Lanjutannya... atau apa saja yang penting kata tersebut bisa memberi tahu kepada para pengunjung bahwa artikel kita ada kelanjutannya.

    Kode di atas sebenarnya ada alternatif lain, yakni memakai kode Span, jika berminat, ganti semua kode div menjadi Span. Hasilnya akan sama, cuma bagi para sobat yang suka posting pada menu compose, kode ini sering ada masalah di karenakan bertabrakan dengan perintah lain yang memakai kode Span.

    Selamat Mencoba! ^_^

    Yang Lainnya:



    1 Responses to Membuat Read More untuk Template klasik

    1. kurang ngerti ma style itu

       

    Posting Komentar

    Silahkan berikan komentar/saran sobat demi kemajuan blog kami ini... Terima Kasih

    FORUM MUSIK LOKALICIOUS



    2 Garis 8 Ball Acha Septriasa Ada Band Adhareza Adrian Martadinata Agrikulture Ajeng Intan Aladin Aleea Band Alka Almost D'va Amorphis Andez Andi Rif Andika Pratama Angelina Ruby Anima Anita Hara AOP Ares Ari Lasso Aril AF7 Armada Array Band Ashanti Aura Kasih Azura B'jah BCL Be3 Blackout Boomerang Brownies Cadenza dan Vanya Candu Band Canvas Capulet Cashback Charly ST12 Cinta Kuya Cinta Laura Clavia Club 80's Cosmic D_Option D'Bagindaz D'Magma D'Parfum D'Sixthsense D'Unique De Afternoon De'Time DEA Band Dewi Sandra Dhika Dimas Beck Dini Aditama Dissa Dj Dave Doddy Katamsi Donita Double B Drive Dublex Inc Elda and The Triggers Electron 45 Elvenskin EPISOD Evolet Exo Band Faby Fellas Five Minutes Flow R Fortuna Freaky Styley Free Frequency G2 Geisha Gilbert Pattiruhu Gita Gutawa Groovy Sadie Gruvi Guntur Hachi Happy Day Happy Salma Hardolino Harmonik Distorsi Hati Band Helios Hengky Supit Humania Ihsan Indra Brugman Innerlight Intan Nuraini Intan RJ Irsa Andrea J-Rocks Jahanam Jamrud Joker Juliette Kahitna Karla Karma Kastil Keyla Kiki Amelia Kill the DJ Knaan Kripik Peudeus Krisdayanti L'arc~en~Ciel Laba Laba Lafrosia Lagu Religi Lagu Sunda Lala Suwages Leeya Lensa Band Leo 15 Liberty Lifter Limosin Local Heroes Lucky Laki Lusy Rahmawati Magneto Malika Mandala Shoji Marsya Marvells Mass Romantic Maximus Mayoret Mbah Surip Meadow Melanie Putri Melly Goeslaw Mizta D MU Mulan Jameela Music For Sale Naff Namito Nania Nano Naura Netral New Folder New Sabila Nikki Nindy Nixoteen Not For Sale Nubhan Nuke Numero Nyawa Nyrwana O_On Olif Omelette One Blood Opick Oris Band Overload Romance Padi Paracoustic Parvume Phantom Pinkan Mambo PL4T Band Prambors Band Radja Rama Rayna Wine Repvblik Revalina S Temat Rio Febrian Riunk Robin Hood Rosewood Sabisana Sakura Santi Nova Saras Sarwana Saykoji Sembilan September Band Seven Dream Shafan Shamila Cahya Shinobi Shiver Sigit Wardana Sigma Smariduta Solitaire Addict ST12 Strive Rainbow Sweet Baby T Five T.R.I.A.D Tangga Tatz Taxi Teuku Yudhistira The Banery The Brantaz The Cash The Dance Company The Flam The Jalu The Law The Nolan The Potter's The Story The Sun The Tangkiwood The Titans The Vuluz Tinta Titi Dj Tompi Trio Libels Trio Macan Uncle Jesse Ungu Utopia Various Artist Vidi Aldiano Vienna Vote Wali Warteg Boyz Waterfall Widi Vierra Wings Band Zero Eighty Why Zetta Zigaz Zogut

    Tempat Buat Kumpul/Nongkrong

    dfacto-community on Facebook

    Gabung Yuk Jadi Sahabat Kami!

    Chat Box!

    Ad by ProfiAdvert

    Free Mp3 Albums

    Directories