Membuat warna background posting populer

Trik

Trik ini akan mengubah warna latar belakang blog Anda ketika posting/artikeln yang paling banyak dilihat di blog anda dibuka. Untuk melihat posting/artikel terpopuler atau paling banyak dilihat bisa dilihat dari widget popular post blogger, jika sobat belum tahu silahkan tambahkan widgetnya karena trik ini membutuhkan widget tersebut.

Metode 1: Gunakan JavaScript.

Tambahkan kode berikut sebelum tag </ body> dalam template Anda

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
var bgU=location.href;bgPP=document.getElementById('PopularPosts1');bgTN=bgPP.getElementsByTagName('a');if(bgTN){bgH=bgTN.item(0).href;if(bgU.indexOf(bgH)!=-1){document.write('<style type="text/css">body{background:#800000!important}</style>')}}
//]]>
</script>
</b:if>

Metode 2: Menggunakan XML Blogger.

Tambahkan kode dibawah ini sebelum kode tag <b:if cond='data:showThumbnails == &quot;false&quot;'> di dalam template Anda.

<b:if cond='data:post.href == data:blog.url'>
<style type='text/css'>body{background:#800000!important}</style>
</b:if>

Sebaliknya 800000 warna latar belakang ini silahkan anda sesuaikan dengan kode warna pilihan Anda.

Gunakanakan salah satu trik di atas, dua cara di atas sama - tidak memberatkan loading blog anda.

Selamat berexperimen sob...

Artikel Terkait

  • Javascript random banner
    Memasang banner atau iklan dengan gambar bukan hal baru yang sudah banyak di ketahui oleh semua sobat blogger, namun bagaimana cara agar sekumpulan banner atau banner yang lebih dari satu bisa di tampilkan secara berbeda - beda hanya di satu halaman bagi sobat yang belum tahu inilah triknya. sehingga banner sobat tidak bertumpuk dan berderet d…
  • Show hide searchbox blogger
    Membuat tampilan blog menjadi unik memang tidak ada habisnya dan kali ini saya coba untuk berbagi cara membuat kotak pencarian yang bisa di munculkan dan di sembunyikan pada blogger. lihat contoh berikut selain untuk menambah unik tampilan, trik kotak pencarian seperti ini juga bisa di gunakan untuk menghemat ruang dan kolom. bagaimana ca…
  • Trik Sederhana Cara Proteksi Gambar
    Nah disini sebenarnya ada Trik Proteksi sederhana yang bisa anda lakukan untuk menghindari gambar anda di simpan dari tangan-tanagn jahil, dimana hasil dari gambar yang dicoba disimpan nantinya hanya berupa gambar kosong. Kode standar dari gambar biasanya seperti ini: <img width="500" height="375" src="http://defandaky.blogspot/contohgam…
  • Memasang Auto Read Mode Thumbnail No Image di Blogger
     Auto read more ini adalah sebuah trik dan cara untuk meringkas tampilan posting, seiring perkembangannya kini berkembang menjadi gaya keren tersendidi. bagaimana trik membuatnya? ikuti langkah di bawah ini.... Auto Readmore dengan Default Thumbnail   Untuk membuat Auto readmore dengan default thumbnail, anda perlu melakukan 2 langk…
  • Menambahkan kode CSS Threaded Comments
    Untuk langkah - langkahnya, silahkan sobat ikuti cara di bawah ini   Menambahkan Kode CSS Threaded Comments 1. Masuk ke Dashboard 2. Edit HTML 3. Centang Expand Template Widget 4. Temukan kode ini (Gunakan Ctrl dan F untuk mempermudah pencarian): <b:includable id='feedLinksBody' var='links'> 5. Tambahkan kode dibawah ini tepat sebe…
  • Trik untuk menghilangkan atribut default blogger
    Jika sobat ingin menghilangkan atribut atau element bawaan default dari blogger berikut ini adalah caranya. 1. Login ke Blogger.Com. 2. Kemudian menuju Design, lalu Edit HTML. 3. Dan cari kode berikut ini. ]]></b:skin> 4. Tepat diatas kode itu, ]]></b:skin> klik pada kode diatas, kemudian copy kode di bawah ini tepat di at…

10 komentar

  1. ijin untum mencoba mas salam kenal

    BalasHapus
  2. ijin nyimak dulu sob,..
    kunjungn bliknya ditunggu :) salam kenal

    BalasHapus
  3. terima kasih di atas sharing ini.. :D

    BalasHapus
  4. keren mas tutornya bikin bacground most popular, ijin belajar ya, hehehe :D oya gimana tuh cara bikin READ ME seperti di atas :) makasih bantuannya :)

    BalasHapus
    Balasan
    1. silahkan mbak semoga berguna, pakek lightbox evo trus buat html yang di host di google drive... :-bd

      Hapus
    2. wah tapi gak tau caranya nih mas, hehehe :D oke deh makasih petunjuknya :)

      Hapus
    3. haha, cari cari aja dlu tutor semua trik di atas mbak nnti trus di phami... :)

      Hapus

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...