Menyediakan informasi seputar perkembangan mesin Blogger dan internet secara umum.

Format Posting Hanya Tampil Judul

Teknik yang paling umum digunakan adalah dengan cara menyisipkan kode CSS pada tag kondisional pengingkaran terhadap halaman item dan halaman statis untuk menghilangkan elemen <div class='post-body'> dan <div class='post-footer'> seperti ini:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'> 
        <style>
          .post-body, .post-footer {display:none !important;}
        </style>
    </b:if>
</b:if>

Coba Anda letakkan kode tersebut di atas </head> maka Anda akan melihat bahwa daftar posting dalam blog Anda sekarang hanya akan menampilkan judulnya saja pada halaman non-item dan non-statis.

Anda pikir ini akan membuat blog Anda menjadi jauh lebih cepat karena Anda telah menghilangkan isi posting secara keseluruhan, namun anehnya itu sama sekali tidak terjadi.

Mengapa? Karena apa yang Anda pikir sebagai menghilangkan sesuatu sebenarnya hanyalah menghilangkan wujudnya saja, sedangkan elemen-elemen yang ada di dalam <div class='post-body'> dan <div class='post-footer'> sebenarnya masih ada. Jika Anda membuka paragraf pada elemen ini maka Anda akan melihat keseluruhan konten (Bahkan Anda juga bisa dengan mudah melihatnya pada mode view source):

Isi posting masih ada meski wujudnya tidak terlihat
Isi posting masih ada meski wujudnya tidak terlihat di layar.

Selain itu, tidak semua tema memiliki kelas .post-body dan .post-footer. Bisa saja mereka menggunakan kelas .entry dan juga .postmeta atau bahkan yang lainnya seperti contoh tema yang Saya gunakan sebagai bahan percobaan.

display:none tidak akan mencegah elemen untuk terpanggil, mereka hanya menghilangkan wujudnya saja. Jadi, betapapun usaha Anda untuk menghilangkan elemen dengan deklarasi display:none, elemen tersebut akan tetap selalu ada, hanya wujudnya saja yang tidak terlihat.


Metode Terbaik

Metode terbaik adalah dengan cara menyisipkan tag kondisional secara langsung pada elemen yang dimaksud. Ini akan benar-benar mencegah elemen terpanggil oleh browser. Cara ini memang sedikit sulit, karena kita harus berhadapan secara langsung dengan elemen, yang (anehnya) terkadang elemen-elemen tersebut tampak jauh lebih panjang dari apa yang kita lihat di layar.

Namun pada intinya, jika kita ingin menyembunyikan isi posting, sebenarnya ada satu panduan sederhana untuk mengetahuinya yaitu tag <data:post.body/>. Temukan saja kode itu dan cari elemen induk terdekat seperti ini:

<div class='post-body entry-content'><data:post.body/>    <div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Dari situ Anda bisa mengitari elemen induk terdekat dari <data:post.body/> dengan tag kondisional halaman item dan statis seperti ini:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'> 
        <div class='post-body entry-content'><data:post.body/>            <div style='clear: both;'/> <!-- clear for photos floats -->
        </div>
    </b:if>
</b:if>

Atau untuk contoh yang Saya gunakan bentuknya seperti ini. Anda juga bisa melihat bahwa kelas elemen ini bukan berupa post-body melainkan entry:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'> 
        <div class='entry'>
            <p><data:post.body/></p>
            <div class='clear'/>
        </div>
    </b:if>
</b:if>

Oke, tugas pertama telah selesai. Konten posting sekarang benar-benar telah menghilang:

Isi posting telah menghilang
Isi posting telah menghilang.

Sekarang tinggal mengitari elemen <div class='post-footer'> dengan tag kondisional yang sama. Coba Anda temukan sendiri. Jangan kaget ya!

Info Tema

Diavlo Blogger Tema

Diavlo

Diavlo is a free blogger tema adapted from WordPress with 2 columns, right sidebar, perfect for photologs, minimalist and neutral colors.
Excellent layout for blogs about movie, music or photography.

  

Berlangganan

Berlangganan: Dapatkan berbagai materi dan informasi seputar dunia pemrograman yang tidak akan pernah bisa kalian dapatkan di buku dan di bangku kuliah.

 11 Komentar

Memuat…

Tautan (link) hidup dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan tautan dengan aman, gunakan kode [url=http://example.com]Teks Tautan[/url]
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA</i>
Untuk menyisipkan gambar, gunakan kode [img]URL GAMBAR[/img]
Untuk menyisipkan judul, gunakan tag <b rel="h4">JUDUL ANDA DI SINI…</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA DI SINI…</strong>
Untuk menciptakan efek huruf miring gunakan tag <em>TEKS ANDA DI SINI…</em>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

:) :( ^_^ :D ;) :bd :'( :\ ;p B) :Q :Ozzz 7:( \o/ **p :* 0:) :a 7:O *fuck* x& x@ ~x( *yaya* =p*

Nama Saya Taufik Nurrohman. Sebenarnya Saya tidak bisa disebut sebagai seorang yang profesional dalam bidang ini, karena Saya tidak menguasai bidang ini melalui pendidikan formal. Saya hanyalah seorang antusias. Dibandingkan sebagai seorang desainer atau pengembang, Saya lebih suka jika disebut sebagai seorang hobiis saja yang tertarik dengan dunia web.

Daftar Tautan

Saya tidak bisa hidup tanpa JavaScript! Aktifkan JavaScript?
Ke atas!