95 Shares

WordPressのfunctions.phpを簡単に管理できるプラグイン「Code Snippets」

工事中

『紹介されていたコードを functions.php にコピペして保存した瞬間、ブログが真っ白になって管理画面にも入れなくなった・・・』

そんな話を聞くと WordPress をカスタマイズするのがこわくなっちゃいますよね。FTP でファイルを上書きすれば元に戻りますが、バックアップがなければちょっと面倒ですし、どんなミスがエラーにつながるかわからないと触るのもこわいと思います。

というわけで本日は、そんな悩みを払拭してくれるプラグイン「Code Snippets」をご紹介したいと思います。このプラグインがあれば functions.php はこわくありません!

Code Snippetsでfunctions.phpを管理しよう

functions.php を編集することで、WordPress に様々な機能を追加することができます。

最近のテーマは「これでもか」というほどコードがぎっしり入っているので、その文字列を見ただけで頭がクラクラしてくるかもしれません。

この functions.php はけっこうクセモノで、ちょっとしたミスだけでブログが表示されなくなることがあります。

たとえば、以下のコードはどちらも同じように見えますが、2 つ目のコードをそのままコピペするとブログが真っ白になります。

パッと見ただけで、違いはわかりませんよね。

でも、実は 2 つ目のコードには全角スペースが入っていて、たったこれだけでエラーが起きてブログが真っ白になるのです。

コード内に全角スペースが入っている

functions.php にコードをコピペするときは、いったんテキストエディタを経由するクセをつけておくとよいですね。

でも、Code Snippets を使えばこんなエラーも回避できます。

Code Snippetsをおすすめする理由

プラグイン「Code Snippets」を使えば、functions.php を直接編集する必要はありません。加えて以下のメリットがあります。

Code Snippetsを使うメリット
  • コードをわかりやすく管理できる
  • 編集・追記・削除が簡単
  • インポート・エクスポート機能がある
  • エラーがあっても自動的に無効化される
  • テーマを変えても保存したコードは消えない

使い方はとても簡単なので、さっそく見ていきましょう。

Code Snippetsの使い方

まずは、プラグインの「新規追加」から Code Snippets を検索し、インストール・有効化します。

Code Snippetsインストール・有効化

有効化後、サイドバーに「Snippets」が表示されるので、そこから編集していきます。

Code Snippetsからコードを追加する

「All Snippets」を見るとまだ何もない状態です。「Add New」からコードを追加してみましょう。

All Snippetsからコードを追加する

今回は、先ほどちらっと載せたこちらのコードを入れてみたいと思います。

WordPress記事本文中にアドセンスを表示する方法7パターン で紹介している、アドセンスをショートコード化する記述です。

「Add New Snippets」画面で、こんなふうに書いていきます。

Code Snippetsにコードを追加する

  1. あとから見て何のコードかわかるタイトルをつけておく
  2. functions.php に追加するコードを書く(コピペする)
  3. 必要に応じて説明文を入れておく。コピペ元などを入れておくとわかりやすいかも
  4. タグをつけておくと複数のコードを管理するときに便利
  5. 通常は「everywhere」を選択しておけば OK
  6. 最後に保存して終了

説明不要なほど簡単ですね。

追加したコードを有効化する(アクティベート)

コードを保存して「All Snippets」に戻ると、このように表示されています。

Code Snippetsに追加したコード一覧

デフォルト設定のままだと、ここからさらに「Activate」をクリックしないとコードが動きません。

Code Snippets一覧からActivateする

アクティベートすると、背景が青色になってコードが有効化されます。

コードが動いている状態

コードの保存と同時に有効化したい場合は、「Settings」から「Activate by Default」にチェックを入れておきましょう。

Code Snippets設定画面

ちなみに、「All Snippets」からコードをエクスポートできるので、他の WordPress サイトでそのまま使うこともできます。いちいちコピペしなくてよいので便利ですね。

Code Snippets エクスポート機能

コードが動くかどうかテストしてみる

それでは、実際に動くかどうかテストしてみましょう。

投稿編集画面で、エディタにショートコードを入れます。

ショートコードが動くかテスト

プレビューしてみるとちゃんと表示されていますね!(テストのためダミー画像にしています)

ショートコードが反映された

Code Snippetsに入れたコードにミスがあったときの動作

冒頭で解説したとおり、functions.php に追加したコードにミスがあるとブログが真っ白になってしまいます。

では、Code Snippets を使うとどうなるか実験してみましょう。

先ほどのコードに「あ」という文字を入れてみました。このまま保存すると・・・

Code Snippets のコードで誤りがあったとき

上部に警告が表示され、どこでエラーが起きているのか教えてくれます。

Code Snippets エラー警告

なお、有効化しておいたコードを再編集しときにエラーがあると、自動的に無効化されます。

強制的に有効化することもできますが、このときもブログは真っ白にならず、ショートコードもただむき出しになるだけです。

ショートコードがむき出しの状態

エラーが出たら、原因を調べて修正しましょう。全角スペースが入っているとか、カッコやコロンが抜けているなどのイージーミスがほとんどだと思います。

いずれにしてもブログが真っ白になる可能性はかぎりなく低いので、functions.php のカスタマイズもこわくないですね!

まとめ

できれば、カスタマイズ前にきちんとバックアップをとっておき、なにかエラーがおきたら FTP で上書きする、というのを覚えておくのが一番だと思います。

 WordPress初心者でも簡単にできるバックアップ方法

でもそれで記事を書く時間がなくなったり、ブログがつまらなくなると本末転倒なので、そんなときはぜひこの Code Snippets を使ってみてください。

何を優先するかは人それぞれですが、個人的にはブログを書くだけではなく、カスタマイズする楽しみも味わっていただきたいなと思います。そのほうが愛着わきますしね。

それでは、また。