Cara Membuat Pemberitahuan pada Blog Saat JavaScript Dimatikan

Javascript saat ini banyak digunakan untuk memanipulasi dan menambah fungsi dari situs, tentunya harus didukung dengan browser yang dapat menjalankan script Javascript ini.

Versi sebelumnya kita masih menggunakan flash untuk membuat fitur tambahan seperti animasi dan video, hanya saja semakin berubahnya zaman dimana HTML sudah menjadi HTML 5 merubah flash menjadi lebih ringan yaitu dengan Javascript.

Menurut informasi yang saya dapatkan dari Wikipedia, JavaScript adalah bahasa pemrograman tingkat tinggi dan dinamis. JavaScript populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Google Chrome, Internet Explorer, Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT.

Disini kita akan menggunakan javascript untuk membuat sebuah notifikasi ketika ada browser yang mematikan fitur javascript pada browsernya, ini akan membantu sekali jika kita menggunakan javascript untuk disable copy paste yang ketika ada orang mematikan fitur Javascript lalu bisa melakukan copas pada blog. Nah ketika kita menggunakan script ini maka orang tersebut akan mendapatkan pemberitahuan bahwa ketika akan mengunjungi blog diharuskan untuk mengaktifkan fitur javascript pada browser.

Membuat Pemberitahuan pada  Blog Ketika Javascript Dinonaktifkan

1. Kode Javascript

Langkah pertama adalah kita harus meletakan baris kode javascript pada blog, letakan pada bagian sebelum </body>.

<noscript>
<div class='noscript'>
  <p><span>&#9888;</span></p>
  <p>Diperlukan JavaScript untuk melihat konten situs kami.</p>
  <p>Tolong aktifkan javascript!</p>
</div>
</noscript>

2. Kode CSS

Setelah kita memiliki kode untuk eksekusi pemberitahuan maka kita juga harus membuat tampilan dari pemberitahuan tersebut, caranya dengan meletakan baris kode berikut sebelum </b:skin> jika menggunakan Blogspot, dan jika menggunakan WordPress maka letakan pada file style.css.

body,html{overflow:hidden}
.noscript{background:#03a9f4;color:#fff;padding:8% 0 0 0;position:fixed;bottom:0;left:0;top:0;right:0;z-index:1000;height:auto;-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hide;}
.noscript p{margin:0;text-align:center;padding:0 20px 10px 20px;margin:auto;font-size:2rem;line-height:1.5;font-family:&#39;Julius Sans One&#39;, sans-serif;;max-width:1010px;text-transform:uppercase;font-weight:400;}
.noscript p span{color:red;font-size:10rem;line-height:normal;font-weight:normal;}

Jika tampilan tidak rapih dan tidak rapih, silahkan pakai kode berikut dan letakan sebelum </head>.

<noscript>
<style type='text/css'>
body,html{overflow:hidden}
.noscript{background:#03a9f4;color:#fff;padding:8% 0 0 0;position:fixed;bottom:0;left:0;top:0;right:0;z-index:1000;height:auto;-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hide;}
.noscript p{margin:0;text-align:center;padding:0 20px 10px 20px;margin:auto;font-size:2rem;line-height:1.5;font-family:&#39;Julius Sans One&#39;, sans-serif;;max-width:1010px;text-transform:uppercase;font-weight:400;}
.noscript p span{color:red;font-size:10rem;line-height:normal;font-weight:normal;}
</style>
</noscript>

Kesimpulan

Dengan ini fitur dan fungsi dari blog akan tetap berjalan tanpa adanya yang hilang, kenapa bisa? karena pengguna akan dipaksa untuk mengaktifkan fitur javascript pada browser agar fungsi pada blog dapat berjalan normal.

Tinggalkan komentar