Lompat ke konten Lompat ke sidebar Lompat ke footer

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

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

Widget Statistik Covid19




Saat ini virus COVID-19 telah menjadi pusat perhatian masyarakat dunia termasuk di negara kita Indonesia. Wabah ini telah menjangkiti penduduk yang ada hampir disemua negara.

Update terbaru per 27 April 2020, ada hampir 3 juta kasus orang diseluruh dunia telah terinfeksi virus jenis COVID-19, dilansir dari Tirto.id.

Agaknya kehadiran virus COVID-19 ini sangat mengerikan bagi semua orang. Oleh karena itu untuk membantu pemerintah menyebarkan informasi terkait COVID-19 kepada masyarakat.

Banyak Blogger ingin berpartisipasi menyebarkan informasi COVID-19 dengan cara memasang widget statistik update Corona pada situs mereka.

Jika widget COVID-19 yang telah terpasang pada situs maka secara tidak langsung anda sebagai Blogger turut membantu para pembaca situs untuk mengetahui update perkembangan terbaru terkait virus COVID-19.

Ada banyak widget statistik COVID-19 yang beredar diluaran sana tetapi menurut saya data yang paling valid untuk wilayah Indonesia adalah mengacu pada situs kawalcorona.com.

Mengapa harus memilih situs kawalcorona.com?

Alasannya yaitu karena situs tersebut akan secara otomatis memperbarui informasi data ketika terdapat data terbaru yang masuk dalam data base mereka.

Untuk memasang widget update COVID-19 di Blogger kita perlu memanfaatkan api dari situs kawalcorona.com. Lebih lanjut silakan langsung simak tutorial pemasangan widget update statistik COVID-19 berikut.


Cara Pasang Widget Update Statistik Virus Corona COVID-19

Sebelum anda memasang widget statistik Corona pada situs, sebaiknya anda telah memastikan bahwa kode pemanggil  jQuery telah terhapus pada template situs anda.

Jika kode pemanggil jQuery tidak dihapus atau dihilangkan maka cara pemasangan widget dengan menggunakan api tidak dapat bekerja.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script&gt

Jika terdapat  kode seperti di atas pada template situs anda maka silakan untuk dihapus terlebih dahulu.

Oke jika sudah maka sekarang saatnya anda memilih widget update statistik COVID-19 yang hendak dipasang pada situs anda. Terdapat 4 pilihan variasi widget yang nantinya dapat disesuaikan dengan selera anda masing-masing.



Widget Style 1

<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="bisablog-card">
<h2>DATA COVID-19 INDONESIA</h2>
<p>Positif: <span id="terjangkit"></span>
<br />Sembuh: <span id="sembuh"></span>
<br />Meninggal: <span id="meninggal"></span>&nbsp;
</p>
<span><em>(Data: kawalcorona.com)</em></span>
</div>

<style>
.bisablog-card {padding:1.5em; background: linear-gradient(45deg, #42a5f5, #2196f3)}
.bisablog-card h2, .bisablog-card p, .bisablog-card span {color:#fff}
.bisablog-card h2 {border-bottom:2px solid #fff}
.bisablog-card p {font-weight:bold}
</style>



Widget Style 2

<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>

Widget Style 3

<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="bisablog-card">
<div class="bisablog-info"><h2>DATA COVID-19 INDONESIA</h2></div>
<p class="bisablog-positif">&#128567 Positif: <span id="terjangkit"></span></p>
<p class="bisablog-sembuh">&#128522 Sembuh: <span id="sembuh"></span></p>
<p class="bisablog-meninggal">&#128557 Meninggal: <span id="meninggal"></span></p>
<div class="bisablog-info"><span><em>(Data: kawalcorona.com)</em></span></div>
</div>

<style>
.bisablog-card {padding: 5%; border:1px solid #eaeaea; background:#f4f4f4;border-radius:10px}
.bisablog-card p {color:#fff}
.bisablog-positif {background:#e53935}
.bisablog-sembuh {background:#43a047}
.bisablog-meninggal {padding:10px 7px; background:#546e7a}
.bisablog-positif, .bisablog-sembuh {padding:10px 7px; margin-bottom:1em}
.bisablog-info {text-align:center}
.bisablog-card p{font-weight:bold}
</style>

<script></script>



Cara Memasang Widget Update Statistik COVID-19 di Blogger

1. Buka akun Blogger anda.

2. Kemudian pergi ke Tata Letak > Tambah Gadget > pilih HTML/Javascript.

3. Masukan kode script sesuai dengan widget style yang telah anda pilih.

4. Klik save untuk menyimpan perubahan.

5. Terakhir silakan cek tampilan widget update statistik COVID-19 pada situs anda.

Penutup

Harapan dari seluruh umat manusia dari berbagai latarbelakang ras, agama, suku dan budaya adalah semoga pandemi Corona (Covid-19) cepat berlalu dan semoga keadaan seperti cepat pulih seperti sedia kala.

Demikian informasi mengenai “Cara Memasang Widget Statistik Update COVID-19 di Blogger”. Semoga bermanfaat dan terimakasih.

Sumber Kode: Bisablog.com