Download free for 30 days
Sign in
Upload
Language (EN)
Support
Business
Mobile
Social Media
Marketing
Technology
Art & Photos
Career
Design
Education
Presentations & Public Speaking
Government & Nonprofit
Healthcare
Internet
Law
Leadership & Management
Automotive
Engineering
Software
Recruiting & HR
Retail
Sales
Services
Science
Small Business & Entrepreneurship
Food
Environment
Economy & Finance
Data & Analytics
Investor Relations
Sports
Spiritual
News & Politics
Travel
Self Improvement
Real Estate
Entertainment & Humor
Health & Medicine
Devices & Hardware
Lifestyle
Change Language
Language
English
Español
Português
Français
Deutsche
Cancel
Save
EN
Uploaded by
Takashi Hosoya
PDF, PPTX
4,655 views
WordBench京都 9月号:kintone×WordPressハンズオン
WordBench京都 9月号で、kintoneのデータを取得するWordPressプラグインを作成するハンズオンのスライドです。
Technology
◦
Read more
3
Save
Share
Embed
Embed presentation
Download
Download as PDF, PPTX
1
/ 109
2
/ 109
3
/ 109
4
/ 109
5
/ 109
6
/ 109
7
/ 109
8
/ 109
9
/ 109
10
/ 109
11
/ 109
12
/ 109
13
/ 109
14
/ 109
15
/ 109
16
/ 109
17
/ 109
18
/ 109
19
/ 109
20
/ 109
21
/ 109
22
/ 109
23
/ 109
24
/ 109
25
/ 109
26
/ 109
27
/ 109
28
/ 109
29
/ 109
30
/ 109
31
/ 109
32
/ 109
33
/ 109
34
/ 109
35
/ 109
36
/ 109
37
/ 109
38
/ 109
39
/ 109
40
/ 109
41
/ 109
42
/ 109
43
/ 109
44
/ 109
45
/ 109
46
/ 109
47
/ 109
48
/ 109
49
/ 109
50
/ 109
51
/ 109
52
/ 109
53
/ 109
54
/ 109
55
/ 109
56
/ 109
57
/ 109
58
/ 109
59
/ 109
60
/ 109
61
/ 109
62
/ 109
63
/ 109
64
/ 109
65
/ 109
66
/ 109
67
/ 109
68
/ 109
69
/ 109
70
/ 109
71
/ 109
72
/ 109
73
/ 109
74
/ 109
75
/ 109
76
/ 109
77
/ 109
78
/ 109
79
/ 109
80
/ 109
81
/ 109
82
/ 109
83
/ 109
84
/ 109
85
/ 109
86
/ 109
87
/ 109
88
/ 109
89
/ 109
90
/ 109
91
/ 109
92
/ 109
93
/ 109
94
/ 109
95
/ 109
96
/ 109
97
/ 109
98
/ 109
99
/ 109
100
/ 109
101
/ 109
102
/ 109
103
/ 109
104
/ 109
105
/ 109
106
/ 109
107
/ 109
108
/ 109
109
/ 109
More Related Content
PDF
WordBench京都9月号
by
Koji Asaga
PDF
第35回 WordBench 大阪 kintoneハンズオン
by
Koji Asaga
PDF
WordPress × kintone API連携実践_たにぐち まこと氏
by
kintone papers
PPTX
kintone dev camp vol.11 kintone rest api ハンズオン初級編
by
kintone papers
PPTX
MA2016 kintone ハンズオン
by
kintone papers
PDF
kintone REST API Handson 2017-1
by
kintone papers
PPTX
ht 細谷 崇さま_kintone hive
by
Cybozucommunity
PPTX
こだわりのkintone
by
Yusuke Amano
WordBench京都9月号
by
Koji Asaga
第35回 WordBench 大阪 kintoneハンズオン
by
Koji Asaga
WordPress × kintone API連携実践_たにぐち まこと氏
by
kintone papers
kintone dev camp vol.11 kintone rest api ハンズオン初級編
by
kintone papers
MA2016 kintone ハンズオン
by
kintone papers
kintone REST API Handson 2017-1
by
kintone papers
ht 細谷 崇さま_kintone hive
by
Cybozucommunity
こだわりのkintone
by
Yusuke Amano
Similar to WordBench京都 9月号:kintone×WordPressハンズオン
PPTX
ヤマムギ vol.4 kintone 入門ハンズオン
by
R3 institute
PPTX
kintoneアプリをjavascriptでいじってみよう
by
Kyouhei Kitagawa
PPTX
Ma11 kintoneハンズオン tokyo
by
Kyouhei Kitagawa
PPTX
kintone x Sansan連携事始め~カスタマイズまで
by
Katsuki Ito
PDF
Developers Summit 2016 kintone プラグイン開発ハンズオン
by
JOYZO
PPTX
kintoneの開発プロセスとプロジェクト管理ツール
by
Yuki Okada
PDF
【kintone café京都#1】kintoneの拡張機能
by
Koji Asaga
PPTX
kintone-developer-エコシステム ~kintone Café 大分 Vol.2~
by
Kyouhei Kitagawa
PPTX
kintone x AWSで超ファストシステムを作ろう 〜 AWSでkintone APIをよりよく使う〜
by
Kazuki Murahama
PDF
kintone REST API client package for R
by
Ryu Yamashita
PDF
Kintone hands on
by
twilioforkwc
PDF
APIで広がるkintoneの世界
by
Sakae Saito
PPTX
ノンプログラミングで API はじめて体験!_築山 春木氏
by
kintone papers
PDF
Kintone Connect Play Vol.1 201707
by
kintone papers
PDF
Formbridge(旧ver)
by
トヨクモ株式会社
PDF
Formbridge
by
トヨクモ株式会社
PPTX
ヤマムギVol.2 kintoneデータ集計 ハンズオン資料
by
Mitsuhiro Yamashita
PPTX
ヤマムギ vol.3 kintone 入門ハンズオン
by
R3 institute
PPTX
フォームクリエイター
by
Tomohiko Tasato
PDF
【kintone café松江#1】kintoneの可能性
by
Koji Asaga
ヤマムギ vol.4 kintone 入門ハンズオン
by
R3 institute
kintoneアプリをjavascriptでいじってみよう
by
Kyouhei Kitagawa
Ma11 kintoneハンズオン tokyo
by
Kyouhei Kitagawa
kintone x Sansan連携事始め~カスタマイズまで
by
Katsuki Ito
Developers Summit 2016 kintone プラグイン開発ハンズオン
by
JOYZO
kintoneの開発プロセスとプロジェクト管理ツール
by
Yuki Okada
【kintone café京都#1】kintoneの拡張機能
by
Koji Asaga
kintone-developer-エコシステム ~kintone Café 大分 Vol.2~
by
Kyouhei Kitagawa
kintone x AWSで超ファストシステムを作ろう 〜 AWSでkintone APIをよりよく使う〜
by
Kazuki Murahama
kintone REST API client package for R
by
Ryu Yamashita
Kintone hands on
by
twilioforkwc
APIで広がるkintoneの世界
by
Sakae Saito
ノンプログラミングで API はじめて体験!_築山 春木氏
by
kintone papers
Kintone Connect Play Vol.1 201707
by
kintone papers
Formbridge(旧ver)
by
トヨクモ株式会社
Formbridge
by
トヨクモ株式会社
ヤマムギVol.2 kintoneデータ集計 ハンズオン資料
by
Mitsuhiro Yamashita
ヤマムギ vol.3 kintone 入門ハンズオン
by
R3 institute
フォームクリエイター
by
Tomohiko Tasato
【kintone café松江#1】kintoneの可能性
by
Koji Asaga
More from Takashi Hosoya
PDF
Kintone café 大阪 vol2
by
Takashi Hosoya
PDF
新しい働き方の提案 クラウドソーシング(公開用)
by
Takashi Hosoya
PDF
Kintone勉強会@大阪 Vol.1 ドラッグ&ドロップで顧客管理システムを作ってみよう!
by
Takashi Hosoya
PDF
Welcome to CoderDojo
by
Takashi Hosoya
PDF
2014年6月7日【ハンズオン】体験して学ぶ はじめてのブログ・サイト制作
by
Takashi Hosoya
PDF
CoderDojoでもAWSを使ってみようかしら
by
Takashi Hosoya
PDF
【ひょうごんNPO塾】ネットワークで動くNPOに必要不可欠!グループウェアの使い方
by
Takashi Hosoya
PDF
パーフェクトダッシュボード
by
Takashi Hosoya
PDF
WordPress専用ディレクトリーで運用
by
Takashi Hosoya
PDF
Home.phpを使ってtopページをカスタマイズしよう!
by
Takashi Hosoya
PDF
Typesハンズオン
by
Takashi Hosoya
PDF
Types紹介
by
Takashi Hosoya
PPT
「WordPress事例の徹底解説」
by
Takashi Hosoya
Kintone café 大阪 vol2
by
Takashi Hosoya
新しい働き方の提案 クラウドソーシング(公開用)
by
Takashi Hosoya
Kintone勉強会@大阪 Vol.1 ドラッグ&ドロップで顧客管理システムを作ってみよう!
by
Takashi Hosoya
Welcome to CoderDojo
by
Takashi Hosoya
2014年6月7日【ハンズオン】体験して学ぶ はじめてのブログ・サイト制作
by
Takashi Hosoya
CoderDojoでもAWSを使ってみようかしら
by
Takashi Hosoya
【ひょうごんNPO塾】ネットワークで動くNPOに必要不可欠!グループウェアの使い方
by
Takashi Hosoya
パーフェクトダッシュボード
by
Takashi Hosoya
WordPress専用ディレクトリーで運用
by
Takashi Hosoya
Home.phpを使ってtopページをカスタマイズしよう!
by
Takashi Hosoya
Typesハンズオン
by
Takashi Hosoya
Types紹介
by
Takashi Hosoya
「WordPress事例の徹底解説」
by
Takashi Hosoya
WordBench京都 9月号:kintone×WordPressハンズオン
1.
kintone×WordPress ハンズオン kintone エバンジェリスト 細谷 崇
( hosoya takashi ) Twitter: @tkc49 WordBench京都 9月号
2.
後日SlideShareで 公開します。
3.
準備物の確認
4.
ハンズオンの準備物の確認 kintoneのアカウント
5.
ハンズオンの準備物の確認 WordPressの環境
6.
36歳 2015年4月から フリーのエンジニア ・WordPress ・kintone 自己紹介
7.
自己紹介:WordPress
8.
自己紹介:CoderDojo西宮/梅田
9.
詳しくは 自己紹介:CoderDojo西宮/梅田
10.
自己紹介:CoderDojo西宮/梅田
11.
4月 kintone Evangelist
12.
ハンズオンの内容
13.
ハンズオンの内容
14.
ハンズオンの内容 ①アンケートフォームの情報をkintoneへ登録
15.
ハンズオンの内容 ①アンケートフォームの情報をkintoneへ登録 ②アンケートの情報をWEBページに表示
16.
ハンズオンの内容 ①アンケートフォームの情報をkintoneへ登録 ②アンケートの情報をWEBページに表示 表示する部分の Pluginを作成
17.
ハンズオンの内容 Cybozu WP to
kintone kintoneのフォーム情報を取得し WEBサイトにフォームのページを 作成することが可能。
18.
表示するためのレシピ
19.
表示するためのレシピ ・kintone API/REST API
・Plugin API/Hooks ・Shortcode API
20.
ドキュメント
21.
ドキュメント kintoneの開発する為の ポータルサイト
26.
ドキュメント WordPressの開発する 為のポータルサイト
27.
Plugin API/Hooks Shortcode API
28.
英語がイヤイヤな方 (T_T)
29.
ドキュメント WordPress プラグイン開発のバイブル ★4.3 ̶ 目次 ̶ 第5章 フィルターフックとアクションフッ クを理解する 第11章 WordPress
APIリファレンス
30.
では始めましょう
31.
まずはkintoneアプリの作成 ここな!
32.
まずはkintoneアプリの作成 「作成」クリックな!
33.
まずはkintoneアプリの作成 「はじめから作成」 クリックしてや!
34.
まずはkintoneアプリの作成 「WordBench京都アンケート」って 入力してや!
35.
まずはkintoneアプリの作成 「一般設定」クリックな!
36.
まずはkintoneアプリの作成 好きなアイコン選んでや!
37.
まずはkintoneアプリの作成 自前アイコンも登録できるで!
38.
まずはkintoneアプリの作成 表示画面のデザインを決めてや!
39.
まずはkintoneアプリの作成 「アンケート一覧です。」って書いてな!
40.
まずはkintoneアプリの作成 最後に「保存」してや!
41.
まずはkintoneアプリの作成 いよいよ、「フォーム」作成やで!
42.
まずはkintoneアプリの作成 文字列(1行) ドロップダウン 文字列(1行) リンク ドロップダウン リッチエディター
43.
まずはkintoneアプリの作成 カーソルをこのあたりにあて ると歯車マークがでるで!
44.
まずはkintoneアプリの作成 適宜必須項目とかも決めてな!
45.
まずはkintoneアプリの作成 アルファベットにしときな! ※ハイフンはあかんで!
46.
まずはkintoneアプリの作成 でけたら「保存」や
47.
まずはkintoneアプリの作成 一覧に表示する項目を作るで!
48.
まずはkintoneアプリの作成 分かりやすい名前つけといて ドラッグ&ドロップで項目作ってや 一覧表示のフィルターやソートも出来るで 好きに設定してや!
49.
まずはkintoneアプリの作成 はい、できたら「保存」や
50.
まずはkintoneアプリの作成 最後に「設定完了」せな、 元も子もなくなるで!
51.
まずはkintoneアプリの作成 当然「OK」や!!
52.
まずはkintoneアプリの作成 アプリの完成や! 中見てみ!
53.
まずはkintoneアプリの作成 最後に作成した「一覧」の項目が でとるやろ!
54.
まずはkintoneアプリの作成 一覧はようけ作成できて、ここで 切り替えれるんや!
55.
まずはkintoneアプリの作成 試しに1つデータ作成や!
56.
まずはkintoneアプリの作成
57.
まずはkintoneアプリの作成 入力したら「保存」な!
58.
まずはkintoneアプリの作成 データにコメントも残せるで!
59.
まずはkintoneアプリの作成 誰がどこ変更したかも わかるんやで
60.
まずはkintoneアプリの作成 一覧ページに!
61.
まずはkintoneアプリの作成 一覧表示もバッチリ!
62.
アプリ完成
63.
いよいよプラグインの作成
64.
その前に・・・
65.
デバックモードに・・・ define( 'WP_DEBUG', true
); root/wp-‐config.php
66.
プラグインディレクトリーとファイルの作成
67.
その前に・・・
68.
hatamoto plugin作成を楽にしてくれる grunt-initテンプレート 便利なツールの紹介 使える環境の人は 使ったら便利です
69.
プラグインディレクトリーとファイルの作成 「kintone-show-data」 kintone-show-data.php
70.
プラグインディレクトリーとファイルの作成 他のプラグイン名と被らないように気をつけよう! 公式ディレクトリーに同じ名前のものがあると 上書きされる恐れがある
71.
管理画面にプラグインを表示
72.
管理画面にプラグインを表示 <?php /**
* Plugin Name: Kintone Show Data * Description: Cybozu kintoneの情報を表示します。 * Version: 0.0.1 * Author: Your Name * License: GPLv2 * Domain Path: /languages */ kintone-‐show-‐data.php
73.
管理画面にプラグインを表示 プラグインリストに表示されればOK! 「有効化」にしてや!
74.
プラグインの型を書く <?php /**
* Plugin Name: Kintone Show Data * Description: Cybozu kintoneの情報を表示します。 * Version: 0.0.1 * Author: Takashi Hosoya * License: GPLv2 * Domain Path: /languages */ $KintoneShowData = new KintoneShowData(); $KintoneShowData-‐>register(); class KintoneShowData { function __construct() { //コンストラクター } public function register() { //レジスター } } kintone-‐show-‐data.php
75.
プラグインの型を書く WordPressの管理画面をリロードして エラーが出てなかったらOK
76.
アクションフックを登録する class KintoneShowData {
function __construct() { //コンストラクター } public function register() { //レジスター add_action( 'plugins_loaded', array( $this, 'plugins_loaded' ), 1 ); } public function plugins_loaded() { // プラグインが全て読み込まれた後に実行 } } kintone-‐show-‐data.php
77.
add_action( 'plugins_loaded', array(
$this, 'plugins_loaded' ), 1 ); アクションフックを登録する
78.
add_action( 'plugins_loaded', array(
$this, 'plugins_loaded' ), 1 ); 「plugins_loaded」というアクションフックに アクションフックを登録する
79.
add_action( 'plugins_loaded', array(
$this, 'plugins_loaded' ), 1 ); 「plugins_loaded」というアクションフックに 自身の「plugins_loaded」メソッドを登録する。 アクションフックを登録する
80.
add_action( 'plugins_loaded', array(
$this, 'plugins_loaded' ), 1 ); 「plugins_loaded」というアクションフックに 自身の「plugins_loaded」メソッドを登録する。 登録すると、「plugins_loaded」が実行されたタイミングで 自身の「plugins_loaded」メソッドも実行して貰える。 これを「フック」と言います。 実行したい処理をフックしておく。 アクションフックを登録する
81.
アクションフックを登録する Simple Colors WordPressの実行フローを視覚 化してみる http://www.warna.info/ archives/279/
82.
ショートコードを登録する class KintoneShowData {
function __construct() { //コンストラクター } public function register() { //レジスター add_action( 'plugins_loaded', array( $this, 'plugins_loaded' ), 1 ); } public function plugins_loaded() { // プラグインが全て読み込まれた後に実行 add_shortcode( 'KintoneShowData', array( $this, 'kintone_show_data_func' )); } public function kintone_show_data_func(){ // 「KintoneShowData」ショートコードが呼ばれたら実行する return ‘表示OK!’; } kintone-‐show-‐data.php
83.
add_shortcode( 'KintoneShowData', array(
$this, 'kintone_show_data_func' )); ショートコードを登録する
84.
ショートコードを登録する
85.
kintoneのデータを取得する [KintoneShowData]が実行されたら、 kintoneのデータを取得する。 kintone REST API
86.
kintone REST API
で必要なもの
87.
kintone REST API
で必要なもの ①サブドメイン xxx.cybozu.com/k/84/ ②アプリ番号 xxx.cybozu.com/k/84/ サブドメイン, アプリ番号, APIトークン
88.
kintone REST API
で必要なもの 「このアプリの設定」をクリック!
89.
kintone REST API
で必要なもの 「詳細設定」をクリック!
90.
kintone REST API
で必要なもの 「APIトークン」をクリック!
91.
kintone REST API
で必要なもの 「生成する」をクリック!
92.
kintone REST API
で必要なもの 今回は表示するだけなので 「レコード閲覧」のみでOK!
93.
kintone REST API
で必要なもの APIトークンをメモっとく
94.
kintone REST API
で必要なもの 「保存」をクリック
95.
kintone REST API
で必要なもの 必ず「設定完了」をする
96.
kintone REST API
で必要なもの 当然「OK」
97.
これでREST APIで接続する為の 必要なデータは いました。
98.
WordPressでのREST APIの利用 $response =
wp_remote_get( $url, $args ); PHPから外部APIを叩く時は、file_get_contents を使いますが、 WordPressには、wp_remote_get 関数が用意されているので、 そちらを使うのが良いです! <?php $args = array( 'timeout' => 5, 'redirection' => 5, 'httpversion' => '1.0', 'user-‐agent' => 'WordPress/' . $wp_version . '; ' . get_bloginfo( 'url' ), 'blocking' => true, 'headers' => array(), 'cookies' => array(), 'body' => null, 'compress' => false, 'decompress' => true, 'sslverify' => true, 'stream' => false, 'filename' => null ); ?>
99.
kintoneのデータを取得する ・ ・ ・
public function plugins_loaded() { // プラグインが全て読み込まれた後に実行 add_shortcode( 'KintoneShowData', array( $this, 'kintone_show_data_func' )); } public function kintone_show_data_func(){ // 「KintoneShowData」ショートコードが呼ばれたら実行する $url = 'https://サブドメイン.cybozu.com/k/v1/records.json?app=アプリ番 号'; $headers = array( 'X-‐Cybozu-‐API-‐Token' => ‘トークン' ); $res = wp_remote_get( $url, array( 'headers' => $headers ) ); $return_value = json_decode( $res['body'], true ); // ちゃんと取得出来ているか確認する var_dump($return_value); kintone-‐show-‐data.php
100.
kintoneのデータを取得する
101.
kintoneのデータを取得する $return_value = json_decode(
$res['body'], true ); $str = "<table border=‘1'>"; $str .= "<tr>"; $str .= "<th>レコード番号</th>"; $str .= "<th>名前</th>"; $str .= "<th>性別</th>"; $str .= "<th>メールアドレス</th>"; $str .= "<th>満足度</th>"; $str .= "<th>感想</th>"; $str .= "</tr>"; for( $i=0; $i < count( $return_value['records'] ); $i++ ){ $str .= "<tr>"; $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['レコード番号']['value']); $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['name']['value']); $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['sex']['value']); $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['email']['value']); $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['satisfaction']['value']); $str .= sprintf("<td>%s</td>", $return_value['records'][$i]['impressions']['value']); $str .= "</tr>"; } $str .= "</table>"; return $str; } }
102.
kintoneのデータを取得する
103.
時間があれば Cybozu WP to
kintone の使い方の説明をします。
104.
便利ツールの紹介
105.
便利ツールの紹介:kintone PHP SDK The
Kintone SDK for PHP https://github.com/hissy/kintone-php kintone API SDK for PHP https://github.com/cstap/kintone-sdk-php
106.
便利ツールの紹介:その他 https://cybozudev.zendesk.com/hc/ja/categories/200182110-SDK-%CE%B2-Tools
107.
最後に 今回は時間の都合によりエラー処理やセキュリティを考慮 したコードにはなっていませんので、あしからずm(__)m またパラメーターの設定画面などもっと汎用性のあるプラ グインの開発をしたい場合、以下の書籍をオススメします。
108.
最後に 11/20(金)Cybozu.com Conference 2015
109.
ぜひ!!!!
Download