SlideShare uma empresa Scribd logo
1 de 38
Baixar para ler offline
WordPressWordPress
  はじめてはじめてののプラグイン作成プラグイン作成
ByBy アルパカ@ラボ 遠藤昇司アルパカ@ラボ 遠藤昇司
自己紹介
●
アルパカ@ラボ:遠藤昇司
●
フリーランスのWebデベロッパーです。
http://www.paka3.net/
https://www.facebook.com/en3shoji
●
9年近く福岡のシステム会社にてWeb系のシステムエンジ
ニアをしていました。その後は、農業経験(みかん・
米・カボス)を3年程してました。
●
現在は
CakePHP等のウェブシステム開発
Wordpressのカスタマイズ/イラスト制作
+某スーパーのお肉屋さんです。
WordBench大分
●
WordPressを中心に様々な情報を交換しながら、
多くの方が楽しく学べるグループです。
●
ビギナーさんから玄人さんまで、デザイナーさんからプログラマー
さんまでとにかく大分で盛り上がっていきましょう!
●
Facebookページでも情報発信中です!ぜひご覧ください。
https://www.facebook.com/groups/wordbench.oita/
WordPressはホームページ作成のツール
●
WordPress は、オープンソースのブログ/CMS プラッ
トフォームです。
現在はバージョン3.9現在はバージョン3.9
ウェブページの制作にはかかせないウェブページの制作にはかかせないCMSCMSのひとつのひとつ
http://ja.wordpress.org/http://ja.wordpress.org/
管理ページ管理ページ
公開ページ公開ページ
プラグインは、組み込み拡張パーツ
●
WordPressのプラグインとは
組み込み式の拡張パーツです。
管理ページ管理ページ
プラグインは、日々たくさんの開発者に作られています。
またこれは、無料で配布されています(※有料もあります)
人気ページランキング人気ページランキング
拡張エディタ拡張エディタ
(入力補助等)(入力補助等)
お問い合わせページお問い合わせページ
(メールフォーム)(メールフォーム)
公式サイト公式サイト
やりたいこと、
プラグインでつくってみたい「キミ」ヘ
たいていことは、探した方が早かったりします。
こんな本を買った方がこんな本を買った方が
はやいんじゃね??はやいんじゃね??
にゃ〜
自分で作るメリットが何か?を自分で作るメリットが何か?を
       よく考えて作りましょう。       よく考えて作りましょう。
プラグインを作成するにあたりプラグインを作成するにあたり
関数ひとつでも、それはプラグインです。
WordPress Codexのプラグイン作成には
以下のように書かれています。
WordPress プラグインは
PHP 言語で記述された、
プログラムないし1つ以上の関数の集まりであり、
WordPress ブログに(略)特定の機能やサービ
スを追加します。
では、はじめてのプラグイン作成では、はじめてのプラグイン作成
準備はいかが??準備はいかが??
>>WordPressWordPressローカル環境ローカル環境
http://goo.gl/76fYjDhttp://goo.gl/76fYjD
>コードを書くエディタ>コードを書くエディタ
UTF-8(BOMUTF-8(BOM無し無し))で保存できるソフトで保存できるソフト
プラグインフォルダプラグインフォルダ
とファイルを作成とファイルを作成
プラグイン作成の流れ。
●
「functions.php」にコードを書く
●
*動作確認
●
「plugins」フォルダに
     プラグインファイルを作成
