Beranda
Blogger
Code

Menambahkan Widget Neon Preloader di Blogger (Loading RGB Keren)

Cara membuat icon preloader automatis di bawah blogger, Wedget neon preloader atau loading rgb di blogger, caramembuat preloader
Admin
Wedget neon preloader atau loading rgb di blogger
Wedget neon preloader atau loading rgb di blogger

Blogger merupakan platform yang sangat fleksibel karena memungkinkan pengguna untuk melakukan berbagai kustomisasi tampilan sesuai kebutuhan. Salah satu fitur yang cukup populer adalah penambahan efek loading atau preloader, termasuk dengan gaya neon RGB yang terlihat modern dan menarik.

Dengan adanya efek neon preloader ini, blog akan menampilkan animasi loading saat halaman sedang diproses sebelum konten utama muncul. Hal ini tidak hanya memberikan kesan visual yang lebih profesional, tetapi juga membuat pengalaman pengunjung terasa lebih interaktif dan tidak membosankan saat menunggu halaman terbuka.

Pada artikel ini, kita akan membahas cara membuat dan menambahkan widget neon preloader di Blogger dengan metode yang ringan, aman digunakan, serta tetap memperhatikan aspek SEO agar tidak mengganggu performa maupun kecepatan loading blog.

Apa Itu Neon Preloader?

Neon preloader adalah animasi loading yang muncul sebelum halaman blog selesai dimuat. Biasanya berbentuk efek cahaya neon atau RGB yang bergerak.

Fungsi utama dari widget neon preloader di Blogger adalah memberikan pengalaman visual yang lebih baik kepada pengunjung saat halaman sedang dimuat. Efek ini membantu menciptakan kesan bahwa blog sedang memproses konten dengan lebih interaktif dan tidak kosong saat loading.

Fungsinya:

  • Memberikan efek loading yang lebih menarik dan modern
  • Meningkatkan tampilan blog agar terlihat lebih profesional
  • Meningkatkan kenyamanan dan pengalaman pengguna saat mengakses halaman

Kelebihan Menggunakan Preloader

Selain berfungsi sebagai animasi loading, penggunaan preloader juga memiliki beberapa kelebihan yang dapat meningkatkan kualitas tampilan blog secara keseluruhan.

  • Tampilan blog menjadi lebih modern dan tidak terlihat kaku
  • Memberikan kesan website yang lebih profesional dan terawat
  • Menyamarkan proses loading agar pengunjung tidak melihat halaman kosong
  • Dapat dikustomisasi sesuai tema, warna, dan identitas blog

Cara Memasang Widget Neon Preloader di Blogger

  • 1. Masuk ke Dashboard Blogger

    Login ke akun Blogger kamu, lalu pilih blog yang ingin kamu edit atau pasang widget neon preloader.

  • 2. Masuk ke Menu Theme

    Pilih menu Theme kemudian klik Edit HTML untuk membuka kode template blog kamu.

  • 3. Cari Tag Body

    Gunakan fitur pencarian dengan menekan CTRL + F lalu ketik:

    <body>

    Setelah ketemu, kamu akan menambahkan kode widget tepat di bawah tag tersebut.

4. Tambahkan Kode Preloader



  <!--[ HTML and Javascript: Neon Lighting ]-->
