Postingan saya kali ini akan membahas tentang bagaimana cara menyembunyikan widget / gadget / sidebar pada halaman blogger. Sebenernya cara ini sudah banyak yang mensharing, tetapi tidak ada salahnya jika saya mesharenya kembali.
Selain menyembunyikan widget pada halaman blogger, trik ini juga bisa menyembunyikan beberapa item lain seperti kolom komentar, popular post dan lain sebagainya, namun sebelum melakukannya, sobat harus mengerti beberapa kode css sehingga sobat bisa dengan mudah menyembunyikan widget ataupun item-item lain pada halaman blogspot.
Pada umumnya, kode css (deklarator) untuk widget adalah .sidebar, tetapi pada template tertentu penulisan deklarator .sidebar agak sedikit berbeda tetapi penulisannya tidak akan jauh berbeda dari template yang lain dan yang sobat butuhkan hanyalah memperhatikan dengan seksama beberapa kode css widget / item lain yang nantinya akan sobat sembunyikan.
Well, untuk penerapan tentang bagaimana cara menyembunyikan widget pada halaman postingan blogger, berikut ulasan lengkapnya.
Copy masing-masing kode di bawah ini dan pastekan tepat di atas tag </head>
1. Menyembunyikan widget pada seluruh halaman postingan
<style type='text/css'>
<b:if cond='data:blog.pageType == "item"'>
.sidebar {display:none;}
</b:if>
</style>
2. Menyembunyikan widget pada halaman tertentu
<style type='text/css'>
<b:if cond='data:blog.pageType == "http://lostsector.blogspot.in/2012/12/cara-mengatasi-missing-required-field-upadate-blog.html"'>
.sidebar {display:none;}
</b:if>
</style>
<style type='text/css'>
<b:if cond='data:blog.pageType == "static_page"'>
.sidebar {display:none;}
</b:if>
</style>
4. Menyembunyikan widget pada halaman postingan dan halaman statis
<style type='text/css'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
.sidebar {display:none;}
</b:if>
</b:if>
</style>
5. Untuk mengatur beberapa widget sehingga tidak muncul pada beberapa halaman tertentu dan halaman statis, berikut kodenya :
<style type='text/css'>
<b:if cond='data:blog.url == "http://lostsector.blogspot.com/2012/11/cara-memepercepat-loading-blog.html"'>
<b:if cond='data:blog.url == "http://lostsector.blogspot.in/2012/12/lostsector-forum.html"'>
<b:if cond='data:blog.url == "http://lostsector.blogspot.com/2012/11/mempercepat-loading-form-komentar-blog.html"'>
.sidebar{display:none;}
</b:if>
</b:if>
</b:if>
</style>
Oh ya, untuk mengatur beberapa item seperti kolom komentar, popular post, menu navigasi atau bahkan footer untuk tidak ditampilkan pada halaman blogger, sobat hanya perlu menambahkan beberapa kode css kedalam kode css seperti contoh di bawah ini :
<style type='text/css'>
<b:if cond='data:blog.pageType == "item"'>
.sidebar, #comments, #navigation, #popular-post {display:none;}
</b:if>
</style>
Perhatikan deklarator yang saya beri tanda warna biru di atas, kode tersebut tidak mengikat karena pada umumnya deklarator template berbeda-beda, yang sobat harus lakukan adalah memperhatikan dan memahami deklaratornya kemudian menambahkannya kedalam kode css di atas. Contoh widget yang disembunyikan pada halaman postingan blog
Artikel Terkait Blog Design ,it
- Cara Menyembunyikan Widget Pada Halaman Blogspot
- Cara Menampilkan Rating Bintang Pada Pencarian Search Engine
- Filter "Bad Words" Pada Komentar Blog
- Gadget Google Translate Flags Untuk Blogger
- Rahasia Facebook
- Cara Membuat Template Blog / Website Valid HTML5
- Cara Memasang Feedburner Counter Reader [FeedCount] Pada Blog
- Cara Mendaftarkan Blog / Website di Google Feedburner
- Cara Mudah Membuat Semua Link Terbuka Pada Tab Baru [Open New Tab Terget]
- Cinemagraphs, Aliran Fotografi Animasi
- Top 10 [Ten] Widgets For Blogger
- Text Efek Keyboard Dengan CSS3 Pada Blog
- Cara Membuat Peringatan Saat Blog Dalam Perbaikan
- Cara Mengganti Warna Text Selection Pada Blog
- CSS Buttons With Transitional Hover Untuk Blogger
- Floating Social Bookmark Vertical Untuk Blogger
- 5 Efek Foto Menggunakan jQuery & CSS pada Blog
- Redirect Halaman Error 404 [Page Not Found] Ke Homepage
- Cara Membuat Tombol Keren [Cool Button] untuk Blogger
- Cara Membuat Mega Menu Drop Down Menu For Blogger
No comments:
Post a Comment