Cara Memasang Widget Status Virus Corona (COVID-19) di Blogger

Banyak sekali jenis widget blogger yang bisa Anda pasang untuk menghiasi blog Anda, beberapa widget blog diantaranya memiliki fungsinya masing-masing seperti widget blog pada umumnya yaitu widget jam, kalender dan yang lainnya.

Namun pada kesempatan kali ini saya akan membagikan widget mengenai informasi pantauan status virus corona (covid-19) di Indonesia yang sekarang ini sedang mewabah hampir di seluruh dunia.

Oleh karena itu dengan adanya widget ini saya harap Anda atau pengunjung blog Anda dapat melihat informasi atau status perkembangan dari virus corona (covid-19) ini dengan tujuan agar kita saling mengingatkan untuk tetap berada #dirumahaja dalam beberapa waktu ini.

Oh iya, widget ini menggunakan API dari situs kawalcorona.com dan sumber datanya di ambil dari Kementerian Kesehatan dan JHU, sehingga akan selalu up to date dan akurat.

Mari kita sama-sama untuk mengetahui secara singkat mengenai apa itu virus corona, bagaimana covid-19 ini dapat menular, dan bagaimana cara untuk melindungi diri dari covid-19 di bawah ini.

Apa itu COVID-19 ?

Coronavirus Disease 2019 atau COVID-19 adalah penyakit baru yang dapat menyebabkan gangguan pada sistem pernapasan dan radang paru. Beberapa gejala yang dialami penderita virus ini diantaranya yaitu seperti gejala pada penderita flu biasa (batuk, pilek, nyeri kepala, nyeri tenggorokan, nyeri otot) sampai yang memiliki kompikasi berat (pneumonia atau spesis).

Bagaimana COVID-19 Menular ?

COVID-19 merupakan virus corona jenis baru sehingga para peneliti masih mempelajari bagaimana cara penularannya virus ini. Dari berbagai hasil penelitian, metode penyebaran dari virus covid-19 ini diduga melalui droplet saluran pernapasan dan kontak langsung dengan penderita.

Droplet merupakan partikel kecil dari mulut penderita yang dapat mengandung virus didalamnya, droplet ini dihasilkan pada saat batuk, bersin, atau berbicara. Droplet ini dapat menyebar sampai jarak tertentu biasanya 1 meter.

Penyebaran virus corona (covid-19) ini juga dapat melalui benda-benda di sekitar penderita pada saat batuk atau bersin. Namun, partikel droplet yang cukup besar ini tidak dapat bertahan atau mengendap di udara dalam waktu yang lama, tetapi masyarakat tetap harus waspada dan selalu menggunakan masker setiap saat.

Bagaimana Melindungi Diri dari COVID-19 ?

Ada beberapa langkah yang dapat Anda lakukan untuk mencegah atau membantu menghentikan penyebaran coronavirus ini, antara lain:

Tetap tinggal di rumah

Bekerja dari rumah, belajar dari rumah, dan beribadah di rumah.

Cuci tangan

Cuci tangan Anda sesering mungkin minimal 30 menit sekali, gunakan sabun dan air bersih atau gunakan hand sanitizer yang mengandung alkohol minimal 60%.

Bersihkan benda disekitar

Bersihkan dan disinfeksi permukaan benda yang sering disentuh.

Tutup mulut dan hidung

Jika Anda batuk dan bersin silahkan tutup dengan tisu atau siku bagian dalam, jika memungkinkan gunakan masker setiap saat.

Gunakan masker

Apabila Anda harus melakukan aktivitas di luar rumah silahkan gunakan masker dan ganti secara berkala.

Terapkan pola hidup sehat

Jangan lupa untuk terus menerapkan pola hidup sehat seperti makan makanan bergizi dan olahraga.

Bagimana Cara Memasang Widget Status Virus Corona di Blog ?

Setelah kita mempelajari sedikit mengenai coronavirus atau covid-19 di atas, sekarang kita mulai untuk memasang widget status virus corona (covid-19) di blogger, silahkan Anda ikuti langkah-langkahnya di bawah ini:

1. Masuk ke Blogger.

2. Klik pada bagian menu Tata Letak.

3. Lalu klik Tambahkan Gadget > HTML/JavaScript.

