WordPressの最大の特徴ともいえるのが「プラグイン」です。配布されているプラグインを自分のサイトに組み込むことで、あらゆる機能を使うことができます。
誰かが作ったプラグインを自サイトに組み込むことでプログラミングのスキルなしにサイトの開発ができてしまうわけですが、そのプラグインを自作できるとしたら、自分のサイトに特化したより役に立つものができそうですよね。
そう思っていろいろ調べてみたのですが、自作プラグインというものが思ったよりも簡単で、プログラミングのスキルがほとんど無くても作れるんじゃない？って思ったので共有します。私の備忘録的な感じですね。
お久しぶりです
すみません。これは本編とは全く関係がないのですが、あまりに久しぶりに記事を書くものですからちょっと語りたくてこのような見出しを作りました。
BableTech管理人のBabuでございます。本当に一年ぶりくらいに記事を書いているのではないでしょうか。入学してから忙しくてなかなかBableTechに手を付けることができていなかったわけですが、ちょっと時間ができたのでいよいよ本格的にこのサイトを進化させていきたいと思っているところです。
そうとなったらやっぱりプラグインもテーマも何もかも自サイト用に開発する方が良い、と思いまして、ここ半年ほどWordPressについて勉強してまいりました。 そして「思ったよりWordPressのカスタマイズって簡単じゃん」と思いまして、それを共有したかったのでこれから少しずつ備忘録的な感じで投稿していこうと思います。
さて本編行きましょう！
WordPress自作プラグインの導入手順
「初心者でも簡単にできる」みたいなことを言いつつも、自分の備忘録的な感じで軽く書いておきたいだけってのはあるので、ある程度のコンピュータ知識（FTPとかを使いこなせたり…）がある前提で、簡潔に紹介していきたいと思います。
プラグインファイルを作る
WordPressのwp-contentというフォルダにはテーマを格納しているフォルダとかと共に、プラグインを格納している「plugins」というフォルダも存在します。その中にプラグインのファイルが入っているわけですね。
そしてその中に以下のようなプラグインフォルダを作るわけですね。
wp-content/plugins/my-pluginそしてこのプラグインフォルダの中に、プラグインについての情報を説明するPHPファイルを作ります。これでプラグインの作成は完了です。めちゃくちゃ簡単ですよね。
#プラグインフォルダの中にプラグイン情報ファイルを作成
wp-content/plugins/my-plugin/my-plugin.phpプラグイン情報を記入
続いて、このファイルをWordPressに「プラグインの説明書」として認識してもらうために、特別な記述をする必要があります。
<?php
/*
Plugin Name: プラグインの名前
Description: プラグインの説明
Author: 作った人の名前
*//*と*/で囲っているのでコメントとして扱われる記述なのですが、WordPressちゃんはコメントまでもしっかり解釈してきます。 そしてこの記述があることによって「あ、プラグインがある」って認識するのです。
この記述をするまではインストール済みプラグインのリストにも入ってなかったのですが、記述をしたらちゃんと現れました。 でもまだ有効化できてないので有効化しましょう。
まぁプラグイン情報以外何も記述していない空のプラグインなのでまだ何も起きませんが…
左メニューを表示
プラグインを作るってのが目標ならもはやこれで達成なのですが、なにも機能がないとさすがにつまらないので、「左メニュー」を作ってみることにしましょう。左メニューってのは管理画面の左の方にある「外観」とか「プラグイン」とかのメニューですね。ここに自作プラグインも入れ込んで、プラグインページを作っちゃいましょう！
<?php
/*
Plugin Name: プラグインの名前
Description: プラグインの説明
Author: 作った人の名前
*/
add_action('admin_menu', function(){
//メインメニュー
add_menu_page(
'Myプラグイン' //ページのタイトル
, 'Myプラグイン' //メニューの文字列
, 'manage_options' //アクセスするために必要な身分 manage_optionsは管理者に与えられる。readだったら購買者
, 'my_plugin_page' //スラッグ名（これがURLの一部となる）
, 'show_my_plugin_page' //ページを表示するための関数
, 'dashicons-admin-generic' //メニューのアイコンを指定
, 0 // メニューが表示される位置(0が先頭) 5=投稿,10=メディア,20=固定ページ,25=コメント,60=テーマ,65=プラグイン,70=ユーザー,75=ツール,80=設定
);
});
//メニューを表示する関数
function show_my_plugin_page(){
?>
<!-- ここにHTML等を記述 -->
<h2>私のプラグインです</h2>
<?php
}
?>WordPress関数「add_action」の第一引数に「admin_menu」と入れることで追加することができます。左メニューを読み込むときに、第二引数で指定された関数も実行してくれるということですが、ここでは無名関数としています。
そしてメニューを追加する関数は「add_menu_page」です。わかりやすいですね。
この関数ではコメントで説明しているような引数を与えることでメニューを登録することができます。ちなみにメニューのアイコンについては、
https://developer.wordpress.org/resource/dashicons/
から選んでアイコン名を入力したり、自前の画像を使うことができたりします。用意されているdashiconsが結構充実しているので、この中から選ぶ方がおすすめです。
そしてこれらの記述の後に、ページを表示するための関数も定義しましょう。
上のコードのように「?>」で一回PHPモードをやめることで直接HTMLコードを書くことができます。もしくはPHPモードのままにして、「echo」でHTMLコードを出力するというスタイルをとっても良いでしょう。
ちゃんと表示されましたね。あとはこのページ表示関数の中にJavaScriptを組み込んだりして自分のサイトに特化した機能を持つプラグインを作っちゃいましょう。
くれぐれもセキュリティ面は気を付けてくださいね～
左メニューのサブメニューの作り方やブロックの作り方等についてはこれから発信していきたいと思います。