Thursday, March 26, 2020

Cara Membuat Widget Corona Update Terbaru Otomatis di Blogger dengan API Kawalcorona

Arief

Status Terbaru

  • Permohonan maaf

    Arief Rahmat Pamungkas memohon maaf kepada siapapun yang pernah merasa tersakiti oleh Saya. Semoga Anda berkenan memaafkan semua kesalahan dan kekhilafan Saya. Terima kasih
  • Permohonan Doa

    Semoga semua dosa-dosa semasa Kang Arief Rahmat Pamungkas hidup diampuni oleh Allah SWT, dan diterima amal ibadahnya, aaamiiin.. Terima kasih telah mendo'akan dan mengaminkan.

Karir

  • 2009 - Magang

    Announcer
    C Radio 88.7 FM
    Kota Banjar
  • 2010 - Kontrak

    Pramuniaga
    Ria Busana Grup
    Kota Bandung
  • 2010-2013 (Mandiri)

    Wiraswasta
    Arief Pulsa
    Kota Bandung
  • 2013 - Sekarang (Tetap)

    Staff Cashier Collection
    Finance Accounting
    PT. SAT, Tbk
    Balaraja - Tangerang

Project

Foto Arief

Contact Arief

Anda punya penawaran kerja sama?
sementara kosong

slot iklan


Mau membuat widget data terbaru corona di Indonesia buat di pasang di blog/blogger? Bagaimana cara membuat widget corona terupdate secara otomatis di blogger/blog? Ikuti panduan mudah berikut ini.


Sub Menu Utama

Widget corona update otomatis di blogger?


Iya, karena menggunakan api dari source https://api.kawalcorona.com/indonesia. Anda tidak perlu edit-edit html lagi. Anda hanya perlu memastikan jumlah yang tayang sesuai dengan situs aslinya demi menghindari disinformasi yang bisa berakibat fatal.

Widget corona update valid hari ini


Iya. Biasanya data terbaru jumlah positif corona di Indonesia update setiap hari mulai pukul 15.00 WIB atau setelah diumumkan secara resmi oleh juru bicara penanggulangan Covid-19 dari pemerintah, yaitu Bapak Ahmad Yurianto.

Widget blog corona valid amp?


Karena menggunakan javascript, maka tutorial cara membuat widget corona update terbaru otomatis di blogger ini belum bisa untuk template blog AMP. Tutorial widget lifetime corona ini sementara hanya untuk template blog non-AMP.

Widget blog corona gratis?


Iya, free. Widget blog corona ini gratis dari situs kawalcorona dengan api https://api.kawalcorona.com/indonesia.

Tutorial pasang widget corona di blog


Langsung saja saya anggap Anda sudah berada di menu edit html, lalu :


h1, h2, p{margin:0;}
  .title{text-align:center;}
.keterangan{font-size:90%;text-align:left;color:#ffffff;}
  .data {margin-top: 10px;display:flex;}
  .data .positif, .data .sembuh, .data .meninggal{width:30%;padding:10px;}
  .data .sembuh{margin: 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);}
  .emoji img{width: 50px;}
  .emoji{margin-left: auto !important}
  .angka{font-weight:600 !important;font-size:200%;}
  @media (max-width: 576px)
  {
   .keterangan{font-size:75%;}
   .data .sembuh{margin: 0 5px;
  }

Untuk mempermudah pencarian di html gunakan ctrl + f. Selanjutnya langkah kedua tinggal :


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
 <script>
  $(document).ready(function(){
   var d = new Date();
   var month = new Array();
   month[0] = "JANUARI";
   month[1] = "FEBRUARI";
   month[2] = "MARET";
   month[3] = "APRIL";
   month[4] = "MEI";
   month[5] = "JUNI";
   month[6] = "JULI";
   month[7] = "AGUSTUS";
   month[8] = "SEPTEMBER";
   month[9] = "OKTOBER";
   month[10] = "NOVEMBER";
   month[11] = "DESEMBER";
   $("#date").html(d.getDate() + " " + month[d.getMonth()] + " " + d.getFullYear());
   $.ajax({url: "https://api.kawalcorona.com/indonesia/", success: function(result){
    $("#positif").html(result[0].positif);
    $("#sembuh").html(result[0].sembuh);
    $("#meninggal").html(result[0].meninggal);
   }});
  });
 </script>

Simpan template. Selanjutnya masuk ke tata letak, pilih edit html. Kemudian copy dan paste kode berikut di tempat yang Anda mau :


<div class="title">
  <h1>COVID-19 ID</h1>
  <h2><span id="date"></span></h2>
 </div>
 <div class="data">
  <div class = "positif">
   <div class ="keterangan">
    <span>TOTAL POSITIF</span>
    <div id="positif" class="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 id="sembuh" class="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 WAFAT</span>
    <div id="meninggal" class="angka"></div>
    <span>ORANG</span>
   </div>
   <div class="emoji">
    <img src="https://kawalcorona.com/uploads/emoji-LWx.png" alt="Meninggal"></div>
   </div>
  </div>

Maka hasilnya akan seperti ini :


Demikianlah tutorial cara membuat widget blog update corona di Indonesia untuk blogger. Source : https://www.hobingoding.com