Embeding our COVID-19 widget - Coronavirus Widget

Our widget can easily be configured to display COVID-19 data for all available countries. Customize you COVID-19 widget with our Widget Code Generator.


Default widget preview

Embed

	<link rel="stylesheet" type="text/css" href="https://api.covid19ranking.com/css/covid19ranking-widget.css"/>
	<div class="covid19ranking covid-radius" data-country="USA"></div>
	<script src="https://api.covid19ranking.com/js/covid19ranking.js"></script>


Preview widget with customized layout

Embed

<link rel="stylesheet" type="text/css" href="https://api.covid19ranking.com/css/covid19ranking-widget.css"/><div class="covid19ranking blue covid-radius" data-country="France"></div><script src="https://api.covid19ranking.com/js/covid19ranking.js"></script>


Widget localization

Embed

<link rel="stylesheet" type="text/css" href="https://api.covid19ranking.com/css/covid19ranking-widget.css"/><div class="covid19ranking white covid-radius" data-country="Serbia" data-translate="Juče,Srbija,Svet,Slučajevi,Smrtnost"></div><script src="https://api.covid19ranking.com/js/covid19ranking.js"></script>


Widget embed


Embed code is constructed from 3 lines:

1.) CSS for layout
<link rel="stylesheet" type="text/css" href="https://api.covid19ranking.com/css/covid19ranking-widget.css"/>

2.) DIV element where widget will be rendered
<div class="covid19ranking covid-radius" data-country="COUNTRY_NAME"></div>

3.) JavaScript file that is requeired to grab and render the widget.
<script src="https://api.covid19ranking.com/js/covid19ranking.js"></script>
This is the proper order of emebd: CSS, DIV, JavaScript.


Configure widget to pull data for specific country


Change data-country attribute value to the specific country name. E.g. If you would like to pull data for France you should:
<div class="covid19ranking covid-radius" data-country="France"></div>

List of available countries


Here you can find a list of all countries suppored by our COVID-19 widget:

North America, Asia, South America, Europe, Africa, Oceania, , World, USA, India, Brazil, Russia, Colombia, Peru, Spain, Mexico, Argentina, South Africa, France, Chile, Iran, UK, Bangladesh, Iraq, Saudi Arabia, Turkey, Pakistan, Italy, Philippines, Germany, Indonesia, Israel, Ukraine, Canada, Bolivia, Ecuador, Qatar, Romania, Morocco, Belgium, Dominican Republic, Panama, Netherlands, Kazakhstan, Kuwait, Egypt, Oman, Sweden, UAE, Guatemala, Poland, Japan, Belarus, Honduras, Portugal, Ethiopia, Nepal, Venezuela, Costa Rica, Bahrain, Czechia, Nigeria, Singapore, Uzbekistan, Switzerland, Algeria, Moldova, Armenia, Ghana, Kyrgyzstan, Austria, Azerbaijan, Afghanistan, Palestine, Kenya, Paraguay, Lebanon, Ireland, Serbia, Libya, El Salvador, Australia, Bosnia and Herzegovina, Denmark, S. Korea, Hungary, Cameroon, Bulgaria, Ivory Coast, North Macedonia, Greece, Madagascar, Croatia, Senegal, Zambia, Tunisia, Sudan, Norway, Albania, Namibia, Malaysia, DRC, Guinea, Montenegro, Maldives, Myanmar, French Guiana, Tajikistan, Finland, Gabon, Haiti, Slovakia, Luxembourg, Jordan, Zimbabwe, Mozambique, Mauritania, Uganda, Jamaica, Malawi, Cabo Verde, Cuba, Djibouti, Eswatini, Slovenia, Nicaragua, Hong Kong, Equatorial Guinea, Congo, Georgia, Suriname, CAR, Rwanda, Angola, Guadeloupe, Lithuania, Trinidad and Tobago, Syria, Aruba, Bahamas, Réunion, Gambia, Mayotte, Thailand, Somalia, Sri Lanka, Estonia, Mali, Malta, Botswana, Guyana, South Sudan, Iceland, Benin, Guinea-Bissau, Sierra Leone, Yemen, Uruguay, Burkina Faso, Andorra, New Zealand, Belize, Togo, Cyprus, Latvia, French Polynesia, Lesotho, Liberia, Martinique, Niger, Chad, Vietnam, Sao Tome and Principe, San Marino, Diamond Princess, Turks and Caicos, Channel Islands, Sint Maarten, Papua New Guinea, Taiwan, Tanzania, Burundi, Comoros, Faeroe Islands, Eritrea, Gibraltar, Mauritius, Saint Martin, Isle of Man, Curaçao, Mongolia, Cambodia, Bhutan, Cayman Islands, Monaco, Barbados, Bermuda, Brunei, Seychelles, Liechtenstein, Antigua and Barbuda, Caribbean Netherlands, British Virgin Islands, St. Vincent Grenadines, Macao, St. Barth, Fiji, New Caledonia, Saint Lucia, Timor-Leste, Dominica, Grenada, Laos, Saint Kitts and Nevis, Saint Pierre Miquelon, Greenland, Montserrat, Falkland Islands, Vatican City, Western Sahara, MS Zaandam, Anguilla, China

Total - Coronavirus infected world wide.

Configure widget translation


Change or add data-translate attribute value with a comma separated values:
  1. Translate word: Yesterday
  2. Translate word: World
  3. Translate country name: Country name
  4. Translate word: Cases
  5. Translate word: Deaths

<div class="covid19ranking covid-radius" data-country="USA" data-translate="Yesterday,World,USA,Cases,Deaths"></div>

You needd to set all 5 values, if you want to skip any you can set an empty value(s) like this: Yesterday,,,Cases,Deaths
<div class="covid19ranking covid-radius" data-country="USA" data-translate="Yesterday,,,Cases,Deaths"></div>

Style widget skin


Three skins are available:
  1. Default - no class on main DIV element
    <div class="covid19ranking covid-radius" data-country="USA"></div>

  2. Blue - add class name "blue" to main DIV element
    <div class="covid19ranking blue covid-radius" data-country="USA"></div>

  3. White - add class name "white" to main DIV element
    <div class="covid19ranking white covid-radius" data-country="USA"></div>