Hello sobat ICloudzer kali ini admin akan menjabarkan mengenai bagaimana caranya membuat notifikasi no internet atau tidak ada internet seperti aplikasi facebook
Info: Jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas secara bersama sama
Tidak ada internet
Jika kamu menjelajah website di perlukan kuota internet untuk bisa mengaksesnya, notifikasi tidak ada internet akan muncul jika kamu menonaktifkan website secara sengaja ataupun tidak sengaja (misal kehabisan paket data secara tiba tiba) nah kan ribet jadinya, so agar websitemu selalu online penggunaan notifikasi tidak ada internet sangat di rekomendasikan untuk di terapkan di dalam website mu
Mode mengambang
Agar lebih menarik tampilan notifikasi no internet nantinya akan tampil dalam mode mengambang, selain menarik hal tersebut sesuai seperti notikasi no internet pada aplikasi facebook, karena sesuai judulnya aja ok
Mirip aplikasi facebook
Jika kamu pengguna facebook atau lebih tepatnya versi facebook lite (yang mode ringan), kamu akan melihat contoh notifikasi no internet tersebut jika kamu mengakses facebook tanpa menggunakan internet, atau jika kamu secara sengaja menonaktifkan data saat sedang menjelajah facebook maka notif tidak ada internet akan muncul, jika kembali online (alias menghidupkan data internet anda) notifikasi akan kembali muncul, yang menandakan anda bahwa anda sudah online kembali
Contoh Tampilan
Jika kamu penasaran dengan contoh tampilan notifikasi no internet di blogger silahkan non aktifkan paket data anda sekarang kemudian, lihat contoh tampilan no internet yang muncul, kemudian hidupkan kembali data internet anda, notifikasi popup no internet akan menghilang secara otomatis, bagaimana keren yak sobat
Cara pembuatan
Baiklah sobat sekarang saatnya admin akab membahas bagaiamana sih caranya membuat no internet connection di blogger, silahkan pelajari dan ikuti setiap arahan yang bakalan admin jelaskan di bawah ini yak
Kode Javascript
Baiklah sekarang silahkan anda salin kode javascript di bawah ini kemudian letakkan di atas kode </head>
<style>.rahtNtf53 span i.rahonWifi{background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.55a11 11 0 0 1 14.08 0'/><path d='M1.42 9a16 16 0 0 1 21.16 0'/><path d='M8.53 16.11a6 6 0 0 1 6.95 0'/><line x1='12' y1='20' x2='12.01' y2='20'/></svg>") center / 14px no-repeat} .rahtNtf53 span i.rahoffWifi{background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><line x1='1' y1='1' x2='23' y2='23'/><path d='M16.72 11.06A10.94 10.94 0 0 1 19 12.55'/><path d='M5 12.55a10.94 10.94 0 0 1 5.17-2.39'/><path d='M10.71 5.05A16 16 0 0 1 22.58 9'/><path d='M1.42 9a15.91 15.91 0 0 1 4.7-2.88'/><path d='M8.53 16.11a6 6 0 0 1 6.95 0'/><line x1='12' y1='20' x2='12.01' y2='20'/></svg>") center / 14px no-repeat}</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}('11 H=["\\j\\8\\v\\n\\b","\\s\\g\\b\\9\\8\\b\\12\\n\\b\\t\\b\\e\\8","\\8\\v\\c\\b","\\8\\b\\h\\8\\13\\s\\j\\j","\\8\\b\\h\\8\\W\\f\\e\\8\\b\\e\\8","\\T\\g\\9\\o\\8\\f\\9\\j\\8\\E\\8\\F\\w\\g\\9\\o\\8\\E\\8\\p\\F\\T\\g\\9\\o\\14\\e\\8\\b\\g\\e\\b\\8\\x\\m\\a\\j\\c\\n\\9\\v\\d\\e\\f\\e\\b\\15\\a\\t\\c\\f\\g\\8\\9\\e\\8\\y\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\c\\f\\j\\a\\8\\a\\f\\e\\d\\p\\a\\h\\b\\m\\k\\n\\b\\p\\8\\d\\A\\D\\c\\h\\k\\z\\f\\8\\8\\f\\t\\d\\r\\M\\l\\c\\h\\k\\m\\a\\j\\c\\n\\9\\v\\d\\a\\e\\n\\a\\e\\b\\r\\p\\n\\b\\h\\k\\9\\n\\a\\B\\e\\r\\a\\8\\b\\t\\j\\d\\s\\b\\e\\8\\b\\g\\k\\8\\b\\h\\8\\r\\9\\n\\a\\B\\e\\d\\s\\b\\e\\8\\b\\g\\k\\U\\J\\j\\8\\a\\p\\v\\r\\s\\f\\e\\8\\b\\e\\8\\d\\s\\b\\e\\8\\b\\g\\k\\P\\r\\a\\e\\m\\b\\h\\d\\K\\K\\K\\K\\k\\z\\9\\s\\L\\B\\g\\f\\J\\e\\m\\d\\T\\C\\A\\C\\A\\C\\A\\k\\s\\f\\n\\f\\g\\d\\g\\B\\z\\9\\N\\A\\q\\q\\F\\A\\q\\q\\F\\A\\q\\q\\F\\w\\V\\O\\k\\p\\f\\e\\8\\r\\j\\a\\P\\b\\d\\u\\D\\c\\h\\k\\z\\f\\g\\m\\b\\g\\r\\g\\9\\m\\a\\J\\j\\d\\C\\c\\h\\k\\c\\9\\m\\m\\a\\e\\B\\d\\u\\C\\c\\h\\i\\A\\D\\c\\h\\k\\z\\f\\h\\r\\j\\o\\9\\m\\f\\I\\d\\l\\i\\q\\c\\h\\i\\C\\q\\c\\h\\i\\g\\B\\z\\9\\N\\u\\D\\K\\F\\u\\q\\M\\F\\u\\X\\q\\F\\w\\C\\O\\k\\f\\c\\9\\s\\a\\8\\v\\d\\l\\k\\8\\g\\9\\e\\j\\a\\8\\a\\f\\e\\d\\9\\n\\n\\w\\u\\j\\i\\b\\9\\j\\b\\k\\9\\e\\a\\t\\9\\8\\a\\f\\e\\d\\j\\n\\a\\m\\b\\a\\e\\i\\q\\j\\i\\b\\9\\j\\b\\i\\p\\f\\g\\I\\9\\g\\m\\j\\k\\r\\I\\b\\z\\L\\a\\8\\r\\9\\e\\a\\t\\9\\8\\a\\f\\e\\d\\j\\n\\a\\m\\b\\a\\e\\i\\q\\j\\i\\b\\9\\j\\b\\i\\p\\f\\g\\I\\9\\g\\m\\j\\y\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\i\\a\\x\\s\\f\\e\\8\\b\\e\\8\\d\\Y\\Y\\k\\i\\I\\a\\m\\8\\o\\d\\u\\D\\c\\h\\k\\o\\b\\a\\B\\o\\8\\d\\u\\D\\c\\h\\k\\i\\m\\a\\j\\c\\n\\9\\v\\d\\a\\e\\n\\a\\e\\b\\r\\z\\n\\f\\s\\L\\k\\t\\9\\g\\B\\a\\e\\d\\l\\i\\q\\c\\h\\k\\f\\c\\9\\s\\a\\8\\v\\d\\w\\V\\y\\w\\Q\\8\\n\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\n\\b\\p\\8\\d\\9\\J\\8\\f\\k\\g\\a\\B\\o\\8\\d\\A\\D\\c\\h\\y\\i\\R\\L\\b\\v\\p\\g\\9\\t\\b\\j\\i\\j\\n\\a\\m\\b\\a\\e\\x\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\l\\y\\u\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\q\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\K\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\u\\l\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\l\\k\\z\\f\\8\\8\\f\\t\\d\\r\\M\\l\\c\\h\\k\\Z\\a\\j\\a\\z\\a\\n\\a\\8\\v\\d\\o\\a\\m\\m\\b\\e\\y\\y\\R\\r\\I\\b\\z\\L\\a\\8\\r\\L\\b\\v\\p\\g\\9\\t\\b\\j\\i\\j\\n\\a\\m\\b\\a\\e\\x\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\l\\y\\u\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\q\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\K\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\u\\k\\z\\f\\8\\8\\f\\t\\d\\A\\D\\c\\h\\y\\u\\l\\l\\G\\x\\f\\c\\9\\s\\a\\8\\v\\d\\l\\k\\z\\f\\8\\8\\f\\t\\d\\r\\M\\l\\c\\h\\k\\Z\\a\\j\\a\\z\\a\\n\\a\\8\\v\\d\\o\\a\\m\\m\\b\\e\\y\\y\\R\\t\\b\\m\\a\\9\\i\\j\\s\\g\\b\\b\\e\\i\\9\\e\\m\\i\\N\\t\\9\\h\\r\\I\\a\\m\\8\\o\\d\\M\\X\\V\\c\\h\\O\\x\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\t\\9\\g\\B\\a\\e\\r\\z\\f\\8\\8\\f\\t\\d\\q\\l\\c\\h\\y\\y\\i\\R\\t\\b\\m\\a\\9\\i\\j\\s\\g\\b\\b\\e\\i\\9\\e\\m\\i\\N\\t\\9\\h\\r\\I\\a\\m\\8\\o\\d\\q\\l\\l\\c\\h\\O\\x\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\n\\b\\p\\8\\d\\A\\l\\c\\h\\k\\g\\a\\B\\o\\8\\d\\A\\l\\c\\h\\k\\p\\f\\e\\8\\r\\j\\a\\P\\b\\d\\u\\C\\c\\h\\y\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\w\\g\\9\\o\\i\\j\\c\\9\\e\\F\\i\\w\\Q\\8\\n\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\w\\g\\9\\o\\i\\j\\c\\9\\e\\x\\n\\b\\p\\8\\d\\u\\A\\c\\h\\k\\g\\a\\B\\o\\8\\d\\u\\A\\c\\h\\k\\t\\9\\g\\B\\a\\e\\r\\z\\f\\8\\8\\f\\t\\d\\r\\u\\l\\c\\h\\k\\U\\J\\j\\8\\a\\p\\v\\r\\s\\f\\e\\8\\b\\e\\8\\d\\n\\b\\p\\8\\k\\8\\b\\h\\8\\r\\9\\n\\a\\B\\e\\d\\n\\b\\p\\8\\k\\p\\f\\e\\8\\r\\j\\a\\P\\b\\d\\u\\q\\c\\h\\k\\c\\9\\m\\m\\a\\e\\B\\d\\u\\l\\c\\h\\i\\A\\l\\c\\h\\k\\z\\f\\g\\m\\b\\g\\r\\g\\9\\m\\a\\J\\j\\d\\q\\c\\h\\y\\i\\w\\Q\\8\\n\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\w\\g\\9\\o\\i\\j\\c\\9\\e\\x\\U\\J\\j\\8\\a\\p\\v\\r\\s\\f\\e\\8\\b\\e\\8\\d\\g\\a\\B\\o\\8\\k\\8\\b\\h\\8\\r\\9\\n\\a\\B\\e\\d\\g\\a\\B\\o\\8\\y\\i\\w\\Q\\8\\n\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\n\\b\\p\\8\\d\\A\\l\\c\\h\\k\\g\\a\\B\\o\\8\\d\\A\\l\\c\\h\\y\\y\\i\\w\\m\\g\\16\\i\\w\\g\\9\\o\\8\\E\\8\\p\\q\\C\\i\\j\\c\\9\\e\\x\\z\\f\\h\\r\\j\\o\\9\\m\\f\\I\\d\\l\\i\\u\\l\\c\\h\\i\\D\\l\\c\\h\\i\\g\\B\\z\\9\\N\\l\\F\\l\\F\\l\\F\\w\\A\\O\\y","\\9\\c\\c\\b\\e\\m\\W\\o\\a\\n\\m","\\o\\b\\9\\m"];17 S=10[H[1]](H[0]);S[H[2]]=H[3];S[H[4]]=H[5];10[H[7]][H[6]](S)',62,70,'||||||||x74|x61|x69|x65|x70|x3A|x6E|x6F|x72|x78|x20|x73|x3B|x30|x64|x6C|x68|x66|x35|x2D|x63|x6D|x31|x79|x2E|x7B|x7D|x62|x32|x67|x33|x34|x4E|x2C|x25|_0xfdd5|x77|x75|x39|x6B|x37|x28|x29|x7A|x52|x40|rahJsNtf|x23|x6A|x38|x43|x36|x27|x76|document|var|x45|x2F|x49|x21|x4B|const'.split('|'),0,{}))/*]]>*/</script>
Info: Taruh di bawah kode <body> atau di atas kode </body> juga bisa, tapi kecepatan blog akan terpengaruh dengan peletakkan kode script
Kode HTML
Langkah selanjutnya silahkan cari kode <body> kemudian letakkan kode HTML di bawah ini tepat di bawah nya
<div class='rahtNtf53 rah' id='rahtoastNt53'></div>
Info: Jangan mengedit kode apapun sebab kode HTML di atas sudah sesuai dengan kode javascript
Kode Javascript
Dan terakhir silahkan cari kode </body> kemudian letakkan kode javascript di bawah ini tepat di atasnya, jika sudah simpan template dan lihat bagaimana hasilnya
<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}('C a=["\\f\\g\\g\\j\\9\\8\\b","\\9\\8\\8\\b\\e\\D\\E\\F\\s","\\G\\e\\c\\p\\k\\f\\c\\d\\k\\H\\k\\I\\J","\\K\\q\\b\\e\\L\\M\\b\\j\\b\\r\\k\\f\\e","\\h\\d\\m\\c\\8\\i\\h\\9\\l\\r\\j\\c\\d\\d\\t\\n\\e\\c\\p\\f\\g\\g\\u\\9\\g\\9\\n\\i\\h\\o\\9\\i\\v\\f\\q\\l\\w\\e\\b\\l\\x\\g\\g\\j\\9\\8\\b\\h\\o\\d\\m\\c\\8\\i","\\c\\y\\y\\N\\O\\b\\8\\k\\s\\9\\d\\k\\b\\8\\b\\e","\\f\\8\\j\\9\\8\\b","\\h\\d\\m\\c\\8\\i\\h\\9\\l\\r\\j\\c\\d\\d\\t\\n\\e\\c\\p\\f\\8\\u\\9\\g\\9\\n\\i\\h\\o\\9\\i\\v\\f\\q\\l\\w\\e\\b\\l\\x\\8\\j\\9\\8\\b\\h\\o\\d\\m\\c\\8\\i"];z[a[5]](a[0],A(){B[a[3]](a[2])[a[1]]=a[4]}),z[a[5]](a[6],A(){B[a[3]](a[2])[a[1]]=a[7]})',51,51,'||||||||x6E|x69|_0x468e|x65|x61|x73|x72|x6F|x66|x3C|x3E|x6C|x74|x20|x70|x27|x2F|x68|x75|x63|x4C|x3D|x57|x59|x41|x4F|x64|window|function|document|var|x48|x54|x4D|x23|x4E|x35|x33|x71|x79|x53|x45|x76'.split('|'),0,{}))/*]]>*/</script>
Info: Kode Javascript di atas sudah di enkripsi secara sederhana, so jangan mencoba untuk mengedit nya, jika ingin tampilannya berfungsi secara benar