- Додавання Simple Weather в WordPress вручну
- Погодні плагіни WordPress
- Weather and Weather Forecast Widget
- Weather Forecast WP Wunderground
- висновок
- джерело: WPLift.com
WordPress використовується в якості основної CMS різними сайтами. І хоча ці сайти сильно відрізняються один від одного можливостями, навігацією і інструментами, необхідними для їх роботи, WordPress з його великим каталогом плагінів здатний задовольнити більшість їх потреб.
Мені здавалося, що додавання прогнозу погоди на сайт на WordPress буде простим завданням. Я думав, що просто скопіюють і вставлю якийсь код на мої сторінки, і він буде працювати. Я забув, що я не можу приєднувати код всередину станиць і записів. Потім я зрозумів, що багато власників сайтів зіткнеться з цією ситуацією. Зокрема, сайти з подорожей, туризму, готелям, розвагам, транспорту і багато інших, які швидше за все захочуть розмістити прогноз погоди.
Якщо у вас немає сайту або ви ніколи не працювали з сайтами в цих нішах, то ви, швидше за все, думаєте, навіщо б люди хотіли додати ці потворні блоки на свої сайти? Насправді, ці прогнози погоди багатофункціональні. Наприклад, хороший прогноз погоди може допомогти користувачеві вирішити, чи потрібно йому кудись їхати. Він також може допомогти змінити свої плани, щоб дізнатися більше про це конкретному місці. Жахливі блоки погоди насправді дуже корисні, і їх можна зробити привабливими.
Додавання Simple Weather в WordPress вручну
У цьому методі ми використовуємо чудовий плагін Simple Weather jQuery. Цей плагін отримує погодні дані з Yahoo! Weather Feed використовуючи YQL API.
Скачайте плагін Simple Weather jQuery, розпакуйте його і завантажте jquery.simpleWeather.js в кореневу директорію вашого сайту (наприклад, http://www.example.com/jquery.simpleweather.js)
Зайдіть в консоль адміністратора WordPress: Зовнішній Вид → Редактор і виберіть зі списку файлів справа Шапку (Header), вставте наступний код в файл header.php вашої теми прямо перед </ head>:
& Amp; lt; script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" charset = "utf-8" & amp; gt; & amp; lt; / script & amp; gt; & Amp; lt; script src = "& amp; lt;? Php echo esc_url (home_url ( '/'));? & Amp; gt; /jquery.simpleWeather.js" charset = "utf-8" & amp; gt; & amp; lt; / script & amp; gt; & Amp; lt; script type = "text / javascript" & amp; gt; $ (Function () {$ .simpleWeather ({location: 'london, united kingdom', unit: 'c', success: function (weather) {html = '& amp; lt; h2 & amp; gt;' + weather.city + ' , '+ weather.region +' & amp; lt; / h2 & amp; gt; '; html + =' & amp; lt; img style = "float: left;" width = "125px" src = " '+ weather.image +'" & amp; gt; '; html + =' & amp; lt; p & amp; gt; '+ weather.temp +' & amp; amp; deg; '+ weather.units.temp +' & amp; lt; br / & amp; gt; & amp; lt; span & amp; gt; '+ weather.currently +' & amp; lt; / span & amp; gt; & amp; lt; / p & amp; gt; '; html + =' & amp; lt; a href = " '+ weather.link +' "& amp; gt; View Forecast & amp; amp; raquo; & amp; lt; / a & amp; gt; '; $ (" # weather2 "). html (html);}, error: function (error) {$ (" # weather2 "). html ( '& amp; lt; p & amp; gt;' + error + '& amp; lt; / p & amp; gt;');}});});
Замініть London, United Kingdom тим місцем, яке ви хочете відображати. Для місць всередині США ви також можете використовувати індекси, ось так: zipcode = "90210"
Тепер перейдіть в Зовнішній Вид → Віджет, додайте текстовий віджет в сайдбар і всередині віджета вставте <div id = "weather2"> </ div>. Збережіть віджет і подивіться на свій сайт. Ви також можете використовувати код всередині записів і шаблонів.
Тепер, коли ми додали погоду, наступна проблема, з якою ми стикаємося, це не дуже симпатичний вигляд прогнозу погоди. Давайте додамо трохи стилів, вставивши наступний код в таблицю стилів style.css вашої теми:
# Weather2 {background: # 6f9dbe; background: -webkit-gradient (linear, left top, left bottom, from (# adc7db), to (# 6f9dbe)); background: -moz-linear-gradient (top, # b2bcc8, # adc7db); width: 185px; padding: 5px 10px; overflow: hidden; border: 1px solid # 6591b3; } # Weather2 h2 {color: # 000; text-shadow: rgba (250, 250, 250, 0.6) 2px 2px 0; } # Weather2 p {font-size: 25px; margin: 30px 0 0; } # Weather2 p span {font-size: 16px; } # Weather2 a: link, # weather2 a: active, # weather2 a: visited {display: block; clear: both; text-decoration: none; color: # 222; font-size: 12px; } # Weather2 a: hover {color: # 000; text-decoration: underline; }
Simple Weather дійсно чудовий і робить додавання погоди на ваші сайти дуже простим і швидким. Крім того, причина, по якій він такий чудовий - це широкі можливості його налаштування. У наведеному вище прикладі ви можете легко змінити місце і блоки погоди. Ви також можете стилізувати його, щоб він підходив під вашу тему. Simple Weather може робити набагато більше, фактично він просто витягує дані, а ви можете використовувати ці дані дуже різноманітно. Ви можете побачити деякі приклади тут.
Погодні плагіни WordPress
На жаль, в серпні 2012 Google нишком скасував свій Weather API. Власне, Google ніколи не відкривав його для використання розробниками, він був знайдений і використаний розробниками без всякого права. Це означає, що деякі погодні віджети і плагіни з репозиторіїв WordPress більше не працюють.
Але є й інші плагіни і віджети, які використовують Yahoo Weather Feed, Weather.com і Weather Underground, і працюють нормально.
Weather and Weather Forecast Widget
Weather and Weather Forecast Widget
- настроюється і зручний у використанні WordPress плагін для відображення погодних зведень і прогнозів. Він не тільки показує погоду в віджети, але також може показувати погоду всередині записів і шаблонів з використанням шорткодов. Він може отримувати дані з двох джерел - Weather Wunderground і World Weather Online, ви можете використовувати їх разом і встановити настройки для одного з них, в разі якщо обраний вами джерело не отримав дані погоди, дані з альтернативного джерела можуть їх замінити.
Плагін також поставляється зі своїми зображеннями для погоди, які ви можете замінити своїми іконками, якщо захочете. В даний момент є 3 різних набору іконок в комплектації плагіна. Ви можете отримати більше контролю над зовнішнім виглядом плагіна, модифікуючи CSS віджета.
Автор плагіна в даний момент призупинив розробку, але плагін працює відмінно, і автор вже задокументував усі про плагіні. Одна невелика дратує деталь - вам потрібно буде створити облікові записи в Wunderground або в World Weather Online, щоб отримати ключі API, які необхідні плагіну для роботи. Це займе не багато часу, і вам не потрібно буде повторювати це, так що мені здається, що це не велика проблема.
Weather Forecast WP Wunderground
WP Wunderground
- ще один простий плагін для відображення прогнозу погоди на вашому сайті. Він використовує дані Weather Underground щоб вивести їх на ваш сайт. На відміну від попереднього плагіна, цей не вимагає ключів Wunderground API.
Замість того, щоб додати віджет на вашу панель віджетів, цей плагін створює шорткод для використання в будь-якому місці сайту. Цей шорткод можна використовувати в звичайному текстовому віджеті, в запису або на сторінці і в ваших шаблонах. Шорткод можна налаштувати вручну, так що якщо ви хочете відображати погодні зведення для більш ніж одного місця, ви можете вручну додати опції для іншого шорткода, ось так:
[Forecast location = "Paris, France" caption = "Weather for Paris" measurement = 'C' todaylabel = "Today" datelabel = "date ( 'm / d / Y')" highlow = '%% high %% ° / %% low %% ° 'numdays = "3" iconset = "Cartoon" class = "css_table_class" cache = "true" width = "100%"]
Плагін поставляється з 10 наборами іконок, які ви можете використовувати в якості іконок погоди. Ви можете показувати прогноз на кілька днів або просто показувати погоду на сьогодні. Плагін простий в налаштуванні і приємний в роботі.
висновок
Ця стаття стала короткою через закриття Google Weather API. Інакше я б також зробив огляд ICIT Weather Widget і WordPress Weather Widget. Є також багато інших плагінів, які ви можете використовувати, частина з них давно не оновлювалася, деякі не дуже гарні. Але я подумав, що в цьому вся принадність сайту на WordPress - випробування нових безкоштовних штук і настройка їх для створення чудових сайтів.
джерело: WPLift.com
Наскільки корисним був цей пост?
Натисніть на зірку, щоб оцінити цей пост!
Надіслати рейтинг
Середній рейтинг: / 5. Кількість голосів:
Дивіться також:
Якщо у вас немає сайту або ви ніколи не працювали з сайтами в цих нішах, то ви, швидше за все, думаєте, навіщо б люди хотіли додати ці потворні блоки на свої сайти?Js" charset = "utf-8" & amp; gt; & amp; lt; / script & amp; gt; & Amp; lt; script src = "& amp; lt;?
Php echo esc_url (home_url ( '/'));?