{"id":10921,"date":"2017-07-26T15:29:54","date_gmt":"2017-07-26T13:29:54","guid":{"rendered":"https:\/\/pogodnik.com\/widget-for-site"},"modified":"2026-09-02T13:03:22","modified_gmt":"2026-09-02T10:03:22","slug":"widget-for-site","status":"publish","type":"page","link":"https:\/\/pogodnik.com\/en\/widget-for-site","title":{"rendered":"Weather widget &#8211; Weather widget for website"},"content":{"rendered":"<style>@media (max-width: 640px){.inforomerSetup table,.inforomerSetup tbody,.inforomerSetup tr,.inforomerSetup td{display:block !important;width:auto !important;max-width:100% !important;vertical-align:top !important}.inforomerSetup td{padding-left:0 !important;padding-right:0 !important}.inforomerSetup pre,.inforomerSetup code,.inforomerSetup textarea{max-width:100% !important;box-sizing:border-box !important;white-space:pre-wrap !important;overflow-wrap:break-word !important;word-break:break-all !important;text-align:left !important;font-size:12px !important}.inforomerSetup textarea{width:100% !important}}<\/style>\n<div class=\"inforomerSetup\" style=\"max-width: 1080px; margin: 0 auto; padding: 24px clamp(12px, 4vw, 20px) 48px; box-sizing: border-box; overflow-x: hidden; overflow-wrap: break-word; font-size: clamp(16px, 2.2vw, 18px); line-height: 1.6; color: #22333a;\">\n<h1 style=\"margin: 0 0 20px; font-size: clamp(30px, 8vw, 44px); line-height: 1.12; font-weight: 700; letter-spacing: -0.015em; color: #14343d;\">Weather widget for website<\/h1>\n<p><script>function showCode (that) { that.parentElement.previousElementSibling.previousElementSibling.style.display = \"block\"; that.parentElement.previousElementSibling.style.display = \"none\"; that.parentElement.style.display = \"none\"; that.parentElement.parentElement.style.verticalAlign = \"top\"; return false; }<\/script><\/p>\n<div style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 14px; padding: clamp(18px, 5vw, 30px) clamp(16px, 5vw, 32px);\">\n<p style=\"margin: 0 0 14px; max-width: 76ch; text-wrap: pretty;\">Weather informers (widgets) for your website or blog are a useful service for your visitors! There is an option a weather widget that shows a forecast for one city that you have specified, as well as with the definition of the user&#8217;s city by IP, which is determined automatically, or a type of informer with a city search right in the weather widget!<\/p>\n<p style=\"margin: 0; max-width: 76ch; text-wrap: pretty;\">Our weather widget will be a harmonious addition to your website design. You will be able to match the color and layout. It will make it easy to place it where it will be most convenient and useful!<\/p>\n<\/div>\n<div style=\"margin-top: 26px; background: #235f6d; border-radius: 14px; padding: clamp(20px, 5vw, 30px) clamp(16px, 5vw, 32px); color: #ffffff;\">\n<h2 style=\"margin: 0 0 10px; font-size: clamp(24px, 6.5vw, 32px); line-height: 1.15; font-weight: 700; letter-spacing: -0.015em; color: #ffffff; max-width: 28ch;\">Free HTML weather widget for your website.<\/h2>\n<h3 style=\"margin: 0 0 16px; font-size: 16px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #ffffff;\"><b>Informer is easy!<\/b><\/h3>\n<p style=\"margin: 0 0 14px; max-width: 74ch; color: #ffffff; text-wrap: pretty;\">Installing a weather informer on your site is free: get the ready-made HTML code of the weather widget, paste it into your page \u2014 and the weather forecast for today, tomorrow and 14 days appears on your website.<\/p>\n<p style=\"margin: 0; max-width: 74ch; color: #ffffff; text-wrap: pretty;\">The free HTML weather widget works on any CMS \u2014 WordPress, Joomla, Drupal, MODX or a plain HTML site, detects the visitor&#8217;s city automatically and requires no registration. Need help? Fill out the form <a style=\"color: #ffffff; text-decoration: underline; text-underline-offset: 3px;\" href=\"https:\/\/pogodnik.com\/en\/contacts\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"Contact page: get help installing the weather widget\">on the contact page<\/a>, specifying the URL of your site in the subject line, and our specialists will help you in setting the weather widget!<\/p>\n<\/div>\n<h2 style=\"margin: 44px 0 6px; font-size: clamp(22px, 5.5vw, 28px); line-height: 1.15; font-weight: 700; letter-spacing: -0.015em; color: #14343d;\"><b>We offer several types and types of weather informers on the site.<\/b><\/h2>\n<div style=\"height: 3px; width: 60px; background: #54acc0; border-radius: 2px;\"><\/div>\n<div style=\"margin-top: 28px; border: 1px solid #d8ebef; border-radius: 14px; overflow: hidden;\">\n<h3 style=\"margin: 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; background: #f7fcfd; border-bottom: 1px solid #e6f2f5; padding: 18px clamp(15px, 4vw, 26px); font-size: clamp(19px, 4.6vw, 23px); line-height: 1.25; font-weight: 600; color: #235f6d;\"><span style=\"flex: none; background: #235f6d; color: white; font-size: 14px; font-weight: 700; letter-spacing: 0.05em; padding: 4px 10px; border-radius: 6px;\">Type 1.<\/span> Universal GEO weather informer for the website.<\/h3>\n<div style=\"padding: clamp(18px, 4vw, 26px);\">\n<h4 style=\"margin: 0 0 20px; font-size: clamp(17px, 2.6vw, 19px); font-weight: 500; line-height: 1.5; color: #235f6d; max-width: 88ch;\"><span style=\"background-color: #fff6cc; padding: 2px 6px; border-radius: 4px;\">A universal weather widget suitable for any site on any CMS.<\/span><\/h4>\n<ul style=\"list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px clamp(16px, 3vw, 28px); font-size: clamp(16px, 2.2vw, 17px); color: #33474e;\">\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Automatic detection of visitor location!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Ability to search live weather forecasts for any city directly in the weather widget!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Forecast for today and tomorrow!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Intelligent algorithms for determining the location!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Weather informer does not create load on your site and does not slow it down!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Ability to install on almost any site!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Block size 200\u00d7240.<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Help in installing a weather informer from our specialists!<\/li>\n<\/ul>\n<div style=\"margin-top: 26px; display: flex; justify-content: center;\">\n<div style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 14px; max-width: 100%; text-align: center;\"><table style=\"font-family: tahoma, arial, helvetica, sans-serif; font-size: 12px;\">\n    <tbody>\n    <tr>\n        <td>\n            <div style=\"height: 240px; width:200px; position: relative;\">\n                <iframe loading=\"lazy\" style=\"background: none repeat scroll 0 0 white; border: 0 solid #000000;\"\n                        src=\"https:\/\/pogodnik.com\/en\/informer\/daily\" width=\"200\" height=\"240\" frameborder=\"0\" scrolling=\"no\"\n                        onload=\"document.querySelector('.pogodnik_com_img').style.display='none';\"><\/iframe>\n                <a class=\"pogodnik_com_img\" href=\"https:\/\/pogodnik.com\/en\">\n                    \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u0440\u043e\u0433\u043d\u043e\u0437 \u043f\u043e\u0433\u043e\u0434\u044b \u043d\u0430\n                    <img width=\"200\" height=\"240\"decoding=\"async\" style=\"position: absolute; top: 0; left: 0;\" src=\"https:\/\/pogodnik.com\/cdn-cgi\/image\/width=200,height=240,fit=crop,quality=80,format=auto,onerror=redirect,metadata=none\/en\/images\/prognoz-pogody.png\" \/>\n                <\/a><\/div><\/td>\n        <td style=\"border: none; vertical-align: bottom; width: 100%; text-align: center; padding: 0 20px;\">\n            <div style=\"display: none;\">\n\n                <b>\u041a\u043e\u0434 \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438:<\/b>\n                <br><br><br>\n\n                <code>\n                    &lt;iframe width=\"200\" height=\"240\" frameborder=\"0\" scrolling=\"no\"\n                    src=\"https:\/\/pogodnik.com\/en\/informer\/daily\"&gt;\n                    \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u0440\u043e\u0433\u043d\u043e\u0437 \u043f\u043e\u0433\u043e\u0434\u044b \u043d\u0430\n                    &lt;a href=\"https:\/\/pogodnik.com\/en\"&gt;\n                    &lt;img src=\"https:\/\/pogodnik.com\/en\/images\/prognoz-pogody-200x240.png\"&gt;\n                    &lt;\/a&gt;\n                    &lt;\/iframe&gt;\n                <\/code>\n\n            <\/div>\n            <div class=\"code-background\"><\/div>\n            <div class=\"get-code\"><a href=\"#\" onclick=\"showCode(this);return false;\" id=\"show-informer-type1\">\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043a\u043e\u0434<\/a><\/div><\/td>\n    <\/tr>\n    <\/tbody>\n<\/table><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div style=\"margin-top: 32px; border: 1px solid #d8ebef; border-radius: 14px; overflow: hidden;\">\n<h3 style=\"margin: 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; background: #f7fcfd; border-bottom: 1px solid #e6f2f5; padding: 18px clamp(15px, 4vw, 26px); font-size: clamp(19px, 4.6vw, 23px); line-height: 1.25; font-weight: 600; color: #235f6d;\"><span style=\"flex: none; background: #235f6d; color: white; font-size: 14px; font-weight: 700; letter-spacing: 0.05em; padding: 4px 10px; border-radius: 6px;\">Type 2.<\/span> Universal GEO informer for a website with a 14-day forecast.<\/h3>\n<div style=\"padding: clamp(18px, 4vw, 26px);\">\n<h4 style=\"margin: 0 0 20px; font-size: clamp(17px, 2.6vw, 19px); font-weight: 500; line-height: 1.5; color: #235f6d; max-width: 88ch;\"><span style=\"background-color: #fff6cc; padding: 2px 6px; border-radius: 4px;\">The informer does not contain logos of weather sites, and looks like a block of your site, shows the forecast for 14 days in a pop-up modal window. Weather data is provided by the OpenWeatherMap.org service.<\/span><\/h4>\n<ul style=\"list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px clamp(16px, 3vw, 28px); font-size: clamp(16px, 2.2vw, 17px); color: #33474e;\">\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Automatic detection of visitor location!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Ability to search live weather forecasts for any city directly in the weather widget!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Forecast for today and tomorrow!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>14-day forecast, pop-up!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Intelligent algorithms for determining the location!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Weather informer does not create load on your site and does not slow it down!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Ability to install on almost any site!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Block size 200\u00d7240.<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Help in installing a weather informer from our specialists!<\/li>\n<\/ul>\n<div style=\"margin-top: 26px; display: flex; justify-content: center;\">\n<div style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 14px; max-width: 100%; text-align: center;\"><table style=\"font-family: tahoma, arial, helvetica, sans-serif; font-size: 12px;\">\n    <tbody>\n    <tr>\n        <td>\n            <!-- START CODE WIDGET -->\n            <script id=\"weather-forecast-informer\" src=\"https:\/\/pogodnik.com\/en\/content\/js\/daily_informer_with_chart.js\"><\/script>\n            <!-- START CODE WIDGET -->\n        <\/td>\n        <td style=\"border: none; vertical-align: bottom; width: 100%; text-align: center; padding: 0 20px;\">\n            <div style=\"display: none;\">\n                <!-- START CODE WIDGET FOR COPY -->\n                <b>\u041a\u043e\u0434 \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438:<\/b>\n                <br><br><br>\n                <code>\n                    &lt;script id=\"weather-forecast-informer\"\n                    src=\"https:\/\/pogodnik.com\/en\/content\/js\/daily_informer_with_chart.js\"&gt;&lt;\/script&gt;\n                <\/code>\n                <!-- END CODE WIDGET FOR COPY -->\n            <\/div>\n            <div class=\"code-background\"><\/div>\n            <div class=\"get-code\">\n                <a href=\"#\" onclick=\"showCode(this);return false;\" id=\"show-informer-type2\">\n                    \u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043a\u043e\u0434\n                <\/a>\n            <\/div>\n        <\/td>\n    <\/tr>\n    <\/tbody>\n<\/table><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div style=\"margin-top: 32px; border: 1px solid #d8ebef; border-radius: 14px; overflow: hidden;\">\n<h3 style=\"margin: 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; background: #f7fcfd; border-bottom: 1px solid #e6f2f5; padding: 18px clamp(15px, 4vw, 26px); font-size: clamp(19px, 4.6vw, 23px); line-height: 1.25; font-weight: 600; color: #235f6d;\"><span style=\"flex: none; background: #235f6d; color: white; font-size: 14px; font-weight: 700; letter-spacing: 0.05em; padding: 4px 10px; border-radius: 6px;\">Type 3.<\/span> A standard customizable informer &#8211; a weather widget for a website.<\/h3>\n<div style=\"padding: clamp(18px, 4vw, 26px);\">\n<h4 style=\"margin: 0 0 20px; font-size: clamp(17px, 2.6vw, 19px); font-weight: 500; line-height: 1.5; color: #235f6d; max-width: 88ch;\">Standard weather widget is ideal for regional sites when the majority of visitors come from one region<\/h4>\n<ul style=\"list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 12px clamp(16px, 3vw, 28px); font-size: clamp(16px, 2.2vw, 17px); color: #33474e;\">\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Compact!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Wide range of colors!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Easy to install!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Lots of geolocations to choose from!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Weather informer does not create load on your site and does not slow it down!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Ability to install on almost any site!<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Select the block size.<\/li>\n<li style=\"display: flex; gap: 10px; align-items: baseline;\"><b style=\"flex: none; color: #2c7c8d;\">+<\/b>Help in installing a weather informer from our specialists!<\/li>\n<\/ul>\n<h4 style=\"margin: 30px 0 14px; font-size: clamp(18px, 3vw, 21px); font-weight: 700; line-height: 1.25; color: #14343d;\"><b>Four easy steps to install a weather widget on your website or blog:<\/b><\/h4>\n<ol style=\"list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; font-size: clamp(16px, 2.2vw, 17px); color: #33474e;\">\n<li style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 16px 18px;\"><span style=\"display: block; font-size: 26px; font-weight: 700; line-height: 1; color: #2c7c8d; margin-bottom: 8px;\">1<\/span>choose the default city;<\/li>\n<li style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 16px 18px;\"><span style=\"display: block; font-size: 26px; font-weight: 700; line-height: 1; color: #2c7c8d; margin-bottom: 8px;\">2<\/span>choose the &#8220;theme&#8221; of the informer;<\/li>\n<li style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 16px 18px;\"><span style=\"display: block; font-size: 26px; font-weight: 700; line-height: 1; color: #2c7c8d; margin-bottom: 8px;\">3<\/span>get the code according to the layout of the informer you need (horizontal or vertical);<\/li>\n<li style=\"background: #f1f8fa; border: 1px solid #d8ebef; border-radius: 12px; padding: 16px 18px;\"><span style=\"display: block; font-size: 26px; font-weight: 700; line-height: 1; color: #2c7c8d; margin-bottom: 8px;\">4<\/span>copy the informer code and paste it in the right place on your site.<\/li>\n<\/ol>\n<p style=\"margin: 26px 0 0; max-width: 92ch; color: #4a5c63; text-wrap: pretty;\">You can customize the colors of the weather widget so that it blends harmoniously with your website design. In order to set the background color of the iframe to be identical to the background color of your site, change the bgcolor parameter in the code you received.<\/p>\n<div id=\"selector\"><\/div>\n<div style=\"margin-top: 24px; border-top: 1px solid #e6f2f5; padding-top: 20px;\">\n<p style=\"margin: 0 0 16px; font-size: 16px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #235f6d;\"><strong>Select informer theme:<\/strong><\/p>\n<div style=\"text-align: center; max-width: 100%;\"><div id=\"informer_constructor\" class=\"selector\" data-site=\"https:\/\/pogodnik.com\/en\"\n     data-select-location-text=\"\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043e\u0440\u043e\u0434:\" data-previous-location-text=\"\u041f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b:\"><\/div><\/div>\n<\/div>\n<\/div>\n<\/div>\n<h2 style=\"margin: 48px 0 6px; font-size: clamp(22px, 5.5vw, 28px); line-height: 1.15; font-weight: 700; letter-spacing: -0.015em; color: #14343d;\">Weather widget FAQ<\/h2>\n<div style=\"height: 3px; width: 60px; background: #54acc0; border-radius: 2px; margin-bottom: 26px;\"><\/div>\n<div style=\"display: grid; gap: 16px;\">\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">Why does a website need a weather informer?<\/h3>\n<p style=\"margin: 0 0 12px; max-width: 84ch; color: #33474e; text-wrap: pretty;\">Weather informers (widgets) for your website or blog are a useful service for your visitors, which means they attract more traffic to your site and make it more visited.<\/p>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">What matters is that the informer is as useful as possible. There are several types of weather widget: an informer that shows the forecast for one city you specify, an informer that detects the visitor&#8217;s city by IP automatically, or a type of informer with a city search right in the weather widget.<\/p>\n<\/div>\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">How do I install the weather widget on my website?<\/h3>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">You do not need to be a programmer to install the informer. Copy the HTML code of the weather informer you need from this page and place it on your site wherever you want. If you need help, you can <a href=\"https:\/\/pogodnik.com\/en\/contacts\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"Contact page: get help installing the weather widget\">write to us<\/a> and we will help with placing the widget.<\/p>\n<\/div>\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">Is the weather widget for websites free?<\/h3>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">Yes. The HTML weather informer is free and requires no registration: choose the type of widget, get the ready-made code and paste it into your page.<\/p>\n<\/div>\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">Which CMS can the weather informer be installed on?<\/h3>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">The universal weather informer suits any site on any CMS \u2014 WordPress, Joomla, Drupal, MODX, OpenCart \u2014 and plain HTML sites. The code can be pasted anywhere in a page, in a template or in a sidebar widget.<\/p>\n<\/div>\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">Does the weather widget slow down the website?<\/h3>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">No. The weather informer does not create load on your site and does not slow it down: the data is loaded from our server and the forecast updates automatically.<\/p>\n<\/div>\n<div style=\"border: 1px solid #d8ebef; border-radius: 12px; padding: clamp(16px, 4vw, 22px) clamp(16px, 4vw, 24px);\">\n<h3 style=\"margin: 0 0 8px; font-size: clamp(18px, 3vw, 20px); font-weight: 700; line-height: 1.3; color: #14343d;\">Can the informer colors be matched to my website design?<\/h3>\n<p style=\"margin: 0; max-width: 84ch; color: #33474e; text-wrap: pretty;\">Yes. You can choose the informer theme, the layout (horizontal or vertical) and the block size. To set the background color of the iframe to be identical to the background color of your site, change the bgcolor parameter in the code you received.<\/p>\n<\/div>\n<\/div>\n<p><script type=\"application\/ld+json\">{\"@context\":\"https:\/\/schema.org\",\"@type\":\"FAQPage\",\"@id\":\"https:\/\/pogodnik.com\/en\/informer#faq\",\"inLanguage\":\"en\",\"mainEntity\":[{\"@type\":\"Question\",\"name\":\"Why does a website need a weather informer?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Weather informers (widgets) for your website or blog are a useful service for your visitors, which means they attract more traffic to your site and make it more visited. What matters is that the informer is as useful as possible. There are several types of weather widget: an informer that shows the forecast for one city you specify, an informer that detects the visitor's city by IP automatically, or a type of informer with a city search right in the weather widget.\"}},{\"@type\":\"Question\",\"name\":\"How do I install the weather widget on my website?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"You do not need to be a programmer to install the informer. Copy the HTML code of the weather informer you need from this page and place it on your site wherever you want. If you need help, you can write to us and we will help with placing the widget.\"}},{\"@type\":\"Question\",\"name\":\"Is the weather widget for websites free?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Yes. The HTML weather informer is free and requires no registration: choose the type of widget, get the ready-made code and paste it into your page.\"}},{\"@type\":\"Question\",\"name\":\"Which CMS can the weather informer be installed on?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"The universal weather informer suits any site on any CMS \u2014 WordPress, Joomla, Drupal, MODX, OpenCart \u2014 and plain HTML sites. The code can be pasted anywhere in a page, in a template or in a sidebar widget.\"}},{\"@type\":\"Question\",\"name\":\"Does the weather widget slow down the website?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"No. The weather informer does not create load on your site and does not slow it down: the data is loaded from our server and the forecast updates automatically.\"}},{\"@type\":\"Question\",\"name\":\"Can the informer colors be matched to my website design?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Yes. You can choose the informer theme, the layout (horizontal or vertical) and the block size. To set the background color of the iframe to be identical to the background color of your site, change the bgcolor parameter in the code you received.\"}}]}<\/script><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Weather widget for website Weather informers (widgets) for your website [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"site-sidebar-layout":"default","site-content-layout":"plain-container","ast-site-content-layout":"full-width-container","site-content-style":"unboxed","site-sidebar-style":"unboxed","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"default","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-10921","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/pages\/10921","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/comments?post=10921"}],"version-history":[{"count":"7","href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/pages\/10921\/revisions"}],"predecessor-version":[{"id":254855,"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/pages\/10921\/revisions\/254855"}],"wp:attachment":[{"href":"https:\/\/pogodnik.com\/en\/wp-json\/wp\/v2\/media?parent=10921"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}