<div class='rahLght'/>
<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}('8 1=i;9 j(){8 a=[\'Q:0%\\m\',\'R\',\'S-T\',\'U\\V\',\'n{0%{W\',\'X\',\'Y-Z\',\'10:0;l\',\'t:\\B\\B;11\',\'12:0;13\',\'w:o%\\m\',\'14:0%\\2\',\'15{16\',\'17\',\'.h\',\'7}\\2@-18\',\'C,\\2.r\',\'\\2#19,\\2\',\':1a{1b\',\'w:1c\',\';1d:1e;\',\'1f:D;f\',\'s\\1g\',\'n:1h\',\'1i\',\'E.1j\',\'1k\',\'1l{0\',\'1m:1n;1o\',\'1p\',\'1q\',\'50%}}\',\'r\\1r\',\'1s\',\'1t-1u\',\'1v/1w\',\'%}50%{1x\',\'32);1y\',\'1z\',\'-1A:\',\'#1B,#4\',\'1C\',\'1D:1E\',\'1F:o%\',\';1G:.\',\'1H,\\2#1I\',\'1J\',\'\\2.h:\',\'1K\',\'1L:1M\',\',\\2#1N,\',\'1O\',\'l::C,\',\'1P-1Q\',\'1R-1S\',\'1T%;-1U\',\'1V:1W\',\';1X\',\'1Y:l\',\'%{1Z\',\'20-21\',\'E::22\',\'%}o%{23\',\'0%\\m%}}@k\',\'(D)}\\2.r\',\'0%{24\',\'25\',\'w\\F\\26\',\'y:27;28\',\'29,\\2#2a\',\'n\\F\\2b\',\'2c\',\'2d\',\'2e\',\'2f\',\'n:0%\\m%}5\',\'2g\',\'\\2.h.\',\'2h-2i:\',\'r{2j\',\'l\\2k\\2l}\',\'2m\',\'2n\',\'t-2o\',\'2p\',\'2q:o%\',\'e;2r\',\'t:0;2s\',\'g,\\2#2t\',\'G\',\'2u:0;2v\',\'2w\',\'2x(-2y\',\'2z:2A;\',\'2B,\\2#31\',\'2C\',\'2D\\2E\',\'2F\',\'H::2G\',\'\\m%}o%{\',\'2H-2I\',\'2J\',\'H\',\'2K\',\'I\',\'2L\',\':2M;z-2N\',\'.h::\'];j=9(){p a};p j()}9 i(d,e){8 f=j();p i=9(a,b){a=a-(-2O+2P+-2Q*-2R);8 c=f[a];p c},i(d,e)}(9(a,b){8 c=i,q=a();2S(!![]){2T{8 d=3(c(2U))/(-2V*-x+2W*2X+-2Y)+-3(c(2Z))/(30*-33+34+35*36)*(3(c(37))/(-38*6+39+3a*J))+3(c(3b))/(3c*K+6*-3d+L*-3e)*(3(c(3f))/(-6*-3g+3h+J*-3i))+3(c(3j))/(-3k+3l+-3m)*(-3(c(3n))/(-3o+-3p+6*3q))+3(c(3r))/(3s*6+x*-3t+-3u)+3(c(3v))/(-x*3w+-3x*6+-3y*-3z)*(-3(c(3A))/(-3B*-3C+3D+6*-3E))+3(c(3F))/(6*-3G+-L*3H+-6*-3I);3J(d===b)3K;3L q[\'M\'](q[\'N\']())}3M(3N){q[\'M\'](q[\'N\']())}}}(j,3O*3P+3Q*6+3R));8 h=u[1(3S)+1(3T)](1(3U));h[1(O)][1(3V)](1(P)),u[1(3W)+1(3X)](1(3Y)+1(3Z),9(){8 d=1,A={\'I\':d(P),\'G\':9(a,b,c){p a(b,c)}};A[d(K)](40,9(){8 a=d;h[a(O)][a(41)](A[a(42)])},-43+44+45)});46 v=u[1(47)+1(48)](1(49));v[1(4a)]=1(4b),v[1(4c)+\'t\']=1(4d)+1(4e)+1(4f)+1(4g)+1(4h)+1(4i)+1(4j)+1(4k)+1(4l)+1(4m)+1(4n)+1(4o)+1(4p)+1(4q)+1(4r)+1(4s)+1(4t)+1(4u)+1(4v)+1(4w)+1(4x)+1(4y)+1(4z)+1(4A)+1(4B)+1(4C)+1(4D)+1(4E)+1(4F)+1(4G)+1(4H)+1(4I)+1(4J)+1(4K)+1(4L)+1(4M)+1(4N)+1(4O)+1(4P)+1(4Q)+1(4R)+1(4S)+1(4T)+1(4U)+1(4V)+1(4W)+1(4X)+1(4Y)+1(4Z)+1(51)+1(52)+1(53)+1(54)+1(55)+1(56)+1(57)+1(58)+1(59)+1(5a)+1(5b)+1(5c)+1(5d)+1(5e)+1(5f)+1(5g)+1(5h)+1(5i)+1(5j)+1(5k)+1(5l)+1(5m)+1(5n)+1(5o)+1(5p)+1(5q)+1(5r),u[1(5s)][1(5t)+\'d\'](v);',62,340,'|_0x37fdc8|x20|parseInt|||0x1||var|function||||||||rahLght|_0x1a92|_0x100a|||x2050||100|return|_0xa72cb6||||document|rahJsNeon|on|0x2|||_0x111274|x27|before|10px|ahLght|x205s|tSbld|vsbl|ciSIw|0x5|0x6c|0x6|push|shift|0xa5|0x79|tion|tor|und|positi|ar|x20infinit|backg|1644471hpyGhc|it|animati|bottom|posit|city|tra|sition|ter|conten|style|webki|FBBE01|after|hei|animeNe|top|auto|ght|x20animeNeo|animeNeo|112KIjhCz|vsb|addEventLi|nimeNeon|ex|9999|ba|head|stener|x20infinite|textConten|inear|grad|text|css|back|backgr|classList|position|EB4132|Loaded|nsition|al|ition|opacity|E01|EB41|DOMContent|59935jdMvTv|ty|visible|31A952|4dJzrYY|ground|pos|round|posi|200|webk|ilter|blur|visibilit|ckground|backgrou|kground|po|af|bac|backgro|createElem|x20line|none|opa|A952|FBB|x20linea|remove|1021405XDlzJi|add|1313855yJGNSK|10ysxJzM|ound|size|visibili|x201s|x20ease|ent|83580FvpEvy|keyframe|18pSAIrr|width|animatio|height|4086F4|eft|righ|25684ByRnXM|ient|45de|ion|fixed|086F4|appendChil|eyframes|x20a|background|afte|nd|positio|querySelec|1609712zRCFbP|type|5px|ind|0x917|0x627|0x16|0x27|while|try|0xaf|0x76c|0x1c1|0x9|0x1ea0|0x6e|0x4|||0x779|0xe8|0x9aa|0x3|0xd3|0x25de|0x5bb|0x66e|0xb2|0x39|0x48e|0x33f|0xc9|0xf7c|0x830|0x4bb|0xd1|0x1886|0x1f69|0x6dd|0x97|0x22eb|0x1eb1|0x41a3|0x7a|0x205a|0x9fd|0xc58|0x84|0x472|0x246d|0x36|0xd7|0xcb|0x2b|0x5d|0x485|0x141a|0xc7|0x1105|0x335|0x244e|if|break|else|catch|_0x54d93a|0x13|0x691|0x1fe7|0x16f42|0x78|0x80|0x8d|0xc8|0x99|0x9d|0xad|0xa8|setTimeout|0xc6|0x7b|0x2011|0x1df|0x2bde|const|0xc1|0xd0|0x8c|0x7c|0xa2|0xa0|0x7e|0x8f|0xbc|0x8b|0x87|0x70|0xd4|0x93|0x86|0x6d|0x6a|0x7d|0x9b|0xb9|0xa1|0x6f|0x6b|0xb1|0x90|0xa7|0x71|0xc4|0xac|0xa4|0xcd|0xb6|0x85|0x92|0xc2|0x82|0xd5|0x96|0xc5|0x9f|0xb8|0xc3|0x88|0xa9|0xcf|0xae|0x91|0x94|0xb7|0xbf|0x98|0xb3|0xcc|0x75|0xce||0xb0|0xab|0x8e|0xd2|0x95|0x83|0xb5|0x7f|0xa3|0xb4|0xaa|0x76|0x74|0xa6|0xbe|0x73|0x9a|0xba|0x77|0xca|0xc0|0x81|0x89|0xbd|0xbb|0x8a|0x9e|0x9c|0x72'.split('|'),0,{})) /*]]>*/</script>

