WordPressプラグインCode Snippetsの使い方【functions.php編集】

この記事では、WordPressの「functions.php」ファイルを直接いじらずに編集できるプラグイン「Code Snippets」の使い方を丁寧に解説していきます。

functions.phpとは?
「functions.php」ファイルは、WordPressの機能を定義するファイルです。WordPressに独自の機能を追加するのであれば「functions.php」ファイルを編集する必要があります。
難しそうな印象を受けるかもしれませんが、もし、「functions.php」を自在にカスタマイズできるようになるとWordPressでできることの幅が一気に広がります。

1.Code Snippetsとは?

プラグイン「Code Snippets」を導入するとことで、「functions.php」ファイルを直接編集せずに、「functions.php」のコードを編集することができます。

このように説明されても、いったいなんのメリットが有るのがわかりづらいと思います。そこで、プラグイン「Code Snippets」を導入するメリットをまとめました。

メリット1:コード管理が簡単

Code Snippets導入のメリット

「Code Snippets」を導入することで、コードを機能ごとに管理できます。

上図のように、自分自身で、作成したコードに名前を付けて管理することができます。有効化/無効化の切り替えも1クリックでできます。

「Code Snippets」を使わなければ、「functions.php」ファイルを直接編集する必要があります。例えば、特定の機能を有効化/無効化させる時は、どこにそのコードが書かれているのかを探して、コードを削除するかコメントアウトする等の対応が必要となり手間がかかるのです。

メリット2:テーマ変更・更新時しても変更が引き継がれる

もう一つの利点は、WordPressテーマを変更したり、更新した場合でも「Code Snippets」での設定が引き継がれることです。

「functions.php」ファイルは、テーマを変更したり、更新するとその内容が初期状態に書き換えられてしまいます。テーマを変更/更新するたびに「functions.php」ファイルを毎回書き換えるのは面倒で仕方がないですよね?

でも、「Code Snippets」はプラグインなのでWordPressテーマを変更/更新してもコードの変更情報は引き継がれます。なので、WordPressテーマを変更/更新するたびに「functions.php」ファイルを書き換えるという手間が省けます。

メリット3:コード誤記述しても対応が簡単(バックアップを取らなくなった)

「functions.php」ファイルを編集する際に、コードを間違ってしまうと画面がめちゃくちゃになってしまうことがあります。なので、「functions.php」ファイルを変更する際には、からなずバックアップをとっていました。

でも、「Code Snippets」を導入してからは、「functions.php」ファイルのバックアップは、取らなくなりました。なぜならば、「Code Snippets」記述するコードを機能ごとに分けることができるので、バクが起こったら一番最後に更新したスペニット内のコードだけを修正すれば良いからです。

毎回バックアップをしていた僕にとっては、これはかなり助かっています。

以上が、プラグイン「Code Snippets」を導入するメリットです。

2.Code Snippetsのインストール

では、ここからは、実際に「Code Snippets」のインストールを行っていきます。

WordPress管理画面の左メニューより「プラグイン→新規追加」をクリックします。

Code Snippetsのインストール手順1

プラグインの検索窓に「Code Snippets」と入力しエンターボタンを押します。

Code Snippetsのインストール手順3

「Code Snippets」の「今すぐインストール」をクリックします。

Code Snippetsのインストール手順5

「プラグインを有効化」をクリックします。

Code Snippetsのインストール手順6

以上で、WordPressプラグイン「Code Snippets」のインストール・有効化は完了です。

Code Snippetsのインストール手順7

3.Code Snippetsの使い方

ここからは、プラグイン「Code Snippets」の使い方を解説します。

WordPress管理画面の左メニューより「Snippets」にマウスオーバーすると次の4項目が出現します。

  1. Manage
  2. Add New
  3. Import
  4. Settings

Code Snippetsの使い方1

それぞれについて解説していきます。

3-1.Manage(スペニット管理)※よく使う

Code Snippetsの使い方1-1

ここでは、追加したスペニットの管理をします。

  • スペニットの有効化/無効化の切り替え
  • スペニットの編集
  • スペニットのエクスポート
  • スペニットの削除

の操作が可能です。

Code Snippetsの使い方1-1-2

また、ディスクリプション(自分向けの説明文)やタグ(自分向けのスペニットのジャンル分け)の確認もできます。

Code Snippetsの使い方1-1-3

3-2.Add New(スペニット新規追加)※よく使う

Code Snippetsの使い方1-2

ここでは、「functions.php」ファイルに新規コードを追加することができます。

  • スペニットのタイトル
  • コード
  • 説明文(自分用なので任意)
  • タグ(自分用なので任意)
  • スペニットの適応範囲

の5つを記述することができます。

今回はとして、プラグイン「Jetpack」をインストールした際に自動的に行われるOGP設定を無効化してみました。

Code Snippetsの使い方1-2-2

書き終わったら「変更を保存」をクリックします。

「Manage」に移動してみると次のようにスペニットが追加されていることが確認できます。

Code Snippetsの使い方1-2-3

3-3.Import(スペニットをインポート)※使わない

Code Snippetsの使い方1-3

ここでは、「3-1.Manage(スペニット管理)」で解説したエクスポートを使用で保存したスペニットをインポートする際に使用します。

わざわざ、エクスポート/インポートしなくてもタイトルやコードをコピペすれば要は足りるので、あまり使用する機会はありません。笑

念のため使用手順は解説しておきます。

Code Snippetsの使い方1-3-2

エクスポートした「xml」ファイルを選択します。

Code Snippetsの使い方1-3-3

「Upload file and import」をクリックします。

Code Snippetsの使い方1-3-4

「Snippets→Manage」を確認すると1つスペニットが追加されているはずです。

3-4.Settings(設定)※使わない

Code Snippetsの使い方1-4

ここでは、WordPress管理画面の見え方を変更できます。

General:スニペット管理画面(Snippets→Manage)の表示を編集できます。

Description Editor:スニペット編集画面のDescriptionの項目の表示を編集できます。

Code Editor:スニペット編集画面のCodeの項目の表示を編集できます。

この設定は、ブログへの影響はないので特に変更する必要はありません

4.まとめ

  • WordPressプラグイン「Code Snippets」を導入するメリット
  • WordPressプラグイン「Code Snippets」のインストール方法
  • WordPressプラグイン「Code Snippets」の使い方

を丁寧に解説しました。

WordPressを独自でカスタマイズするなら「Code Snippets」を導入することで、利便性がかなりアップするはずです。

特に、WordPressテーマを頻繁に変更する方などは、テーマを変更するたびに「functions.php」を編集する手間が省けるのでおすすめですよ!

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします