WordPressに対するプログラムでのカスタマイズと言えば、子テーマを有効化してfunctions.phpなどへカスタマイズコードを入れるのが一般的でしょう。
一部テーマ特有のフックはあるものの、そのためだけに子テーマを使うのであれば、プラグインでほぼ同じことができ、しかも子テーマのfunctions.phpやstyle.cssの代用としてなら、比較的簡単に作れますから、自分専用のプラグインを作ってみましょう。
必要なファイルやフォルダ、コードの準備
プラグインは、以下のような構造と名前になっていなければなりません(厳密にはそうでなくても動きますが、後々苦労することがないと思います)。
- 「プラグイン名」フォルダ
- 「プラグイン名.php」ファイル
- 「スタイルのファイル名.css」
「プラグイン名」の部分は、例えば「My Plugin」という名前を付けようとした場合、名前を小文字の半角英数字にし、空白を「-」でつないで「my-plugin」とします。
「スタイルのファイル名」の部分は、一般的には「style」を使うことが多いですが、特に指定はありません。
ここでは「My Plugin」という名前、「style」というCSSファイル名とした前提での構造を下に示しますので、必要なフォルダ、ファイルをパソコン上で作成します。
- 「my-plugin」フォルダ
- 「my-plugin.php」ファイル
- 「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」へアップロードします。
アップロード後の階層としてはこんな感じになります。
- サイトの格納場所
- wp-content
- plugins
- my-plugin
- my-plugin.php
- style.css
- my-plugin
- plugins
- wp-content
2.管理画面のプラグイン新規追加を使う場合
サイトの管理画面から「プラグイン」→「新規追加」を選択し「プラグインのアップロード」からインストールする場合はzip形式で圧縮する必要があるのですが、パソコン上で解凍した中に「my-plugin」フォルダが存在している必要があります。
一度「my-plugin」フォルダをzip形式で圧縮し、再度解凍して、以下のようになっているかを確認ください。
- 「my-plugin」フォルダ
- 「my-plugin」フォルダ
- 「my-plugin.php」ファイル
- 「style.css」ファイル
- 「my-plugin」フォルダ
確認できたら、サイトの管理画面からプラグインのアップロードを選択し、「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');
実際に翻訳する場合には、以下のプラグインを使って必要なファイルを生成すると便利です。
プログラム用ファイルを追加するには
今回の方法では「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
- plugins
- wp-content
そして、「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にはテーマでしか利用できない関数やフックがあります。
これらを使ったプログラムを子テーマから自作プラグインへ移行すると、エラーとなって最悪の場合サイトがストップしてしまうことがあります。
テーマ固有のフックは使えない
現在有効化しているテーマによっては、どこかに何かの処理を追加したり、限定したりするための独自フックが用意されているものがあります。
そのテーマを有効化している間は、自作プラグイン内に固有のフックを含めたプログラムを記述しても問題ありませんが、テーマを変更した時にエラーとなり、最悪の場合サイトがストップしてしまうことがあります。
コメントを残す