●
*管理画面でプラグインを有効化
動作確認動作確認 完成!!完成!!プラグインをプラグインを
有効化有効化
functions.phpfunctions.php
現在のテーマ現在のテーマ
*functions.phpはどこだ、どこだ!
現在のテーマフォルダを開いてください。
wordpress本体 themeswp-content twentyfourteen
(現在のテーマ)
>> >> >>
functions.php
※もし、functions.phpなかったら自分で作ってもよいです。
※※テーマフォルダのファイルの中からテーマフォルダのファイルの中から
「「functionsfunctions.php.php」」
をエディタで開きますをエディタで開きます
WordPressWordPress本体本体
※※BitnamiBitnami WordPressWordPress をお使いの方、WordPress本体はここです。
※※Instant WordPressInstant WordPress をお使いの方。
「「themesthemes」フォルダ」フォルダ
「「pluginsplugins」フォルダ」フォルダ
*functions.phpにプログラムを書く
●
functions.phpfunctions.phpは
– WordPress内で実行プログラムを書くファイル
(プログラミング言語:PHP)
– だから
<?php //の後に
echo “hello world!”;
と書くと…実行されちゃいます。
ここに何を書くかというと・・・
●
「PHP」と「WordPress」の関数(テンプレートタ
グ)を使ってコードを書きます。
●
WordPressの記事等を「フィルターフック」や、
保存やメール送信などを「アクションフック」し
ていきます
?? にゃ〜
????
横文字よくわかんない。。。横文字よくわかんない。。。
結局、結局、何何をどうかけばいいのさ??をどうかけばいいのさ??
ということで、ということで、
横文字を説明しても???なので横文字を説明しても???なので
まずは、まずは、すべての記事にすべての記事に、、
””Hello!!Hello!! 愛してるよみんな〜!”愛してるよみんな〜!”
っていう文字を入れてみましょう。っていう文字を入れてみましょう。
まずはコードを書いてみましょう!まずはコードを書いてみましょう!
すべての記事の先頭に文字列を追加する
●
今回のコードの作成前、作成後
////関数関数
function addtext($content) {function addtext($content) {
$str = "<h3>Hello!!$str = "<h3>Hello!! 愛してるよみんな〜!愛してるよみんな〜!</h3>";</h3>";
return $str.$content;return $str.$content;
}}
add_filter('the_content','addtext');add_filter('the_content','addtext');
ではまず・・・さっそく書きます。
このコードをfunctions.phpに書いてください。
本文が、関数addtextを通して出力される
「コンテンツ」をフィルターして、自分の作った関
数をWordPressに実行してもらうこと
add_filter('the_content','addtextaddtext');
the_content
(記事本文)
関数addtext()
(文字列追加)
WordPressWordPress出力出力
文字が追加文字が追加
これがこれが
「「フィルターフックフィルターフック」」
です。です。
では、プラグインファイルを作成してみる
「プラグイン」フォルダを開きます。
wordpress本体 pluginswp-content
>> >>
※※プラグインフォルダにプラグインフォルダに
「「addtextaddtext」」新規フォルダを作成新規フォルダを作成
addtext
addtext.php
作成した「作成した「addtextaddtext」フォルダ内に」フォルダ内に
「「addtext.phpaddtext.php」」
新規ファイルを作成新規ファイルを作成
WordPressWordPress本体本体
※※BitnamiBitnami WordPressWordPress をお使いの方、WordPress本体はここです。
※※Instant WordPressInstant WordPress をお使いの方。
「「themesthemes」フォルダ」フォルダ
「「pluginsplugins」フォルダ」フォルダ
ファイルにプラグインのヘッダーを書く
●
まずファイルを開き、プラグインの情報を記入します。
ヘッダーが存在しない場合、
プラグインは有効化も実行もできません。
<?php
/*
Plugin Name: (プラグインの名前)
Plugin URI: (プラグインの説明と更新を示すページの URI)
Description: (プラグインの短い説明)
Version: (プラグインのバージョン番号。例: 1.0)
Author: (プラグイン作者の名前)
Author URI: (プラグイン作者の URI)
License: (ライセンス名の「スラッグ」 例: GPL2)
*/
?>
ヘッダーと関数を記入します。
<?php
/*
Plugin Name: paka3 AddText
Plugin URI: http://www.paka3.com/wpplugin
Description: テキストを末尾に追加するプラグイン
Author: Shoji ENDO
Version: 0.1
Author URI:http://www.paka3.com/
*/
//関数
function addtext($content) {
$str = "<h3>Hello!! 愛してるよみんな〜!</h3>";
return $str.$content;
}
add_filter('the_content','addtext');
?>
addtext.php
作成した関数作成した関数
ヘッダーヘッダー
※functions.phpに書いていたのは消す
●
functions.php→プラグインファイル作成する場合、
プラグインファイルを作成した後、
functions.phpに書いたコードを消してください。
関数が重複してエラーが発生します。
functions.php
//関数
function addtext($content) {
$str = "<h3>Hello!! 愛してるよみんな〜!</h3>";
return $str.$content;
}
add_filter('the_content','addtext');
作成したプラグインがありますか?
●
管理ページに行き「プラグイン」ページを開く
有効化してみましょう。有効化してみましょう。
以上、完成です。
●
正しく表示されていれば完成です。
WordPressWordPress
「プラグイン「プラグイン APIAPI」」
プラグインAPI
●
WordPressには、簡単にWordPress内部の関数・コン
テンツをカスタマイズできるプラグインAPIが用意されて
います。具体的には・・・
アクションフックアクションフック
フィルターフックフィルターフック
フィルターフックは「データ」
● add_filter( フィルターしたいフック名, フックする関数, 実行順番(10), 引数(1) )
フックする
関数
フックする
関数
保存保存
入力入力
出力出力
呼び呼び
出し出し
入力入力
アクションフックは「動作」
●add_action(フィルターしたいアクション, フックする関数, 実行順番(10), 引数(1) );
記事を保存する記事を保存する
メールを送信メールを送信
ヘッダー等をヘッダー等を
ブラウザに画面表示するブラウザに画面表示する
http://www.paka3.net/wpplugin43/http://www.paka3.net/wpplugin43/
http://www.paka3.net/wpplugin67/http://www.paka3.net/wpplugin67/
WordPressWordPress
「ショートコード」「ショートコード」
というものもあるよというものもあるよ
「ショートコード」は合い言葉。
ショートコードは、自分で設定できる「合い言葉」。
記事本文に”[]”で囲んで書きます。
[ai][ai] 文字列が追加文字列が追加
管理ページ管理ページ 公開ページ公開ページ
////関数関数
function addtext() {function addtext() {
$str = "<h3>Hello!!$str = "<h3>Hello!! 愛してるよみんな〜!愛してるよみんな〜!</h3>";</h3>";
return $str;return $str;
}}
add_shortcode('ai','addtext');add_shortcode('ai','addtext');
ではまず・・・さっそく書きます。
このコードをfunctions.phpに書いてください。
[ai][ai]
※※ショートコードショートコード
ショートコードは属性ももてます。
////関数関数
function addtext($atts) {function addtext($atts) {
$atts = extract( shortcode_atts( array($atts = extract( shortcode_atts( array(
'who' => “'who' => “みんな”みんな”
),$atts ));),$atts ));
$str = "<h3>Hello!!$str = "<h3>Hello!! 愛してるよ愛してるよ{$who}{$who}〜!〜!</h3>";</h3>";
return $str;return $str;
}}
add_shortcode('ai','addtext');add_shortcode('ai','addtext');
このコードをfunctions.phpに書いてください。
[ai[ai who=”who=”嫁さん”嫁さん”]]
※※ショートコードショートコード
////関数関数
function addtext($atts,$content) {function addtext($atts,$content) {
$str = "<h3>{$content}</h3>";$str = "<h3>{$content}</h3>";
return $str;return $str;
}}
add_shortcode('ai','addtext');add_shortcode('ai','addtext');
ではまず・・・さっそく書きます。
このコードをfunctions.phpに書いてください。
[ai][ai]こんにちは、ラブこんにちは、ラブ&&ピース!!ピース!![/ai][/ai]
※※ショートコードショートコード
プラグインAPIをうまく利用しましょう
●
「アクションフック」や「フィルターフック」は
思っている以上にたくさんあります。
http://adambrown.info/p/wp_hooks/version
●
まずは「何をしたいか?」を
考えてみましょう。
●
※よかったら私のウェブページも参考にしてね。
http://www.paka3.net/wpplugin/
WordPress1日1プラグインやってます。
それでは!それでは!
よいよいWordPressWordPressライフを!ライフを!