4. Masukan kode di bawah ini pada kolom Konten lalu klik Simpan.

<script>
$(document).ready(function(){var t=new Date;$("#date").html(t.getDate()+"/"+(t.getMonth()+1)+"/"+t.getFullYear()),$.ajax({url:"https://api.kawalcorona.com/indonesia/",success:function(t){$("#terjangkit").html(t[0].positif),$("#sembuh").html(t[0].sembuh),$("#meninggal").html(t[0].meninggal)}})});
</script>
<div class="vireorange img-card">
<div class="virecard-body">
<div class="d-flex">
<div class="virelogoindo"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJs4A_MK2IEHMuWM1lDEuTgsrcTMJRrJzr0gnGcd4VsyxlHJ7AhQU02dSg_N26vvYutQEc7Sd9_SSfOTn1WIGa39r5dMXXw6PcfSI73hcCdDqR9B-rz8dC6l2QxDIVTPcT_zN8J1Xi_ocF/" width="36" height="24" alt="Indonesia" title="Indonesia"/> </div>
<p class="vireupdate">Update Hari Ini: <span id="date"/></span></p>
<p class="virecountry">Data Pantauan COVID-19 Indonesia</p>
<p class="virecorona"> <span id="terjangkit" class="virepositif"/></span>Positif&nbsp;&nbsp;&nbsp;&nbsp;<span id="sembuh" class="viresembuh"/></span>Sembuh&nbsp;&nbsp;&nbsp;&nbsp;<span id="meninggal" class="viremeninggal"/></span>Meninggal</p>
</div></div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewbox="0 24 150 28" preserveaspectratio="none">
 <defs>
    <path id="gentle-wave" d="M-160 44c30 0 58-18 68-18s 58 18 88 18 58-18 98-5 58 18 88 18 v44h-352z" />
 </path></defs>
 <g>
   <use xlink:href="#gentle-wave" x="55" y="0" fill="rgba(34,49,63,0.03)"/>
   <use xlink:href="#gentle-wave" x="48" y="2" fill="rgba(34,49,63,0.03)"/>
   <use xlink:href="#gentle-wave" x="50" y="4" fill="rgba(34,49,63,0.03)"/>  
 </use></use></use></g>
</svg>
</div>
<style>
.virecard-body{margin:0;padding:20px;font-weight:500;position:relative;z-index:1}
.virelogoindo{float:right;position:relative;top:0;border-radius:5px;overflow:hidden}
.vireorange{position:relative;background:#f8f8f8;color:#535353;border-radius:10px}
.vireorange svg{position:absolute;bottom:0;left:0;right:0}
.virecountry{font-size:26px;font-weight:500;margin:0}
.virecorona{padding:10px 0 0 0;margin:0;font-size:14px;line-height:30px;overflow:auto}
.vireupdate{font-size:14px;margin:0 auto 10px auto}
.virepositif,.viresembuh,.viremeninggal{padding:3px 10px;color:#fff;border-radius:99em;margin:0 7px 0 0}
.virepositif{background:#f39c12}.viresembuh{background:#54a0ff}.viremeninggal{background:#ee5253}
.virewords{padding:5px 7px 5px 5px;background:#333333;border-radius:10px;align:center}
</style>

5. Lalu klik Simpan di tata letak blog Anda dan lihat hasilnya seperti di bawah ini.

See the Pen Corona Virus (Covid-19) Widget for Blogger by Ficri Pebriyana (@FicriPebriyana) on CodePen.

Catatan :

Apabila widget tidak muncul silahkan gunakan kode jQuery terbaru di blog Anda atau sisipkan kode ini di bawah kode widget covid-19.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

Kesimpulan

Widget informasi status ini dapat Anda gunakan untuk dipasang pada blog atau website Anda pribadi, selain untuk mengingatkan diri sendiri kita juga dapat mengingatkan orang lain yang sedang mengunjungi blog atau website Anda.

Besar harapan kita semua agar wabah ini segera hilang dan kita semua dapat menjalankan aktivitas seperti biasanya. Sekian artikel mengenai cara memasang widget status virus corona (covid-10) di blogger. Semoga bermanfaat.

Ficri Pebriyana

Blogger yang jarang nulis artikel :D

Bagikan Artikel ini