Cara Kerja Widget

  • Saat halaman dibuka → preloader muncul
  • Saat halaman selesai load → preloader hilang otomatis
  • Memberikan efek loading modern

Tips Agar Aman Untuk SEO & AdSense

  • Gunakan animasi ringan
  • Hindari script obfuscated
  • Jangan buat loading terlalu lama
  • Pastikan blog tetap cepat

Kesimpulan

Widget neon preloader pada Blogger memang dapat memberikan nilai tambah dari sisi tampilan visual. Efek animasi loading dengan gaya neon atau RGB membuat blog terlihat lebih modern, interaktif, dan memberikan kesan bahwa website dikelola secara profesional.

Namun, penggunaan widget ini tetap harus diperhatikan dari sisi performa. Jika terlalu berat atau menggunakan script yang tidak optimal, preloader justru bisa memperlambat waktu loading halaman. Hal ini dapat berdampak pada pengalaman pengunjung, peningkatan bounce rate, serta penurunan kualitas Core Web Vitals yang menjadi salah satu faktor penting dalam SEO.

Oleh karena itu, penggunaan neon preloader sebaiknya dilakukan secara ringan dan efisien. Hindari animasi yang terlalu kompleks atau script yang tidak diperlukan. Prioritaskan kecepatan loading blog agar tetap ramah pengguna sekaligus sesuai dengan standar mesin pencari.

Jika digunakan dengan benar, widget ini bisa menjadi elemen tambahan yang mempercantik tampilan blog tanpa mengorbankan performa maupun keamanan AdSense.

FAQ post preloader neon

Apa itu widget neon preloader di Blogger?

Widget neon preloader adalah animasi loading dengan efek cahaya neon atau RGB yang muncul saat halaman blog sedang dimuat sebelum konten tampil sepenuhnya.

Apakah neon preloader aman untuk Blogger?

Aman digunakan selama script yang dipakai ringan, tidak menggunakan kode berbahaya (obfuscated), dan tidak memperlambat loading blog.

Apakah widget ini mempengaruhi SEO?

Bisa berpengaruh jika terlalu berat. Namun jika menggunakan versi ringan seperti CSS + JavaScript sederhana, tidak akan mengganggu SEO maupun Core Web Vitals.

Apakah perlu kemampuan coding untuk memasangnya?

Tidak perlu. Kamu hanya perlu copy dan paste kode ke dalam template Blogger pada bagian di bawah tag body.

Kenapa preloader tidak muncul di blog saya?

Biasanya karena kode tidak ditempatkan dengan benar, ada error di template, atau konflik dengan script lain di Blogger.

About the author

Admin
blog yang membahas tutorial Blogger, SEO, dan tips teknologi terbaru untuk membantu mengembangkan website dan meningkatkan penghasilan online.

Posting Komentar