functions.phpのコードを管理することができる【Code Snippets】使い方

WordPressのカスタマイズとして『functions.phpにコードを記述する』という方法がありますね。
カスタマイズ項目が増えてくると、コードがゴチャゴチャとして煩雑になってしまい、どこに何を追記したのか分からなくなってしまうことがよくあります。

またテーマを変更した場合、functions.phpも書き換えなければならないので、不具合が起きる可能性も高くなってしまいます。

テーマに依存せずに、カスタマイズが行えるようになると便利になりますね。
Code Snippets】は、functions.phpで実行するPHPコードを管理することができるプラグイン。
テーマ内のfunctions.phpにコードを記述しなくてもプラグイン内で行えるようになるので、テーマを変更してもコードがそのまま使えるようになり、また増えすぎたコードの管理もしやすくなります。

こんな場合におススメ

  • functions.phpにたくさんコードを記述している
  • functions.phpに記述したコードを分かりやすく管理したい
  • テーマをよく変更するが、そのたびにfunctions.phpを書き換えるのは面倒

プラグインを使ってできること

  • functions.phpで実行するPHPコードを管理することができる
  • テーマを変更しても、functions.phpを書き換えなくてもすむようになる
スポンサーリンク

インストール

Code Snippets インストール

  1. 管理画面から プラグイン > 新規追加 とクリックする
  2. Code Snippets“で検索する
  3. “今すぐインストール”をクリック。インストール後、有効化する

または、配布サイトからダウンロードして、インストール。
Code Snippets– WordPress プラグイン | WordPress.org

手動でインストールする方法はコチラ

関連記事

WordPressのプラグインをインストールする方法は、全部で3つあります。 ダッシュボードから検索してインストールする ダッシュボードからZIP形式のファイルをアップロードする FTPでサーバーにアップロードする […]

WordPressのプラグインをインストールする方法

使用方法

管理画面 > Snippets > Add New からコードをfunctions.phpで実行したいコードを記述し、スニペットを作成します。

Code Snippets 新規追加

  • STEP.1
    タイトルを記述
    管理用なので、自分が分かるようにタイトルを記述します
  • STEP.2
    PHPコードを記述
    funtions.phpで実行したいコードを記述します
  • STEP.3
    実行する範囲を選択
    Run snippet everywhere 管理画面とサイトの両方で実行する
    Only run in administration area 管理画面でのみ実行する
    Only run on site front-end サイト上でのみ実行する
    Only run once 1度だけ実行する
  • STEP.4
    コードの説明を記述
    自分が分かるように書けばいいので、なしでも可。設定から非表示にすることもできます
  • STEP.5
    タグを記述
    管理用なので、なしでも可。設定から非表示にすることもできます
  • STEP.6
    保存
    Save Changes and Active 保存後、スニペットを有効化する
    Save Changes 保存のみ。有効化はしない

インポートとエクスポート

作成したスニペットはインポートとエクスポートができるので、他のWordPressサイトでも【Code Snippets】プラグインを入れておけば、コードを記述することなく、使用することができます。

エクスポート

管理画面 > All Snippets からスニペット一覧画面を表示します。
エクスポートしたいスニペットを選択後、『一括操作 > Export』を選択し、適用ボタンを押すと、JSONファイルが作成されるのでダウンロードしてください。
Code Snippets エクスポート

スニペットをひとつだけエクスポートしたい場合は、タイトル下の『Export』をクリック。
Code Snippets エクスポート

インポート

管理画面 > Snippets > Import からエクスポートしたJSONファイルをアップロードして、インポートします。
Code Snippets インポート

Ignore any duplicate snippets:
import all snippets from the file regardless and leave all existing snippets unchanged.
ファイルからすべてのスニペットをインポートするが、重複するスニペットは変更しない
Replace any existing snippets with a newly imported snippet of the same name. 既存のスニペットを新しくインポートしたスニペットに置き換える
Do not import any duplicate snippets;
leave all existing snippets unchanged.
重複したスニペットをインポートせず、既存のすべてのスニペットをインポートしない

設定

管理画面 > Snippets からプラグインの設定を行います。

General

Code Snippets 設定 General

Activate by Default コードを保存時に有効化するかの選択
Enable Scope Selector コード編集画面で『実行する範囲を選択設定』を表示するかの選択
Enable Snippet Tags コード編集画面で『タグの記述』フィールドを表示するかの選択
Enable Snippet Descriptions コード編集画面で『説明文記述』テキストエリアを表示するかの選択
Disable Shortcode Syntax Highlighter
Complete Uninstall プラグイン削除時に、すべてのスニペットと設定を削除するかの選択

Description Editor

Code Snippets 設定 Description Editor

Row Height 説明文のエディターの行の高さを指定
Use Full Editor ビジュアルエディターのすべての機能を有効にするかの選択
Media Buttons 『メディアの追加』ボタンを表示するかの選択

Code Editor

Code Snippets 設定 Code Editor

Theme コードエディターのテーマを選択
Indent With Tabs タブでインデントするかの選択
Tab Size タブでインデント時の幅を指定
Indent Unit インデントのスペース数
Wrap Lines 行を折り返し表示するかの選択
Line Numbers エディターの左側に行番号を表示するかの選択
Auto Close Brackets コード入力時、括弧とコーテーションマークを自動的に閉じるかの選択
Highlight Selection Matches 選択した単語を強調表示するかの選択
Editor Preview 上記の設定を反映した状態でのコードエディターをプレビュー表示

管理画面に入れなくなってしまった場合

【Code Snippets】にはコードの整合性をチェックする機能があるので、エラーがあるときは画面が切り替わり、コードの間違っている箇所を表示してくれます。
Code Snippets エラー時

しかし、コードにエラーがなくても他のプラグインとの競合などで管理画面が真っ白になってしまう場合もあります。
そのときは、プラグインをセーフモードにすることで一時的にスニペットを無効化することができます。

セーフモードにする方法

wp-congif.phpに下記のコードを記述してください。

wp-config.php

define('CODE_SNIPPETS_SAFE_MODE', true);

セーフモード時は、スニペット一覧画面にセーフモードであることを表すメッセージが表示されます。
Code Snippets セーフモード時

不具合を起こしているコードを削除または無効化し不具合が解消されたら、wp-config.phpに記述したコードを削除・セーフモードを停止してください。

動作確認環境

  • バージョン 2.13.3
  • WordPress 5.2.2
このプラグインは上記の環境で動作を確認しましたが、ご使用の環境によっては、動作しないなどの不具合が起きる可能性がありますので、ご注意ください。

まとめ

  • 【Code Snippets】は、functions.phpに記述するPHPコードを管理することのできるプラグイン。
  • テーマを変更してもコードがそのまま使えるようになり、コードの管理もしやすくなります。
functions.phpのコードを管理することができる【Code Snippets】使い方
最新情報をチェックしよう!
スポンサーリンク