Tutorial Instalasi Widget Corona Di Blogger

Sekarang lagi booming, boomingnya masalah corona di seluruh dunia, saya doakan semuanya untuk diberi kesehatan selalu.Bicara soal corona bagi kamu yang berkeinginan memasang widget statistik corona menarik pada blogger gampang loh caranya, tanpa berlama-lama kita langsung menuju saja ke tutorialnya.

Mengenal Widget

Widget merupakan tampilan pada suatu website yang biasanya terletak pada bagian sidebar, header, maupun footer.Widget sendiri merupakan suatu komponen penting yang terdapat pada suatu website, akan tetapi jika website kita terlalu banyak widget itu justru akan menimbulkan efek negative pada website kita seperti contohnya loading pada blog kita menjadi lama dan masih banyak lagi.

Cara Memasang Widget Statistik Coronavirus Atau COVID-19 Di Blogger

1. Langkah pertama yang harus kalian lakukan adalah buka browser kalian terlebih dahulu dan masuk ke dalam dashboard blogger kalian.

2. Jika sudah, pilih tata letak pada bagian menu kiri dashboard.

3. Setelah itu pilih lokasi dimana kalian ingin menambahkan widget tersebut.

4. Jika kalian sudah menentukan lokasinya, selanjutnya pilih html/java script.

5. Jika sudah teratur posisi dan sudah terpilih html/javascript kalian copy kode di bawah ini dan pastekan pada kolom html/javascriptnya.

<style> .datax #show { width: 31%; float: left; text-align: center; } .positif, .sembuh, .meninggal { margin: 1%; border-radius: 5px; box-shadow: 0 1px 2px 2px rgba(0,0,0,.5); text-overflow: ellipsis; overflow: hidden; color: white; font-family: cursive; } .datax .positif { background: #f5a61f; } .datax .sembuh { background: #24c624; } .datax .meninggal { background: #ed2828; } #show .angka { font-size: 2em; font-weight: 700; } #show .detail { background: white; width: 100%; display: block; color: black; box-shadow: 0px -2px 4px 1px #66c7ff; } .datax .title { text-align: center; text-transform: uppercase; font-family: monospace; font-size:1em; } </style> <script> $(document).ready(function(){ var d = new Date(); var month = new Array(); month[0] = "Januari"; month[1] = "Februari"; month[2] = "Maret"; month[3] = "April"; month[4] = "Mei"; month[5] = "Juni"; month[6] = "Juli"; month[7] = "Agustus"; month[8] = "September"; month[9] = "Oktober"; month[10] = "November"; month[11] = "Desember"; $("#date").html(d.getDate() + " " + month[d.getMonth()] + " " + d.getFullYear()); $.ajax({url: "https://api.kawalcorona.com/indonesia/", success: function(result){ $("#positif").html(result[0].positif); $("#sembuh").html(result[0].sembuh); $("#meninggal").html(result[0].meninggal); }}); }); </script> <div class="datax"> <div class="title"> <h1>Update kasus covid-19 indonesia : <span id="date">24 Maret 2020</span></h1> </div> <div id="show" class="positif"> <div id="positif" class="angka">686</div> <span class="detail">Positif</span> </div> <div id="show" class="sembuh"> <div id="sembuh" class="angka">30</div> <span class="detail">Sembuh</span> </div> <div id="show" class="meninggal"> <div id="meninggal" class="angka">55</div> <span class="detail">Meninggal</span> </div> </div>

6. Jika sudah tinggal kalian klik simpan saja.
7. Selesai.

Penutup

Menurut kalian cara pembuatan widget statistik corona menurut tutorial yang saya berikan diatas bagaimana, cukup mudah bukan.Jika kamu mempunyai pertanyaan atau hal yang kurang paham bisa ditanyakan melalui kolom komentar dibawah dan jangan lupa untuk share artikel ini ke media sosial kalian, terima kasih.

Satria Fadhil M

Seorang keras kepala dengan keingintahuanya dan betah beberapa jam berhadapan dengan gadget.

Bagikan Artikel ini