Mais conteúdo relacionado

Mais procurados

GMOペパボ 開発現場以外でも「スクラム」的な取り組み
GMOペパボ 開発現場以外でも「スクラム」的な取り組みGMOペパボ 開発現場以外でも「スクラム」的な取り組み
GMOペパボ 開発現場以外でも「スクラム」的な取り組み
Fuminori Wajima
 
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
Yoshinori Kobayashi
 
WordPressでウェブサービスを作ろう! #wbNagoya
WordPressでウェブサービスを作ろう! #wbNagoyaWordPressでウェブサービスを作ろう! #wbNagoya
WordPressでウェブサービスを作ろう! #wbNagoya
Shinichi Nishikawa
 

Mais procurados (20)

GMOペパボ 開発現場以外でも「スクラム」的な取り組み
GMOペパボ 開発現場以外でも「スクラム」的な取り組みGMOペパボ 開発現場以外でも「スクラム」的な取り組み
GMOペパボ 開発現場以外でも「スクラム」的な取り組み
 
プロトタイプ時代の
WordPressテーマの作り方・考え方
プロトタイプ時代の
WordPressテーマの作り方・考え方プロトタイプ時代の
WordPressテーマの作り方・考え方
プロトタイプ時代の
WordPressテーマの作り方・考え方
 
Bootstrap
BootstrapBootstrap
Bootstrap
 
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
愛があれば発信できる!WordPressで作る焼き鳥ポータルサイト~公式テーマ・プラグインと子テーマの活用~|WordCamp Tokyo 2015
 
Webっちゃ vol.01 [Wordpressでできること]
Webっちゃ vol.01 [Wordpressでできること]Webっちゃ vol.01 [Wordpressでできること]
Webっちゃ vol.01 [Wordpressでできること]
 
