自分専用のプラグインを作ろう

公開日:2023(令和5)年9月16日/最終更新日:

How to create a plugin | Personal WP Customization Notes (PWCN)

【景品表示法に基づく表記】ページ内のコンテンツには、商品プロモーションが含まれています



WordPressに対するプログラムでのカスタマイズと言えば、子テーマを有効化してfunctions.phpなどへカスタマイズコードを入れるのが一般的でしょう。

一部テーマ特有のフックはあるものの、そのためだけに子テーマを使うのであれば、プラグインでほぼ同じことができ、しかも子テーマのfunctions.phpやstyle.cssの代用としてなら、比較的簡単に作れますから、自分専用のプラグインを作ってみましょう。

本ページで掲載しているコードは、以下に了承した上で使用ください

  • コードは商用・非商用問わず自由に使っていただいて構いませんが、コード追加による不具合やトラブルが発生しても当方では一切責任を負いません
  • コードは有効化しているテーマのfunctions.php、style.cssなどへ追加することで機能します。それらのファイルへの変更を行うことに不安のある方は使用しないでください
  • コードは本ページの公開日時点で私の環境において動作したものです。WordPressバージョン他環境の違いによって動作しないことがあります
  • コードは、セキュリティ、コードの正確さなどにおいて完全なものではありません。中には紹介するコードを簡略化するために省略している部分があるものもありますので、ご自身でコードを十分に検証し、必要な部分の編集を行った上で使用するようにしてください
  • 掲載しているのは参考コードです。自身の環境に合わせるための編集はご自身で対応いただく必要があります(コメント欄等から質問いただいても基本回答は致しません)
  • 掲載しているコードの転載を禁じます(SNSで紹介いただいたり、本ページへのリンクを張っていただくことは大歓迎です)

必要なファイルやフォルダ、コードの準備

プラグインは、以下のような構造と名前になっていなければなりません(厳密にはそうでなくても動きますが、後々苦労することがないと思います)。

「プラグイン名」の部分は、例えば「My Plugin」という名前を付けようとした場合、名前を小文字の半角英数字にし、空白を「-」でつないで「my-plugin」とします。

「スタイルのファイル名」の部分は、一般的には「style」を使うことが多いですが、特に指定はありません。

ここでは「My Plugin」という名前、「style」というCSSファイル名とした前提での構造を下に示しますので、必要なフォルダ、ファイルをパソコン上で作成します。

スタイルのカスタマイズが必要なければ「style.css」というファイルも必要ありません

これをサイトの「plugins」フォルダ内へ転送するわけですが、WordPressにプラグインとして認識してもらうために必要な記述がありますので、「my-plugin.php」へ以下のコードを追加します。

最低限赤字部分の記述があれば大丈夫です

<?php
//このファイルへの直接アクセスを禁止
if ( !defined( 'ABSPATH' ) ) exit;
/*
Plugin Name: My Plugin
Plugin URI: プラグイン配布ページなどのURL
Description: プラグインの説明文
Version: 1.0
Requires at least: 6.3
Requires PHP: 7.4
Author: 作者名
Author URI: 作者が運営するサイトのURL
License: GPLv2 or later
Text Domain: my-plugin
*/

基本的に上記のコードを追加して各所の文字を編集すればよいでいが、以下に不備があるとこれまた認識されませんので注意が必要です。

  • 「plugin Name」などの項目の左には空白を入れない
  • 「plugin Name」などの項目の文字列、空白は変更しない
  • 空白行を入れない
  • 「項目名:」の後ろには必ず半角の空白( のところ)を入れる
  • 各項目末尾には空白を入れない

プラグインのアップロードと有効化

ファイル・フォルダ・プログラムができあがったら、以下のいずれかの方法でプラグインをサイトへアップロードします。

1.FTPクライアントツールやサーバーのファイルマネージャーなどを使う場合

パソコン上の「my-plugin」フォルダをフォルダごと「サイトの格納場所」→「wp-content」→「plugins」へアップロードします。

