Sabtu, 28 Maret 2020

Cara Memasang Widget Statistik Corona Covid-19 di Blogger Atau Wordpress Untuk Indonesia

Hallo semuanya warga indonesia terutama tuser parabola dan elektronika kita jaga bersama sama, melawan covid 19.
Kembali lagi bersama dengan Saya. Kali ini Saya akan berbagi tutorial cara memasang widget Statistik Corona Covid-19, melihat dunia yang semakin hari semakin tidak bersahabat, dan masyarakat yang sulit untuk di atur untuk melakukan social distance. Saya berharap dengan banyaknya para developer yang memasang widget ini maka dapat meningkatkan kesadaran masyarakat, karena mereka bakal tau kalau negeri tercintanya tidak baik-baik saja. 

Cara cegah covid 19 untuk anda Teknisi parabola

  1. 1. Pakai sarung tangan (plastik/karet) untuk melakukan tracking parabola.
  2. 2. Pakai masker untuk berangkat sampai pulang dari user
  3. 3. Tolak bersalaman sama user dan jaga jarak minimal 2 meter
  4. 4. Bawa cairan antiseptik/sabun untuk pembersih benda sesuatu yang akan dipegang dirumah user terutama uang
  5. 5. Berdoa
  6. 6. Lepas pakaian anda setelah sampai dirumah lalu rendam dengan sabun ( sangat baik air panas rendam 5 menit )
  7. 7. Jangan masuk rumah agar istri dan anak anda tidak tertular virus
  8. 8. Mandi yang bersih lalu, boleh masuk rumah
  9. 9. Rajin cuci tangan setelah pegang benda sesuatu
  10. 10. Makan gunakan sendok

Disini saya akan membagikan widget yang sama tetapi dengan dua gaya widget panjang dan persegi, jika kalian ingin memasannya di sidebar maka gunakan widget persegi, jika memasang di header dan panjang tempatnya maka gunakan widget panjang.

Untuk widget panjang sepei ini demonya:  
Berikut ini codenya: 

<style type="text/css">
/* Style widget Covid */
p{margin:0}.title-cov{text-align:center;color:#222;font-size:14px}.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:&#39;&#39;;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="title-cov">
 Sumber data : Kementerian Kesehatan & JHU. Update terakhir : <span id="date"></span>
</div>

1. Bepore Copy kode diatas lalu buka blog kalian. 
2. Kemudian pilih tab tata letak atau layout. 
3. Lalu pilih tambahkan gadget atau add a gadget. 
4. Pada jendela yang muncul pilih HTML/JavaScript. 
5. Terakhir paste kan kode nya di kolom kontent, judul DiRumah Aja. 

Untuk widget persegi sepei ini demonya:  

 

Berikut ini codenya :

<style type="text/css">
/* Style widget Covid */
p.indonesia-detail{margin:0!important}.title-cov{text-align:center;color:#222;font-size:14px}.indonesia-title{font-size:20px;font-weight:600}.keterangan{font-size:10px;text-align:left;color:#ffffff}.data{margin:5px 0 10px;display:block}.data .positif,.data .sembuh,.data .meninggal,.data .indonesia{width:100%;padding:0.5rem 1rem;border-radius:5px;position:relative}.data .positif:before,.data .sembuh:before,.data .meninggal:before,.data .indonesia:before{content:&#39;&#39;;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:10px 0 10px auto}.data .indonesia{margin:10px 0 0 0}.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}
 </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="title-cov">
 Sumber data : Kementerian Kesehatan & JHU. Update terakhir : <span id="date"></span>
</div>

 1. Copy kode diatas lalu buka blog kalian. 
2. Kemudian pilih tab tata letak atau layout.
3. Lalu pilih tambahkan gadget atau add a gadget. 
4. Pada jendela yang muncul pilih HTML/JavaScript. 
5. Terakhir paste kan kode nya di kolom kontent, judul DiRumah Aja. 

Jika ada kendala kesalahan atau error bisa ditanyakan di kolom komentar, 

Sekian semoga bermanfaat terimakasih. 
di
Label:

1 komentar:

Langganan: Posting Komentar (Atom)