Hello sobat ICloudzer kali ini admin bakalan menjabarkan mengenai bagaimana caranya mengubah warna header blog saat di scroll di blogger
Info: Jika kamu sudah penasaran dengan pembahasan kita kali ini, yuk langsung aja kita bahas bersama sama
Warna header
Warna header blog secara default bisa di ubah sesuai selera, namun jika di kembangkan header blog bisa berubah warna secara otomatis, entah itu menurut waktu, ataupun saat mengklik tombol menu khusus yang memiliki perintah untuk mengubah warna header blog saat di klik, nah pada pembahasan kita kali ini admin bakalan menjabarkan cara mengubah header blog secara otomatis saat di scroll dan setiap kali halaman blog di scroll header blog akan berganti warna secara otomatis
Info: Jika warna blog berhasil di ubah, namun warna judul header dan warna svg header berbeda, kamu harus menyesuaikannya sendiri Ok
Contoh tampilan
Baiklah agar kamu tidak penasaran dengan contoh tampilan header blog yang berubah setiap kali scroll di blogger, silahkan saja scroll halaman artikel ini ke bawah, entar tampilan warna blog akan berubah secara otomatis
Info: Bagaimana sobat dengan contoh tampilannya keren sekali yak, ohh pastilah keren
Cara pembuatan
Sekarang saatnya admin bakalan menjabarkan mengenai cara mengubah warna header blog saat di scroll, silahkan baca dan ikuti setiap arahan yang admin jabarkan di bawah ini ok
- Pertama tama silahkan login ke blogger menggunakan akun google milik mu
- Selanjutnya pergi kemenu Tema dan pilih lagi menu Edit HTML
- Kemudian salin kode javascript di bawah ini, letakkan di atas kode </head>
<style>header{--rahBHdr53:#353535/* Change color hax code #353535*/}</style>
<script>/*<![CDATA[*/
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('A e=["\\m\\b\\r\\i\\8","\\j\\a\\8\\9\\b\\8\\B\\i\\8\\n\\8\\f\\b","\\b\\r\\h\\8","\\b\\8\\s\\b\\C\\j\\m\\m","\\b\\8\\s\\b\\o\\g\\f\\b\\8\\f\\b","\\c\\8\\9\\d\\8\\a\\k\\a\\9\\c\\t\\k\\c\\8\\9\\d\\o\\f\\u\\c\\8\\9\\d\\8\\a\\k\\a\\9\\c\\u\\c\\8\\9\\d\\8\\a\\k\\a\\9\\c\\t\\v\\c\\8\\9\\d\\8\\a\\D\\E\\9\\j\\F\\G\\a\\g\\H\\f\\d\\w\\I\\9\\a\\J\\x\\x\\a\\9\\c\\K\\L\\d\\a\\M\\N\\O\\y\\p\\n\\h\\g\\a\\b\\9\\f\\b\\P\\j\\g\\i\\g\\a\\w\\v\\q\\8\\q\\8\\q\\8\\y\\p\\n\\h\\g\\a\\b\\9\\f\\b\\Q","\\9\\h\\h\\8\\f\\d\\o\\c\\p\\i\\d","\\c\\8\\9\\d"];R l=z[e[1]](e[0]);l[e[2]]=e[3];l[e[4]]=e[5];z[e[7]][e[6]](l)',54,54,'||||||||x65|x61|x72|x74|x68|x64|_0x2b72|x6E|x6F|x70|x6C|x63|x2E|rahHdscrlJs|x73|x6D|x43|x69|x66|x79|x78|x20|x2C|x23|x3A|x2D|x21|document|var|x45|x2F|x7B|x62|x6B|x67|x75|x76|x28|x42|x48|x35|x33|x29|x3B|x7D|const'.split('|'),0,{}))/*]]>*/</script>
Info: Kode javascript di atas sudah admin enkripsi, jangan megubah ataupun mengedit kode yang admin berikan, tapi kamu bisa mengubah kode warna HTML sesuai selera kamu aja
- Langkah selanjutnya salin lagi kode javascript yang kedua di bawah ini, kemudian taruh atau letakkan di atas kode </body>
<script>/*<![CDATA[*/
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('o c=["\\p\\h\\A\\b\\B\\C\\q\\q\\e\\b\\f","\\e\\k\\d\\i\\g\\g\\D\\i\\p","\\j\\i\\k\\r\\m\\b\\l\\f\\s\\g\\b\\m\\b\\l\\f","\\t\\b\\h\\j\\b\\d","\\E\\r\\b\\d\\F\\G\\b\\g\\b\\k\\f\\i\\d","\\d\\h\\t","\\h\\j\\j","\\k\\g\\h\\e\\e\\u\\v\\e\\f","\\d\\b\\m\\i\\w\\b","\\e\\k\\d\\i\\g\\g","\\h\\j\\j\\s\\w\\b\\l\\f\\u\\v\\e\\f\\b\\l\\b\\d"];H x(){o a=y[c[0]]||z[c[2]][c[1]],n=z[c[4]](c[3]);I<a?(n[c[7]][c[6]](c[5])):(n[c[7]][c[8]](c[5]))}y[c[J]](c[9],x)',46,46,'|||||||||||x65|_0x978d|x72|x73|x74|x6C|x61|x6F|x64|x63|x6E|x6D|_0x879fx3|var|x70|x66|x75|x45|x68|x4C|x69|x76|rahHdScrl|window|document|x67|x59|x4F|x54|x71|x79|x53|function|53|10'.split('|'),0,{}))/*]]>*/</script>
Info: Kode javascript di atas sudah admin enkripsi dan sudah admin sesuaikan dengan kode javascript sebelumnya, jika di edit tampilan header blog bisa berubah warna saat di scroll mungkin tidak akan berfungsi
- Jika sudah silahkan simpan template sobat dan lihat bagaimana hasilnya, semoga bermanfaat
