Seperti
yang kita ketahui bahwa saat ini Dunia tengah menghadapi bencana non alam yaitu
pandemi Corona atau Pandemi Covid-19. Termasuk di Indonesia, kasus korona atau
covid-19 ini tengah menjadi masalah serius yang melumpuhkan perekonomian,
pendidikan, dan lain sebagainya. Sebagai seorang blogger tentunya kita ingin
turut berpartisipasi dalam memberikan informasi update Statistik Virus Corona
atau Covid-19 di Blog kita. Jika sobat blogger ingin turut serta dalam memberikan
Update Statistik Virus Corona atau Covid-19 di Blog maka kalian dapat mengikuti
langkah-langkah Cara Memasang Widget Update Statistik Virus Corona atau
Covid-19 di Blog ini.
 |
| Cara Memasang Widget Update Statistik Virus Corona atau Covid-19 di Blog |
Dalam
widget Update Statistik Virus Corona atau Covid-19 di Blog ini nanti pengunjung
blog akan mengetahui Update Statistik Virus Corona atau Covid-19 di Blog kita
tentang Pasien yang Positif, Pasien yang sembuh dan pasien yang meninggal dan
diupdate setiap hari.
Pada
artikel Cara Memasang Widget Update Statistik Virus Corona atau Covid-19 di
Blog ini saya akan membagikan
bagaimana Cara Memasang Widget Update Statistik Virus Corona atau Covid-19
di Blog.
Widget
ini sudah responsive dan friendly dari versi Web maupun Mobile, ada 1 widget statistik Virus Corona atau Covid 19 yang akan saya share pada kesempatan ini.
Dengan memasang widget ini saya berharap supaya pengunjung blog kita dapat
mengetahui perkembangan virus corona atau covid-19 di Indonesia.
Cara
Memasang Widget Status Corona di Blog (Update)
1.
Silahkan login di blogger.com
2.
Pilih menu Tata Letak > klik + Add a Gadget > HTML/Javascript
3.
Terakhir copy dan paste kode dibawah ini pada widget tersebut.
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var
d = new Date();
$("#date").html(d.getDate()
+ "/" + (d.getMonth()+1) + "/" + d.getFullYear());
$.ajax({url:
"https://api.kawalcorona.com/indonesia/", success: function(result){
$("#terjangkit").html(result[0].positif);
$("#sembuh").html(result[0].sembuh);
$("#meninggal").html(result[0].meninggal);
}});
});
</script>
<div
class="jagoorange jagoshadow img-card">
<div
class="jagocard-body">
<div
class="d-flex">
<div
class="jagologoindo"> <img src="https://kawalcorona.com/uploads/indonesia-PZq.png"
width="50" height="50" alt="Positif">
</div>
<p
class="jagocountry">COVID-19 INDONESIA</p>
<p
class="jagocorona"><b> <span id='terjangkit'
class="jagopositif"></span></b> POSITIF,
<b><span id='sembuh' class="jagosembuh"></span></b>
SEMBUH, <br/><b><span id='meninggal'
class="jagomeninggal"></span></b> MENINGGAL</p>
<p
class="jagoupdate">Update Hari ini: <span
id="date"></p>
</div></div></div>
<style>
.jagocard-body
{margin: 0;padding: 20px;position: relative;}
.jagoshadow{box-shadow:
0 5px 10px rgba(19, 191, 166, 0.3) !important;}
.img-card:before
{content: '';position: absolute;background:
url(https://kawalcorona.com/data/images/svgs/circle.svg);background-position:
top right;background-repeat: no-repeat;width: 100%;height: 100%;opacity:
0.8;right:0px;top:0px}
.jagologoindo
{float: right;position: relative;top: 5px;}
.jagoorange
{background: #1589E3;color: #fff !important;}
.jagocountry{font-size:30px;margin:0px
!important}
.jagocorona{padding:5px
0px;margin:0px !important;line-height:30px}
.jagoupdate{font-size:20px;margin:0px
!important}
.jagopositif{padding:5px
7px 5px 5px;background: #f82649!important;}
.jagosembuh{padding:5px
7px 5px 5px;background: #09ad95!important;}
.jagomeninggal{padding:5px
7px 5px 5px;background: #d43f8d !important;}
</style>
4.
klik Simpan dan lihat hasilnya.
Sangat mudah
sekali bukan Cara Memasang Widget Update Statistik Virus Corona atau Covid-19
di Blog auto update, demikian artikel saya tentang Cara Memasang Widget Update
Statistik Virus Corona atau Covid-19 di Blog Semoga bermanfaat.
DEMO
Share This :
0 komentar