Registration on the site https://openweathermap.org/ to receive the key.
Key generation page, https://home.openweathermap.org/api_keys
[weather-block city="..."] ... [/weather-block] - Defines an informer block. In the city parameter, enter the name of the city in English. In each block, for each country, the following tags apply.{weather-temp} - Temperature
{weather-value} - Weather{weather-icon} - [{THEME}/weather/icons/{weather-icon}.png]{weather-country} - Two-character country code{weather-humidity} - Humidity{weather-pressure} - Pressure {weather-wind} - Wind speed{weather-clouds} - Cloudiness
In Main.tpl <head> paste
<link rel="stylesheet" href="{THEME}/weather/icons/icons.css">
<style>
.weather {
background-color: #ffffff;
border-radius: 20px;
margin-top: 20px;
color: #6f707d;
border:solid 1px #0cc652;
box-shadow:5px 20px 39px 0 rgba(0,0,0,0.51);
transition:ease-in-out .3s
}
#heading{
font-size: 55px;
color: #2b304d;
}
.temp{
place-items: center;
}
.temp-details > p >span, .grey{
color: #a3acc1;
font-size: 12px;
}
.fa{
color: #a5a5b1
}
*:focus{
outline: none;
}
</style><script>
var timeNode = document.getElementById('time-node');
function getCurrentTimeString() {
return new Date().toTimeString().replace(/ .*/, '');
}
setInterval(
() => timeNode.innerHTML = getCurrentTimeString(),
1000
);
</script>Informar
[weather-block city="Batumi"]
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-12 col-md-4 col-sm-12 col-xs-12">
<div class="weather p-4">
<div class="d-flex">
<h6 class="flex-grow-1">{weather-city} / {weather-country}</h6>
<h6 class="small grey"><div id="time-node"></div></h6>
</div>
<div class="d-flex flex-column temp mt-5 mb-3">
<h1 class="mb-0 font-weight-bold" id="heading">{weather-temp} </h1>
<span class="small grey">{weather-value}</span>
</div>
<div class="d-flex">
<div class="temp-details flex-grow-1">
<p class="my-1">
<i class="uil-tear mr-2" aria-hidden="true"></i>
<span> {weather-humidity} </span>
</p>
<p class="my-1">
<i class="uil-temperature-empty mr-2" aria-hidden="true"></i>
<span> {weather-pressure} </span>
</p>
<p class="my-1">
<i class="uil-wind mr-2" aria-hidden="true"></i>
<span> {weather-wind} </span>
</p>
<p class="my-1">
<i class="uil-clouds mr-2" aria-hidden="true"></i>
<span> {weather-clouds} </span>
</p>
</div>
<div>
<img src="{THEME}/weather/icons/{weather-icon}.png" width="100px">
</div>
</div>
</div>
</div>
</div>
</div>
[/weather-block] 
Info
Please login to view information Auth!
Please login to view information Auth!
Tags:
0 Comments
Information
Users of Guests are not allowed to comment this publication.
Users of Guests are not allowed to comment this publication.