アップロード後の階層としてはこんな感じになります。

2.管理画面のプラグイン新規追加を使う場合

サイトの管理画面から「プラグイン」→「新規追加」を選択し「プラグインのアップロード」からインストールする場合はzip形式で圧縮する必要があるのですが、パソコン上で解凍した中に「my-plugin」フォルダが存在している必要があります。

一度「my-plugin」フォルダをzip形式で圧縮し、再度解凍して、以下のようになっているかを確認ください。

  • 「my-plugin」フォルダ
    • 「my-plugin」フォルダ
      • 「my-plugin.php」ファイル
      • 「style.css」ファイル

確認できたら、サイトの管理画面からプラグインのアップロードを選択し、「my-plugin.zip」ファイルを選択してインストールします。


いずれかの方法でインストールしたら、プラグインの一覧から「My Plugin」を探し、「有効化」をクリックして問題等が発生しなければ、ひとまずプラグインとして動作するようになります。

プラグインのスタイルを読み込ませる

ここまででは、「style.css」というスタイルコード記述用のファイルは存在するものの、そこに何かを記述しても何も起こりません。

管理画面から「ツール」→「プラグインファイルエディター」(または「プラグイン」→「プラグインファイルエディター」)を開き、右上のプラグイン選択窓で「My Plugin」を選択して、「my-plugin.php」の末尾へ以下のコードを追加します。

/*** style.cssの読み込み ***/
function my_plugin_enqueue_custom_style(){
$rand = rand( 1, 99999999999 );

//スタイルシートの登録
	wp_register_style(
		'my-plugin-custom-style',
		plugin_dir_url( __FILE__ ) .'style.css',
		array(),
		$rand,
		'all'
	);

	wp_enqueue_style('my-plugin-custom-style');
}
add_action('enqueue_block_assets','my_plugin_enqueue_custom_style',9999);

上記コードでは、入力したスタイルコードがすぐに反映されるようにしています

これで、「style.css」へ追加したスタイルコードのスタイルが、フロントエンド(閲覧画面)側、ブロックエディター側両方に反映されるようになります。

試しに「style.css」へ以下のコードを追加して、段落の文字の色が赤になるかを確認してください。

p{
color:red!important;
}

ここではスタイルの読み込みに「enqueue_block_assets」というフックを使用しています。このフックは古いWordPressバージョンでは機能しませんのでご注意ください

翻訳を適用できるようにするには

まあ個人用のプラグインを作るので、特に国際化をする必要はないとは思いますが一応..。

まずは、プラグインフォルダの中に「languages」という空のフォルダを設置します。

次に「my-plugin.php」へ以下のコードを追加します。

/*** 翻訳ファイルの適用 ***/
function my_plugin_load_textdomain() {
	load_plugin_textdomain( 'my-plugin', false, dirname( plugin_basename( __FILE__ ) ) . '/languages' ); 
}
add_action( 'plugins_loaded', 'my_plugin_load_textdomain' );

更に、今後追加していくPHPプログラムの中で翻訳を可能とする文字列の部分を以下のようにして、基本を英語表記にします。

__('英語の文字列','my-plugin');

実際に翻訳する場合には、以下のプラグインを使って必要なファイルを生成すると便利です。

追記

WordPress 6.7以降のバージョンにおいて、プラグインやテーマの翻訳ファイルを上記コードで読み込ませた場合に、「Notice: 関数 _load_textdomain_just_in_time が誤って呼び出されました。...」という注意が表示させる場合があります。

この注意が出力されないようにし、かつ、確実に翻訳ファイルを読み込ませる手法については以下を参照し、自身のプラグインに合った方法で翻訳を適用してください。

プログラム用ファイルを追加するには

