Code Snippets｜functions.phpを簡単に管理できるプラグイン

WordPress は functions.php というファイルを編集して、様々な機能を追加することができます。

でもこのファイルはかなりクセモノで、編集に失敗してしまうとブログが真っ白になって管理画面にも入れなくなる、なんていうことも起こり得ます。

FTP でファイルを上書きすれば元に戻りますが、バックアップがなければ復元するのはけっこう大変ですし、FTP の扱いに慣れていなければ時間もかかるでしょう。

プラグイン「Code Snippets」を使えば、そんな苦労からも開放されるかもしれません！

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

WordPress のカスタマイズ方法を検索すると、functions.php を編集するものがたくさん出てくると思います。でも、安易にコピペしてしまうとエラーが起きるかもしれません。

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

function showads() {
    return 'ここにアドセンスのコード';
}

add_shortcode('adsense', 'showads');

function showads() {
　　return 'ここにアドセンスのコード';
}

add_shortcode('adsense', 'showads');

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

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

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

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

Code Snippetsをおすすめする理由

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

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

Code Snippetsの使い方

Code Snippets

An easy, clean and simple way to run code snippets on your site.

ja.wordpress.org

STEP1
インストール・有効化

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

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

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

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

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

function showads() {
    return 'ここにアドセンスのコード';
}

add_shortcode('adsense', 'showads');

以下の記事で紹介している、Google AdSense 広告コードをショートコード化する記述です。

WordPress記事本文中にアドセンス広告を表示する方法6パターン – Naifix

WordPressで記事内にアドセンス広告を設置する方法はいくつかありますが、moreタグ置換やショートコード作成、自動表示など6つの方法をご紹介します。自分の環境に合わせ…

naifix.com

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

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

最低限、タイトルとコードを書いておけば OK です。複雑なコードが書かれている functions.php を編集するよりはるかに簡単ですね。

STEP3
追加したコードを有効化する（アクティベート）

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

まとめ

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

WordPressバックアップ方法と最適なデータ保管方法 | Naifix

WordPressのバックアップ方法はいくつかありますが、確実に保存しておくためにおすすめの方法をご紹介します。バックアップデータの最適な保存先や回数・頻度などの基礎知…

naifix.com

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

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

それでは、また。