hobingoding.com - Virus Corona yang mulai melanda Indonesia sejak bulan Maret tahun ini membuat banyak pihak khawatir dan was-was karena saking cepatnya penyebaran virus jenis baru ini.
Pemerintah bahkan telah menyediakan berbagai layanan pusat informasi mengenai kasus pandemi Covid-19 ini (lebih dikenal sebagai virus Corona). Adapun upaya pemerintah dalam menyebarkan informasi kepada masyarakat tentang kasus pandemi ini dimulai dari dirilisnya website covid19.go.id, kerjasama yang menghasilkan chatbot WhatsApp, dan bahkan berbagai pihak lain telah menyediakan kanal khusus untuk membagikan informasi mengenai virus Corona ini.
Untuk itu sesuai dengan judul postingan saya kali ini, saya disini akan membagikan cara menambahkan update informasi tentang virus Corona ini ke dalam blog yang kita miliki dengan memanfaatkan API yang disediakan oleh kawalcorona.com yang mengambil data dari Kementerian Kesehatan & JHU.
Catatan: Kamu dapat menyesuaikan API yang ingin kamu gunakan pada kawalcorona.com/api. Masing-masing API memberikan data yang berbeda sesuai dengan data yang dihasilkan*. (*data Global, data Indonesia, dan data Daerah)
Cara Memasang Update Virus Corona pada Widget atau Halaman Blog
1. Salin kode di bawah ini:
<style type="text/css">
p{margin:0}.update{text-align:center;color:#222;font-size:14px;text-transform:uppercase;}.indonesia-title{font-size:20px;font-weight:600}.keterangan{font-size:10px;text-align:left;color:#ffffff}.data{margin:5px 0 10px;display:flex}.data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:25%;padding:1.5rem 1.5rem;border-radius:5px;position:relative}.data .positif:before,.data .sembuh:before,.data .meninggal:before,.data .indonesia:before{content:'';position:absolute;background:url(https://kawalcorona.com/data/images/svgs/circle.svg);background-position-x:0%;background-position-y:0%;background-repeat:repeat;background-position:right;background-repeat:no-repeat;width:100%;height:100%;opacity:0.5;top:0;left:0}.data .sembuh{margin:0 10px}.data .indonesia{margin:0 0 0 10px}.data .positif{background:#f82649!important;display:flex;box-shadow:0 5px 10px rgba(167,66,153,0.3)}.data .sembuh{background:#09ad95!important;display:flex;box-shadow:0 5px 10px rgba(167,66,153,0.3)}.data .meninggal{background:#d43f8d!important;display:flex;box-shadow:0 5px 10px rgba(167,66,153,0.3)}.data .indonesia{background:#fc7303!important;display:flex;box-shadow:0 5px 10px rgba(167,66,153,0.3)}.emoji img{width:50px}.emoji{margin-left:auto!important;width:50px!important}.angka{font-weight:600!important;font-size:20px}.indonesia-detail{width:100px}@media screen and (max-width:768px){.data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:48.55%;padding:10px;border-radius:5px;position:relative}.indonesia-title{font-size:18px}.data{display:-ms-flexbox;-ms-flex-wrap:wrap;flex-wrap:wrap}.data .positif{margin:0 0 auto 0}.data .sembuh{margin:0 0 10px auto}.data .meninggal{margin:0}.data .indonesia{margin:auto 0 auto auto}.emoji{margin-left:auto!important;width:40px!important}}@media screen and (max-width:568px){.data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:48.55%;padding:10px;border-radius:5px;position:relative}.indonesia-title{font-size:18px}.data{display:-ms-flexbox;-ms-flex-wrap:wrap;flex-wrap:wrap}.data .positif{margin:0 0 auto 0}.data .sembuh{margin:0 0 10px auto}.data .meninggal{margin:0}.data .indonesia{margin:auto 0 auto auto}.emoji{margin-left:auto!important;width:40px!important}}@media screen and (max-width:468px){.data .positif,.data .sembuh,.data .meninggal,.data .data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:48.44%;padding:10px;border-radius:5px;position:relative}.indonesia-title{font-size:18px}.data{display:-ms-flexbox;-ms-flex-wrap:wrap;flex-wrap:wrap}.data .positif{margin:0 0 auto 0}.data .sembuh{margin:0 0 10px auto}.data .meninggal{margin:0}.data .indonesia{margin:auto 0 auto auto}.emoji{margin-left:auto!important;width:40px!important}}@media screen and (max-width:368px){.data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:100%;padding:10px;border-radius:5px;position:relative}.data .positif{margin:0}.data .sembuh{margin:10px 0 10px 0}.data .meninggal{margin:0 0 10px 0}.data .indonesia{margin:0}}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
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}('B C=["\\p\\9\\q\\a\\9\\5\\b","\\v\\1\\h\\5\\a\\9\\5\\b","\\c\\9\\5\\1\\l","\\9\\w\\5\\b\\x","\\c\\1\\b","\\p\\a\\q\\b","\\p\\a\\x\\b","\\9\\D\\a\\m\\l\\a\\m","\\m\\1\\w\\l\\1\\c\\h\\1\\5","\\r\\E\\l\\r\\h\\1\\5","\\q\\r\\F\\1\\c\\h\\1\\5","\\y\\1\\m\\1\\c\\h\\1\\5","\\8\\2\\3\\y\\0\\3\\2","\\G","\\8\\2\\3\\c\\4\\7\\3\\i","\\8\\2\\3\\v\\s\\d\\d\\H\\2\\0\\e","\\i\\3\\f\\d","\\I\\t\\0\\3\\2","\\i\\3\\3\\n\\g\\J\\o\\o\\0\\n\\6\\j\\K\\0\\L\\0\\d\\k\\4\\e\\4\\7\\0\\j\\k\\4\\f\\o\\6\\7\\t\\4\\7\\2\\g\\6\\0\\o","\\n\\4\\g\\6\\3\\6\\z","\\j\\k\\4\\e\\u\\n\\4\\g\\6\\3\\6\\z","\\g\\2\\f\\A\\s\\i","\\j\\k\\4\\e\\u\\g\\2\\f\\A\\s\\i","\\f\\2\\7\\6\\7\\8\\8\\0\\d","\\j\\k\\4\\e\\u\\f\\2\\7\\6\\7\\8\\8\\0\\d","\\0\\M\\0\\N","\\e\\2\\0\\t\\O"]',51,51,'x61|x45|x65|x74|x6F|x52|x69|x6E|x67|x41|x55|x49|x4D|x6C|x72|x6D|x73|x42|x68|x2E|x63|x54|x53|x70|x2F|x4A|x4E|x4F|x75|x64|x2D|x46|x50|x4C|x44|x66|x62|var|_0x2460|x47|x4B|x56|x20|x59|x23|x3A|x6B|x77|x6A|x78|x79'.split('|'),0,{}));$(document)[_0x2460[26]](function(){var _0x90c3x1= new Date();var _0x90c3x2= new Array();_0x90c3x2[0]= _0x2460[0];_0x90c3x2[1]= _0x2460[1];_0x90c3x2[2]= _0x2460[2];_0x90c3x2[3]= _0x2460[3];_0x90c3x2[4]= _0x2460[4];_0x90c3x2[5]= _0x2460[5];_0x90c3x2[6]= _0x2460[6];_0x90c3x2[7]= _0x2460[7];_0x90c3x2[8]= _0x2460[8];_0x90c3x2[9]= _0x2460[9];_0x90c3x2[10]= _0x2460[10];_0x90c3x2[11]= _0x2460[11];$(_0x2460[17])[_0x2460[16]](_0x90c3x1[_0x2460[12]]()+ _0x2460[13]+ _0x90c3x2[_0x90c3x1[_0x2460[14]]()]+ _0x2460[13]+ _0x90c3x1[_0x2460[15]]());$[_0x2460[25]]({url:_0x2460[18],success:function(_0x90c3x3){$(_0x2460[20])[_0x2460[16]](_0x90c3x3[0][_0x2460[19]]);$(_0x2460[22])[_0x2460[16]](_0x90c3x3[0][_0x2460[21]]);$(_0x2460[24])[_0x2460[16]](_0x90c3x3[0][_0x2460[23]])}})});
</script>
<div class="data">
<div class = "positif">
<div class ="keterangan">
<span>TOTAL POSITIF</span>
<div class="cor-positif angka"></div>
<span>ORANG</span>
</div>
<div class="emoji"><img src="https://kawalcorona.com/uploads/sad-u6e.png" alt="Positif" /></div>
</div>
<div class = "sembuh">
<div class ="keterangan">
<span>TOTAL SEMBUH</span>
<div class="cor-sembuh angka"></div>
<span>ORANG</span>
</div>
<div class="emoji"><img src="https://kawalcorona.com/uploads/happy-ipM.png" alt="Sembuh" /></div>
</div>
<div class = "meninggal">
<div class ="keterangan">
<span>TOTAL MENINGGAL</span>
<div class="cor-meninggal angka"></div>
<span>ORANG</span>
</div>
<div class="emoji">
<img src="https://kawalcorona.com/uploads/emoji-LWx.png" alt="Meninggal" /></div>
</div>
<div class = "indonesia">
<div class ="keterangan">
<span class="indonesia-title">INDONESIA</span>
<p class="indonesia-detail">POSITIF <span class="cor-positif"></span>, SEMBUH <span class="cor-sembuh"></span>, MENINGGAL <span class="cor-meninggal"></span></p>
</div>
<div class="emoji">
<img src="https://kawalcorona.com/uploads/indonesia-PZq.png" alt="Indonesia" /></div>
</div>
</div>
<div class="update">Update terakhir : <span id="date">/span></span></div>2. Silahkan pasang pada widget ataupun halaman yang kamu inginkan.
- Untuk memasang pada Widget, masuk ke dashboard Blogger > Tata Letak > Tambahkan Gadget > HTML / Javascript,
- Untuk memasang pada Halaman, masuk ke dashboard Blogger > Halaman > Halaman Baru > pilih mode HTML.
3. Tempelkan pada bagian yang kamu inginkan sesuai poin nomor dua di atas. Terakhir klik Simpan (untuk Widget) atau Publikasikan (untuk Halaman).
Berikut hasil tampilan dari widget yang ada di atas (untuk pemasangan pada widget blog):
Kamu juga dapat melakukan kustomisasi sendiri untuk membuat update informasi tentang virus Corona ini lebih menarik lagi untuk dibaca para pengunjung blog yang kamu miliki. Akhir kata demikianlah Cara Memasang Widget Update Virus Corona pada Blog, dan seperti biasa terima kasih.
