Word pressのプラグインを作ってみよう wordbench奈良2015.11- (1)

Preview:

Citation preview

WordBench

plugin developerのバッチを貰おう!!

僕の事

  おなまえ すぎやま たけし

おしごと ウェブプログラマー

趣味

 

僕の事

おなまえ すぎやま たけし

おしごと ウェブプログラマー

趣味自然が作ったハート集め ‼

僕の事 趣味

Facebookで大きい写真が見れます

WordPressでしたこと

テーマ

・graftee(公式ディレクトリで公開中)

・wapuu1-child(申請中)

プラグイン

・Graftee Speed Up Kit(公式ディレクトリで公開中)

表示速度を早くする

・Without Update Themes(公式ディレクトリで公開中)

特定のテーマを更新の対象外に設定できる

・Theme Update Mode(公式ディレクトリで公開中)

テーマ編集でエラーを出しても管理画面が表示されなくなることを防ぐ

 

WordPressでしたこと

● アクセシビリティAAA対応● schema.org設定済み● HTML5の適切な要素を使っ

たマークアップ● カスタマイズの機能強化● ↑でパンくずリスト表示も可能● レスポンシブデザイン● 独自フック関数の追加● 一部の子テーマファイルの自

動読み込み● 子テーマ製作のスターター

CSS同封● 不要な処理を行わないコー

ディングで高速化● 日本語ベース

等々

 

WordPressでしたこと

grafteeの子テーマ

ファイルはたったこれだけ !!● README.md● no-repeat.svg● repeat-x.svg● repeat.svg● screenshot.png● style.css

 

WordPressでしたことif ( is_admin() ) {

function theme_update_mode_directory( $dir ) {if ( get_user_meta( get_current_user_id(), 'use_theme_update_mode', true ) != 1 ) {

return $dir;}

return dirname( __FILE__ );}

add_filter( 'stylesheet_directory', 'theme_update_mode_directory' );add_filter( 'template_directory', 'theme_update_mode_directory' );

function theme_update_mode_profile_update( $user_id, $old_user_data ) { update_user_meta( $user_id, 'use_theme_update_mode', $_POST[ 'use_theme_update_mode' ] ); }

add_action( 'profile_update', 'theme_update_mode_profile_update', 10, 2 );

function theme_update_mode_user_profile($user) { $html = ''; $html .= '<table class="form-table"><tr><th>'; $html .= '<label for="use_theme_update_mode">' . __( 'テーマ編集モード', 'theme_update_mode' ) . '</label>'; $html .= '</th><td>'; $html .= '<input type="checkbox" name="use_theme_update_mode" id="use_theme_update_mode" value="1" ' . checked( $user->use_theme_update_mode, 1, false) . '/>'; $html .= __( '使用する', 'theme_update_mode' ); $html .= '<p class="description">' . __( '管理画面ではテーマが動かなくなります。それにより、テーマでエラーを起こしても管理画面が表示できなくなることを防ぎます。', 'theme_update_mode' ) . '</p>'; $html .= '</td></tr></table>'; $html .= '';

echo $html; }

add_action( 'show_user_profile', 'theme_update_mode_user_profile' ); add_action( 'edit_user_profile', 'theme_update_mode_user_profile' );}

こんなに短いコードでも

プラグインデベロッパーバッジをゲット !!

僕の事

  おなまえ すぎやま たけし

おしごと ウェブプログラマー

趣味

よろしくお願いします

この写真にもハートが隠れているよ※合成ではありません

 

僕の事

自己紹介おしまいだにゃ

ファイル構造

プラグインの作り方

plugins/プラグイン名 /プラグイン名 .php

例:(プラグイン名=Super SEO)

plugins/super_seo/super_seo.php

PHPの先頭コメント

プラグインの作り方

例:(プラグイン名=Super SEO)

/*Plugin Name: プラグイン名

Plugin URI: プラグインURLDescription: プラグインの説明

Author: あなたのお名前

Author URI: あなたのURLVersion: プラグインのバージョン

Text Domain: 多言語対応で使われるユニークな文字列

License: GPLv2License URI: https://www.gnu.org/licenses/gpl-2.0.html*/