第11回ゼロから始めるWordPress勉強会
第11回ゼロから始めるWordPress勉強会第11回ゼロから始めるWordPress勉強会
第11回ゼロから始めるWordPress勉強会
 
WordPress ブラウザで始めるカスタマイズ+ テーマの基礎的な知識
WordPress ブラウザで始めるカスタマイズ+ テーマの基礎的な知識WordPress ブラウザで始めるカスタマイズ+ テーマの基礎的な知識
WordPress ブラウザで始めるカスタマイズ+ テーマの基礎的な知識
 
集客ばかりを考えるからブログは失敗する -長くブログを続けるために-
集客ばかりを考えるからブログは失敗する -長くブログを続けるために-集客ばかりを考えるからブログは失敗する -長くブログを続けるために-
集客ばかりを考えるからブログは失敗する -長くブログを続けるために-
 
コミュニティ立ち上げのときに本当にあった恐い話
コミュニティ立ち上げのときに本当にあった恐い話 コミュニティ立ち上げのときに本当にあった恐い話
コミュニティ立ち上げのときに本当にあった恐い話
 
実録 WordPress Twenty Sixteen のカスタマイズ | WordBench東京 2月勉強会 「みんなのテーマ開発」〜自分の好きな作り方...
実録 WordPress Twenty Sixteen のカスタマイズ | WordBench東京 2月勉強会 「みんなのテーマ開発」〜自分の好きな作り方...実録 WordPress Twenty Sixteen のカスタマイズ | WordBench東京 2月勉強会 「みんなのテーマ開発」〜自分の好きな作り方...
実録 WordPress Twenty Sixteen のカスタマイズ | WordBench東京 2月勉強会 「みんなのテーマ開発」〜自分の好きな作り方...
 
日本語フォーラムで回答してみよう!~誰でも出来るWordPressへの貢献〜
日本語フォーラムで回答してみよう!~誰でも出来るWordPressへの貢献〜日本語フォーラムで回答してみよう!~誰でも出来るWordPressへの貢献〜
日本語フォーラムで回答してみよう!~誰でも出来るWordPressへの貢献〜
 
IPv6にどう取り組むか
IPv6にどう取り組むかIPv6にどう取り組むか
IPv6にどう取り組むか
 
WordPress公式ディレクトリにテーマを登録しよう #wctokyo
WordPress公式ディレクトリにテーマを登録しよう #wctokyoWordPress公式ディレクトリにテーマを登録しよう #wctokyo
WordPress公式ディレクトリにテーマを登録しよう #wctokyo
 
DMMのIPv6に関する取り組み 2016年2月版
DMMのIPv6に関する取り組み 2016年2月版DMMのIPv6に関する取り組み 2016年2月版
DMMのIPv6に関する取り組み 2016年2月版
 
UnderScoreとbootstrapとsassでword pressのテーマをつくろう
 UnderScoreとbootstrapとsassでword pressのテーマをつくろう UnderScoreとbootstrapとsassでword pressのテーマをつくろう
UnderScoreとbootstrapとsassでword pressのテーマをつくろう
 
WordBench京都版 _sハンズオン
WordBench京都版 _sハンズオンWordBench京都版 _sハンズオン
WordBench京都版 _sハンズオン
 
WordPressでウェブサービスを作ろう! #wbNagoya
WordPressでウェブサービスを作ろう! #wbNagoyaWordPressでウェブサービスを作ろう! #wbNagoya
WordPressでウェブサービスを作ろう! #wbNagoya
 
PWA A Go-Go !! @ABC2018A 20181013
PWA A Go-Go !! @ABC2018A 20181013PWA A Go-Go !! @ABC2018A 20181013
PWA A Go-Go !! @ABC2018A 20181013
 
テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン
テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグインテーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン
テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン
 
WordCamp2015 WordPressで自分の名前でドメイン取って ブログ作るとこまで 面倒みるワークショップ
WordCamp2015 WordPressで自分の名前でドメイン取って ブログ作るとこまで 面倒みるワークショップWordCamp2015 WordPressで自分の名前でドメイン取って ブログ作るとこまで 面倒みるワークショップ
WordCamp2015 WordPressで自分の名前でドメイン取って ブログ作るとこまで 面倒みるワークショップ
 

Semelhante a WordPressはじめてのプラグイン作成

2014.07.09 WordBench Tokyo LT
2014.07.09 WordBench Tokyo LT2014.07.09 WordBench Tokyo LT
2014.07.09 WordBench Tokyo LT
Yutaro Miyazaki
 
