Kalian bisa lihat Contoh Widget yang saya pasang di blog seperti ini
Kalian bisa memasang widget ini di bawah post artikel atau di bawah widget home page..
Untuk Script nya kalian bisa Copy di bawah berikut
<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="indapkorange indapkshadow img-card">
<div class="indapkcard-body">
<div class="d-flex">
<div class="indapklogoindo"> <img src="https://kawalcorona.com/uploads/indonesia-PZq.png" width="50" height="50" alt="Positif" /> </div>
<p class="indapkcountry">COVID-19 INDONESIA</p>
<p class="indapkcorona"><b> <span id='terjangkit' class="indapkpositif"></span></b> POSITIF, <b><span id='sembuh' class="indapksembuh"></span></b> SEMBUH, <br/><b><span id='meninggal' class="indapkmeninggal"></span></b> MENINGGAL</p>
<p class="indapkupdate">Update Hari ini: <span id="date"></span></p>
</div></div></div>
<style>
.indapkcard-body {margin: 0;padding: 20px;position: relative;}
.indapkshadow{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}
.indapklogoindo {float: right;position: relative;top: 5px;}
.indapkorange {background: #55b0db;color: #fff !important;}
.indapkcountry{font-size:30px;margin:0px !important}
.indapkcorona{padding:5px 0px;margin:0px !important;line-height:30px}
.indapkupdate{font-size:20px;margin:0px !important}
.indapkpositif{padding:5px 7px 5px 5px;background: #f82649!important;}
.indapksembuh{padding:5px 7px 5px 5px;background: #09ad95!important;}
.indapkmeninggal{padding:5px 7px 5px 5px;background: #d43f8d !important;}
</style>
Untuk Cara Memasang Widget COVID- 19
- Buka Tata Letak
- Pilih Posisi yang anda Simpan
- Pilih HTML
- Paste Script dan Simpan
Comments