/*Plugin Name: Super SEOPlugin URI:Description: SEO for your WordPress blog.Author: Takeshi SugiyamaAuthor URI: https://profiles.wordpress.org/8suzuran8/Version: 1.0Text Domain: super_seoLicense: GPLv2License URI: https://www.gnu.org/licenses/gpl-2.0.html*/

フック(割り込み処理)について

プラグインの作り方

・アクションフック任意の処理の途中に別の処理を追加する。add_action( ‘フック名’, ‘追加する処理の関数名’ );

function 追加する処理の関数名() {処理する内容

}

・フィルターフック任意の結果を加工するadd_filter( ‘フック名’, ‘結果を加工する関数名’ );

function 結果を加工する関数名( $output ) {return $output . ‘abcdefg’;

}

$outputには初期値が入ってます。

wordpress hook

でググるとフック一覧ページに辿り着きます。

作ってみよう!!

プラグインの作り方

/*Plugin Name: Login Logo Link ChangerPlugin URI:Description: change login log linkAuthor: Takeshi SugiyamaAuthor URI: https://profiles.wordpress.org/8suzuran8/Version: 1.0Text Domain: login_logo_link_changerLicense: GPLv2License URI: https://www.gnu.org/licenses/gpl-2.0.html*/

function login_logo_url( $url ) {return 'https://profiles.wordpress.org/8suzuran8/';

}

add_filter( 'login_headerurl', 'login_logo_url' );

ログイン画面のロゴのリンク先を、任意のURLに変更するプラグイン

おまけ

プラグインの作り方

不要な画面で処理をしないで速度低下を避ける

// 公開側、管理側の両方で処理されるif ( is_admin() ) { // 公開側を表示している時は処理されない} else { // 管理側を表示している時は処理されない}// 公開側、管理側の両方で処理される※管理画面のカスタマイズ機能を作る時は注意が必要 !!

プラグインを入れすぎて重くなったー(> ε<)

ということが減ります(^ω^)

おまけ

プラグインの作り方

有料プラグインにつなげてみる?!

・オリジナルアクションフック任意の処理の途中に別の処理を追加する。do_action( ‘フック名’, ‘渡す値’ );

有料プラグインでadd_action( ‘フック名’, ‘追加する処理の関数名’ );として使う。

・オリジナルフィルターフック任意の結果を加工するapply_filters( ‘フック名’, ‘初期値’ );

有料プラグインでadd_filter( ‘フック名’, ‘結果を加工する関数名’ );として使う。

このプラグインも一緒に使うとこんないいことがあるよ!!

おまけ

プラグインの作り方

/*Plugin Name: Login Logo Link ChangerPlugin URI:Description: change login log linkAuthor: Takeshi SugiyamaAuthor URI: https://profiles.wordpress.org/8suzuran8/Version: 1.0Text Domain: login_logo_link_changerLicense: GPLv2License URI: https://www.gnu.org/licenses/gpl-2.0.html*/

if ( ! is_admin() ) {function login_logo_url( $url ) { return 'https://profiles.wordpress.org/8suzuran8/';}

add_filter( 'login_headerurl', 'login_logo_url' );}

ログイン画面のロゴのリンク先を、任意のURLに変更するプラグイン

return apply_filters(‘login-logo-link-changer-more’, ‘https://profiles.wordpress.org/8suzuran8/’

);

 プラグインの作り方おしまいだブ~

プラグインの作り方

 

プラグインを公式ディレクトリに申請

・コーディングスタイルを守る

・多言語対応

・readme.txtを作る

 

プラグインを公式ディレクトリに申請

・コーディングスタイルを守る

・多言語対応

・readme.txtを作る

 

プラグインを公式ディレクトリに申請

・行頭のインデントはスペースではなくタブ

・代入の「=」や連想配列の「=>」は他の行に合わせる

・配列を定義する場合、最後の行末にもカンマをつける

・ブロックが35行以上になる場合、閉じカッコにコメントを書いておく

・行末にスペースは置かない

・演算子の前後とカンマの後にはスペースを置く

・制御文の括弧の前後はスペースを置く

・関数定義の引数の開始カッコの前はスペースを置かない

・配列の添字が固定値ならスペースを置かない

・配列の添字が変数なら、変数の前後にスペースを置く

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

 

プラグインを公式ディレクトリに申請

・行頭のインデントはスペースではなくタブ

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

function hoge() {return true;

}

 

プラグインを公式ディレクトリに申請