ブラジルでWebサービスローンチしてみた
ブラジルでWebサービスローンチしてみたブラジルでWebサービスローンチしてみた
ブラジルでWebサービスローンチしてみた
Akira Fukuei
 
Introduction to Favmemo for Immature Engineers
Introduction to Favmemo for Immature EngineersIntroduction to Favmemo for Immature Engineers
Introduction to Favmemo for Immature Engineers
Takeshi Arabiki
 
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
Unicast Inc.
 

Semelhante a WordPressはじめてのプラグイン作成 (20)

はじめてのWordPress
はじめてのWordPressはじめてのWordPress
はじめてのWordPress
 
WordPress 初心者さんが知っておいたほうが良い事&プラグインの紹介
WordPress 初心者さんが知っておいたほうが良い事&プラグインの紹介WordPress 初心者さんが知っておいたほうが良い事&プラグインの紹介
WordPress 初心者さんが知っておいたほうが良い事&プラグインの紹介
 
簡単なプラグインの管理方法とプラグインのご紹介
簡単なプラグインの管理方法とプラグインのご紹介簡単なプラグインの管理方法とプラグインのご紹介
簡単なプラグインの管理方法とプラグインのご紹介
 
Wordbeach 2011 hajimeno ippo
Wordbeach 2011 hajimeno ippoWordbeach 2011 hajimeno ippo
Wordbeach 2011 hajimeno ippo
 
2014.07.09 WordBench Tokyo LT
2014.07.09 WordBench Tokyo LT2014.07.09 WordBench Tokyo LT
2014.07.09 WordBench Tokyo LT
 
コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!
 
第10回ゼロからはじめるWordPress勉強会(初心者向け)
第10回ゼロからはじめるWordPress勉強会(初心者向け)第10回ゼロからはじめるWordPress勉強会(初心者向け)
第10回ゼロからはじめるWordPress勉強会(初心者向け)
 
ブラジルでWebサービスローンチしてみた
ブラジルでWebサービスローンチしてみたブラジルでWebサービスローンチしてみた
ブラジルでWebサービスローンチしてみた
 
2013年3月16日のWordBench大阪
2013年3月16日のWordBench大阪2013年3月16日のWordBench大阪
2013年3月16日のWordBench大阪
 
Introduction to Favmemo for Immature Engineers
Introduction to Favmemo for Immature EngineersIntroduction to Favmemo for Immature Engineers
Introduction to Favmemo for Immature Engineers
 
WPFの画面をWebブラウザのように拡大・縮小に追従させる方法(オートスクロールバー付き)
WPFの画面をWebブラウザのように拡大・縮小に追従させる方法(オートスクロールバー付き)WPFの画面をWebブラウザのように拡大・縮小に追従させる方法(オートスクロールバー付き)
WPFの画面をWebブラウザのように拡大・縮小に追従させる方法(オートスクロールバー付き)
 
WooCommerce 勉強会 - 20161022
WooCommerce 勉強会 - 20161022WooCommerce 勉強会 - 20161022
WooCommerce 勉強会 - 20161022
 
気になる隣のセキュリティ(話してみましょう編)
気になる隣のセキュリティ(話してみましょう編)気になる隣のセキュリティ(話してみましょう編)
気になる隣のセキュリティ(話してみましょう編)
 
WordPressプラグインの作り方
WordPressプラグインの作り方WordPressプラグインの作り方
WordPressプラグインの作り方
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
 
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
ユニキャストワークショップ2013 はじめてのWebプログラミング#1 ~WordPressからはじめよう~
 
テーマに機能を含めちゃダメなんて誰が決めた! テーマをモリモリにカスタマイズする
 テーマに機能を含めちゃダメなんて誰が決めた! テーマをモリモリにカスタマイズする テーマに機能を含めちゃダメなんて誰が決めた! テーマをモリモリにカスタマイズする
テーマに機能を含めちゃダメなんて誰が決めた! テーマをモリモリにカスタマイズする
 
初心者でもすぐできる Wordpress バックアップのススメ
初心者でもすぐできる Wordpress バックアップのススメ初心者でもすぐできる Wordpress バックアップのススメ
初心者でもすぐできる Wordpress バックアップのススメ
 
20140214 さくらインターネットハンズオン@大阪 WordPressを始めよう
20140214 さくらインターネットハンズオン@大阪 WordPressを始めよう20140214 さくらインターネットハンズオン@大阪 WordPressを始めよう
20140214 さくらインターネットハンズオン@大阪 WordPressを始めよう
 

WordPressはじめてのプラグイン作成