SlideShare une entreprise Scribd logo
1  sur  13
Télécharger pour lire hors ligne
WordPressで作る世界遺産サイト
TickleCode.
Yoshinori Kobayashi
1
WordPressもくもく勉強会 at コエド第5回 15.03.08
Weather Underground Plugin を活用して、
世界の天気予報を表示 編
生まれは 奈良県 です。
2
小林由憲(こばやしよしのり)
Twitter: @AsbyuKobayashi
ブログ: In Advance Only
3
最初にデモします。
http://www.world-ht.net/archives/worldheritage/machu-picchu
マチュ・ピチュ。インカ時代に繁栄し、そして忘れ去れた「空中都市」
http://www.world-ht.net/archives/worldheritage/mont-saint-michel
モン・サン=ミシェル。「西洋の驚異」と称される海に浮かぶ修道院
http://www.world-ht.net/archives/worldheritage/uluru-kata-tjuta-national-park
ウルル=カタ・ジュタ国立公園。地球のへそと呼ばれる神秘な聖地
4
Weather Underground Plugin
https://wordpress.org/plugins/wunderground/
5
Weather Underground Pluginの天気予報表示イメージ
6
http://www.wunderground.com/
Weather Underground という「天気サービス」を、
WordPress Plugin で提供したもの
7
複数の表示パターン
8
http://www.wunderground.com/weather/api/d/docs?d=language-support&MR=1
非常にたくさんの多言語に対応している
9
ShortCode(ショートコード)が使える
※投稿記事の内容ごとに天気予報を表示できる
echo do_shortcode(‘[wunderground location="Paris, France"]’);
テンプレート(テーマ)に埋め込むときは、 do_shortcode で。
https://github.com/katzwebservices/Wunderground#shortcode
Shortcode
10
地域名もしくは位置情報から天気予報を取得
[wunderground location="Denver, Colorado"]
[wunderground location=“Japan,Tokyo”]
City / State
Country / City
Coordinates(座標) latitude (緯度)/ longitude(経度)
[wunderground location=“-25.3432835, 131.0412097”]
11
天気予報に必要なデータ要素が揃っている。
icon :天気アイコン
daynames :曜日
pop: 降水量
text:天気予報のコメント
https://github.com/katzwebservices/Wunderground#shortcode-parameters
date:日付
conditions:天候
highlow:最高気温、最低気温
Shortcode Parameters
12
最後に感想!
Weather Underground Plugin を入れて、
ショートコードを書いてほぼできる。
世界の天気予報を簡単にサイトへ導入できる!
ご清聴ありがとうございました。

Contenu connexe

Plus de Yoshinori Kobayashi

愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
Yoshinori Kobayashi
 
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
Yoshinori Kobayashi
 
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
Yoshinori Kobayashi
 
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
Yoshinori Kobayashi
 
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-EdoWordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
Yoshinori Kobayashi
 
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
Yoshinori Kobayashi
 
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
Yoshinori Kobayashi
 
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
Yoshinori Kobayashi
 
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズjQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
Yoshinori Kobayashi
 
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
Yoshinori Kobayashi
 

Plus de Yoshinori Kobayashi (20)

愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
 
勉強会を開催したことで起こったこと|#ブロフェス2015
勉強会を開催したことで起こったこと|#ブロフェス2015 勉強会を開催したことで起こったこと|#ブロフェス2015
勉強会を開催したことで起こったこと|#ブロフェス2015
 
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
Instagram Ruby Gem と Instagram API から学んだことまとめ|【CoEdo.rb】Ruby / Ruby on Rails ...
 
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
個人の成長に合わせた、WordPress学習方法とコミュニティへの関わり方|WordBench山梨 Vol.1:WordBench山梨 はじめの一歩
 
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
WordPressテンプレート階層を理解する。テーマカスタマイズに必要な5つのポイント!|WordPressもくもく勉強会 at コエド第6回
 
WordPressで作る世界遺産サイト|Youtube Data API を使って動画取得 編
WordPressで作る世界遺産サイト|Youtube Data API を使って動画取得 編WordPressで作る世界遺産サイト|Youtube Data API を使って動画取得 編
WordPressで作る世界遺産サイト|Youtube Data API を使って動画取得 編
 
WordPressで作る世界遺産サイト|Instagram API を使って現地フォト取得
WordPressで作る世界遺産サイト|Instagram API を使って現地フォト取得 WordPressで作る世界遺産サイト|Instagram API を使って現地フォト取得
WordPressで作る世界遺産サイト|Instagram API を使って現地フォト取得
 
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-EdoWordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
WordPressもくもく勉強会について― WordPressもくもく倶楽部 at コワーキングスペース 茅場町 Co-Edo
 
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
WordPressで作る世界遺産サイト|カスタムフィールドとカスタム投稿編
 
WordPressのテンプレートタグを理解する
WordPressのテンプレートタグを理解するWordPressのテンプレートタグを理解する
WordPressのテンプレートタグを理解する
 
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
Sassについてゼロから解説 -基本の理解だけでも効率アップ-|第14回ゼロから始めるWordPress勉強会
 
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
D3.jsでのデータビジュアライゼーション -人口統計データから使い方を学ぶ-
 
Bootstrapを使って効率よくWordPressオリジナルテーマを作る
Bootstrapを使って効率よくWordPressオリジナルテーマを作るBootstrapを使って効率よくWordPressオリジナルテーマを作る
Bootstrapを使って効率よくWordPressオリジナルテーマを作る
 
プログラミングの学習方法 | How To Learn The Programming 14.05.31 WP-D Fes #02 Interviews ...
プログラミングの学習方法 | How To Learn The Programming 14.05.31 WP-D Fes #02 Interviews ...プログラミングの学習方法 | How To Learn The Programming 14.05.31 WP-D Fes #02 Interviews ...
プログラミングの学習方法 | How To Learn The Programming 14.05.31 WP-D Fes #02 Interviews ...
 
SEO:Google構造化データ、リッチスニペットについて
SEO:Google構造化データ、リッチスニペットについてSEO:Google構造化データ、リッチスニペットについて
SEO:Google構造化データ、リッチスニペットについて
 
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズjQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
jQuery UI Tabs で効率よくタブ機能を実現しよう! 14.05.23 HTML5 jQueryビギナーズ
 
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
VEGAS jQuery Plugin を使ってみた ~背景画像やスライドショーを画面いっぱいに表示~
 
ロリポップと簡単インストールについて|ゼロから始めるWordPress勉強会
ロリポップと簡単インストールについて|ゼロから始めるWordPress勉強会ロリポップと簡単インストールについて|ゼロから始めるWordPress勉強会
ロリポップと簡単インストールについて|ゼロから始めるWordPress勉強会
 
グリッドレイアウトを簡単に行うJavaScript!Masonry.js
グリッドレイアウトを簡単に行うJavaScript!Masonry.jsグリッドレイアウトを簡単に行うJavaScript!Masonry.js
グリッドレイアウトを簡単に行うJavaScript!Masonry.js
 
Portfolio yoshinori kobayashi
Portfolio yoshinori kobayashiPortfolio yoshinori kobayashi
Portfolio yoshinori kobayashi
 

WordPressで作る世界遺産サイト|Weather Underground Plugin を活用して、 世界の天気予報を表示 編|WordPressもくもく勉強会 at コエド第5回