・代入の「=」や連想配列の「=>」は他の行に合わせる

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge = array(‘key’ => ‘value’,‘keyhoge’ => ‘value’,1 => ‘value’,

);

 

プラグインを公式ディレクトリに申請

・配列を定義する場合、最後の行末にもカンマをつける

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge = array(0 => ‘value’,1 => ‘value2’,2 => ‘value3’,

);

 

プラグインを公式ディレクトリに申請

・ブロックが35行以上になる場合、閉じカッコにコメントを書いておく

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

function hoge() {・・・・

} // end of hoge

 

プラグインを公式ディレクトリに申請

・行末にスペースは置かない

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge = ‘abc’;

 

プラグインを公式ディレクトリに申請

・演算子の前後とカンマの後にはスペースを置く

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge = $aaa + $bbb;

 

プラグインを公式ディレクトリに申請

・制御文の括弧の前後はスペースを置く

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

foreach ( $values as $value ) {}

 

プラグインを公式ディレクトリに申請

・関数定義の引数の開始カッコの前はスペースを置かない

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

function hoge () {}

function abc() {}

 

プラグインを公式ディレクトリに申請

・配列の添字が固定値ならスペースを置かない

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge[ ‘name’ ];

$hoge[‘name’];

 

プラグインを公式ディレクトリに申請

・配列の添字が変数なら、変数の前後にスペースを置く

https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/

$hoge[ $key ];

$hoge[$key];

 

プラグインを公式ディレクトリに申請

・コーディングスタイルを守る

・多言語対応

・readme.txtを作る

 

プラグインを公式ディレクトリに申請

__( ‘あああああ’, ‘Text Domain’ )_e( ‘あああああ’, ‘Text Domain’ )_n( ‘あああああ’, ‘Text Domain’ )_x( ‘あああああ’, ‘Text Domain’ )

 

プラグインを公式ディレクトリに申請

・コーディングスタイルを守る

・多言語対応

・readme.txtを作る

 

プラグインを公式ディレクトリに申請

https://wordpress.org/plugins/about/

ここのreadme.txtのベースファイルをいじって作る

ここで作ったreadme.txtのチェック

フォーマットは変えないで!!

 

プラグインを公式ディレクトリに申請=== Plugin Name ===Contributors: wordpress.orgのアカウント名

Donate link: Tags: タグ

Requires at least: WordPerss本体の必須バージョン

Tested up to: 確認済みのWordPerss本体のバージョン

Stable tag: 安定するプラグインのバージョン、または truncLicense: GPLv2 or laterLicense URI: http://www.gnu.org/licenses/gpl-2.0.html

ここに150文字以内の説明文

== Description ==長い説明文。使い方とかも。

== Installation ==Installation using "Add New Plugin"1. From your Admin UI (Dashboard), go to Plugins. Click the "Add New" button.2. Search for plugin, or click the "Upload" button, and then select the plugin you want to install.3. Click the "Install Now" button.

Manual installation1. Upload the "プラグインのディレクトリ名 " folder to the "/wp-content/plugins/" directory.

== Changelog ==

= 1.0 =* Initial Release

大体こんな感じ

 

プラグインを公式ディレクトリに申請日付:2015年9月21日 4:11

8suzuran8,Your plugin hosting request has been approved.Within one hour, you will have access to your SVN repository athttp://plugins.svn.wordpress.org/graftee-speed-up-kit/with your WordPress.org username and password (the same one you use on the forums).Here's some handy links to help you get started.Using Subversion with the WordPress Plugins Directoryhttps://wordpress.org/plugins/about/svn/FAQ about the WordPress Plugins Directoryhttps://wordpress.org/plugins/about/faq/WordPress Plugins Directory readme.txt standardhttps://wordpress.org/plugins/about/readme.txtreadme.txt validator:https://wordpress.org/plugins/about/validator/

Enjoy!

申請した翌日に来たメール

1時間以内にSVNリポジトリにアクセスしてって

着信時間が(゜Д゜)

朝の5:11までに対応してください(笑)※二つ目以降のプラグインは、朝 8:30頃に、同じ内容のメールが来ました。

 申請方法

おしまいだペン

プラグインを公式ディレクトリに申請

僕の事

おなまえ すぎやま たけし

おしごと ウェブプログラマー

趣味

有難うございましたm(__)m