今回の方法では「my-plugin」フォルダがテーマでいう「functions.php」と同じ役割を果たすわけですが、CSSを読み込ませたり、翻訳を適用させたりするための必須のコードと、追加カスタマイズを行うコードがごちゃごちゃになって、不意に必要な記述を削除してトラブルとなることもありますので、早いうちに、以下の手順に従って、カスタムコードは別のファイル(または、必須のコードを別のファイル)で記述して適用させておくことをおすすめします。

前準備として、パソコン上で「custom-functions.php」というファイルを作り、以下のプログラムコードを記述します。

<?php
//このファイルへの直接アクセスを禁止
if ( !defined( 'ABSPATH' ) ) exit;

これは、phpコードであるという宣言と、外部から直接このファイルを参照できないようにするための記述です

FTPなどを使って、プラグインフォルダ内に「custom-functions.php」ファイルを転送します。

次に「my-plugin.php」へ以下のコードを追加します。

/*** custom-functions.phpの読み込み ***/
require_once (__DIR__ .'/custom-functions.php');

これで、「custom-functions.php」へ記述した内容がプログラムとして読み込まれるようになりますので、そこにカスタムコードを入れるのか、必須コードを入れるのかを決めた上で、プログラムを移動させます。


これで基本的な構造を持つ自作プラグインが完成しました。すべての機能を含めた場合には、以下のような階層構造になります。

  • サイトの格納場所
    • wp-content
      • plugins
        • my-plugin
          • custom-functions.php
          • my-plugin.php
          • style.css

そして、「my-plugin.php」を必須プログラムの設置場所とした場合には以下のコードが入っていることになります。

<?php
//このファイルへの直接アクセスを禁止
if ( !defined( 'ABSPATH' ) ) exit;
/*
Plugin Name: My Plugin
Plugin URI: プラグイン配布ページなどのURL
Description: プラグインの説明文
Version: 1.0
Requires at least: 6.3
Requires PHP: 7.4
Author: 作者名
Author URI: 作者が運営するサイトのURL
License: GPLv2 or later
Text Domain: my-plugin
*/

/*** style.cssの読み込み ***/
function my_plugin_enqueue_custom_style(){
$rand = rand( 1, 99999999999 );

//スタイルシートの登録
	wp_register_style(
		'my-plugin-custom-style',
		plugin_dir_url( __FILE__ ) .'style.css',
		array(),
		$rand,
		'all'
	);

	wp_enqueue_style('my-plugin-custom-style');
}
add_action('enqueue_block_assets','my_plugin_enqueue_custom_style',9999);

/*** 翻訳ファイルの適用 ***/
function my_plugin_load_textdomain() {
	load_plugin_textdomain( 'my-plugin', false, dirname( plugin_basename( __FILE__ ) ) . '/languages' ); 
}
add_action( 'plugins_loaded', 'my_plugin_load_textdomain' );

/*** custom-functions.phpの読み込み ***/
require_once (__DIR__ .'/custom-functions.php');

自作プラグイン使用時の注意点

子テーマの代替として汎用的に使用できて便利な自作プラグインですが、以下の注意が必要で、これらを使用する場合には子テーマを使ってプログラムを記述することをおすすめします。

WordPress標準でテーマ専用のフックや関数は使えない

すべて列記できないのでどれがというのは割愛しますが、WordPressにはテーマでしか利用できない関数やフックがあります。

これらを使ったプログラムを子テーマから自作プラグインへ移行すると、エラーとなって最悪の場合サイトがストップしてしまうことがあります。

テーマ固有のフックは使えない

現在有効化しているテーマによっては、どこかに何かの処理を追加したり、限定したりするための独自フックが用意されているものがあります。

そのテーマを有効化している間は、自作プラグイン内に固有のフックを含めたプログラムを記述しても問題ありませんが、テーマを変更した時にエラーとなり、最悪の場合サイトがストップしてしまうことがあります。

, , , , , , , ,



Lolipop ServerMoshimo Ad x-serverMoshimo Ad

How to create a plugin | Personal WP Customization Notes (PWCN)
自作プラグインのバージョン番号をスクリプト、CSSの「?=〇〇」として出力する方法(メモ)