Script Blogspot Membuat Style Tampilan Halaman Berbeda

Kode script blogspot yang sering digunakan untuk membedakan tampilan ataupun penggunaan script untuk widget antara halaman utama dengan halaman konten ataupun halaman blog page. Bagi sobat blogger yang ingin membuat tampilan pada homepage dengan style yang berbeda dengan tampilan postingan, itu bisa di buat dengan menggunakan kode script blogspot, untuk kode script dan contoh penggunaannya sebagai berikut.

1. Menampilkan Widget hanya di homepage :

<b:if cond='data:blog.url == data:blog.homepageUrl'>

..........................script widget................................

</b:if>

2. Menampilkan widget selain di homepage :

<b:if cond='data:blog.url != data:blog.homepageUrl'>

..........................script widget.............................

</b:if>

3. Menampilkan widget hanya di archive pages :

<b:if cond='data:blog.pageType == &quot;archive&quot;'>

.........................script widget..............................

</b:if>

4. Menampilkan widget selain di archive pages :

<b:if cond='data:blog.pageType != &quot;archive&quot;'>

........................script widget................................

</b:if>

5. Menampilkan widget selain di item pages :

<b:if cond='data:blog.pageType != &quot;item&quot;'>

.........................script widget.......................

</b:if>

6. Menampilkan widget hanya di static pages :

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>

........................script widget....................

</b:if>

7. Menampilkan widget selain di static pages :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>

.......................script widget.......................

</b:if>

8. Menampilkan widget pada postingan tertentu :

<b:if cond='data:blog.url == &quot;alamatpostingan&quot;'>

........................script widget.....................

</b:if>

9. Menampilkan widget selain pada postingan tertentu :

<b:if cond='data:blog.url != &quot;alamaatpostingan&quot;'>

.........................script widget....................

</b:if>

Kode script blogspot tersebut dapat ditempatkan di kode template ataupun di kotak pemasangan widget. Oke...sob jangan lupa cendolnya yaa... biar infonya makin unik & menarik.

.: Semoga Bermanfaat :.

Membuat tampilan berbeda pada halaman blog

Selamat pagi dan selamat beraktifitas, saya akan berbasa-basi terlebih dahulu tentang tulisan saya kali ini. Posting kali ini akan membahas cara untuk membuat tampilan berbeda-beda pada blog sobat saat tampilan home dengan tampilan saat kita berada di halaman posting artikel. Yang saya pakai bukan menggunakan inline style menggunakan <style> Css </style> yang ditanamkan di dalam edit html posting. Yang saya gunakan adalah Tag conditional <b:if>.

Langsung saja coba simpan kode berikut di atas kode </head>:

<!-- kondisi home -->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<style type='text/css'>

.contoh {

      background: #ffffff;

}

body {

      background: #000000;

}
</style>

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 350; summary_img = 400; img_thumb_height =0; img_thumb_width =0; </script>
</b:if>
</b:if>
<!-- /kondisi home -->

Keterangan:

• Yang berwana orange Itu adalah Tag conditional tampilan saat di home saya biasa pakai jika menyimpan scipt jquery yang saya gunakan jika hanya akan dipanggil saat di home saja sekedar contoh jika ingin menyisipkan java script pada tag conditional saat di home tsb.
• Yang berwarna biru adalah css yang diinginkan tinggal ganti sesuai keinginan tidak digunakan jg tidak apa-apa jika sudah ada css nya pada template, kalau saya biasa menggunakannya jika ada Sidebar gadget yang tidak ingin saya tampilkan saat di home menggunakan css display:none.

Nah yang kedua Tag conditional untuk menyimpan style atau java script   yang diingnkan saat di halaman Posting artikel.

Simpan tag conditional berikut diatas kode </head> :

<!-- kondisi artikel pada halaman posting -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
body {
background: #3a78ae url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOhaiKxubVlOIBOiSjcuWyob3j81vjoLedIAJy0-uvYtYoEZEhDMF4UJVmDcsG7gNVkgQ3hecD1nrKNqAlbgOEdx8vbZPOV9eWk1UcDHfC7Kd8jMlrx-4EQEc-kjVaf6-RBhIfx5y9G_KM/s1600/pattern3.png) repeat;
}
#sidebar-wrapper {
display: none;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
    $(&quot;.tombol-komentar&quot;).click(function(){
        $(&quot;#komentardisqus&quot;).slideToggle(&quot;slow&quot;);
        $(this).toggleClass(&quot;active&quot;);
        return false;
    });
});
</script>
</b:if>
<!-- /kondisi artikel pada halaman posting -->

Keterangan

• Yang berwarna Biru dan Orange hapus ataupun ganti sesuai kebutuhan, itu sekedar contoh jika ingin menyimpan java script atau css saja.

Selesai, semoga bermanfaat dan bisa dikembangkan.