仕事でホームページを制作する際にphpでコードを書いてカスタマイズをすることが多いです。その場合、「子テーマのfunctions.php」にコードを書いています。コードは使い回しできることが多いので、このホームページで作った関数を、別のホームページにも、というようなときにコピーペーストをしてきました。今回ちょっとしたコードを書こうと思ったのですが「テーマを変えてもコピペしないでできたらいいな」と思って調べてみたら、「Code Snippets」というプラグインで思っていたことが実現できました。
CSS や JS はプラグインを使えば、テーマに依存せずにコードを追加できるのに…
QRコードをショートコードで表示する、というカスタマイズをしようかと思っていて検索したところ
コピペするだけ!WordPressでプラグインを使うことなくQRコードを貼り付ける方法
こちらのWEBサイトに書いてありました!この通り、functions.php に書けば動作することがわかったのですが「うーん、こういう便利機能は色々なところで使いたいし、テーマを変えるたびにfunctions.phpをコピーするのも面倒だな。。」と思ったのです。
CSS や JS なら
こちらの「Simple Custom CSS and JS」というプラグインを使えば、子テーマにしなくてもテーマを変えてもカスタマイズした内容が使えるのに、phpはなぁ~と思ったんですが、検索したら「Code Snippets」というプラグインを見つけました。
Code Snippets のインストール
「Code Snippets」 という言葉は直訳すると コードの切れ端 みたいな意味になるようで、プログラムのコードを小さな機能単位で再利用できる形に管理するもの、のようです。
インストールは、
ダッシュボード プラグイン>新規追加 をクリック
このプラグインが見つかりますので、今すぐインストールをクリック
有効化をクリック。これでインストールが終了です。
Code SnippetsにQRコードを表示するphpコードを追加する
これで使えるようになりました。
ダッシュボード Snippets > Add Newをクリック
このような画面が表示されます。
タイトルはどのようなスニペット(小さなコード)なのかがわかるようなものを付けます。
本文部分に通常は functions.php に書くようなコードを書きます。
ラジオボタンで、このコードがどこで動作するのかを選びます。
Descriptionにはこのコードに関するメモ(自分用)を書いておきます。
先ほど参考にさせていただいたQRコードを表示するコードを、
このように追加しました。
ページの下の方で、
Save Changes and Activateをクリック。これでスニペットが保存されました。
追加したスニペットがどのように動作するかを見てみる
このコードは
[qrcode]
というショートコードを書くと、表示中のページのURLをQRコードとして表示してくれるものです。先ほどスニペットを追加した後に、投稿などでこのコードを書いてみると、
このように、QRコードが表示されました。
functions.phpに書いた場合でも動作が同じですが、この「Code Snippets」というプラグインで追加した場合は、これから先が違ってきます。
違うテーマにしても、コードはそのまま使える!
例えば、今のテーマを違うもの、TwentySeventeenにしてみます。
こちらは子テーマでもないし、functions.phpにもしていませんがちゃんとQRコードが表示されました。
便利です!
違うWEBサイトに機能をエクスポート/インポートすることができる
ダッシュボード Snippets > All Snippetsをクリック すると一覧が表示されます
スニペットの下にあるExportをクリックすると、
タイトル.code-snippets.json という名前のファイルを保存します。
違うWEBサイトにも「Code Snippets」をインストールしておきます。そして、
ダッシュボード Snippets > Importをクリック
ファイル選択から、先ほどダウンロードした タイトル.code-snippets.json ファイルを指定して、
Upload files and importをクリック
これで、新しいWEBサイトにも同じスニペットが入ります。インポートしたばっかりの時には、
ダッシュボード Snippets > All Snippets を見たときに「Activate」という文字がでています。この状態はDeactivate(非活性)状態なので、Activateをクリックして、活性化します。
これで別のWEBサイトでも
このようにQRコードが表示できるようになりました。
Code Snippetsの利点はこれだけではない、コードの整合性も見てくれる
Code Snippetsの利点はこれだけではありません。phpコードは間違えて書いてしまうとWEBサイトが真っ白になってしまう、というような危険なことも起こりうるものです。少しでもエラーを減らしたいというときにこのCode Snippetsが役に立ちます。
例えば、わざとこの行末にあるセミコロンを削除して、保存しようとすると
こんな画面がでます。1行目にDon’t Panicと書いてあるので、焦ってはいけないんですが、翻訳すると
ちゃんと、間違った箇所を教えてくれます。また、保存もされていないのでブラウザの戻るボタンで戻って直せばOKです。
また、新しいスニペットを追加して、何かがおかしくなってしまったときは一覧の
Deactivateをクリックすれば、その機能だけを非活性化できるので、他のスニペットを止める必要がありません。
まとめ:もっと前に知っていたら、、functions.phpにはそれほどコードを書かなかった
このプラグインをもっと前に知っていたら、今までのようにfunctions.phpにそれほどコードを書かなかったと思います。またコードを再利用化できるので、このブログにコードを書いて、エクスポートしてこのブログにファイルを貼り付けていてもいいし、、、と思っています。
今後何度か試してみて問題がなさそうなら、このブログで書いたコードをスニペット化していき、皆さんに便利に使ってもらえるようにしたいな、と思っています。
コメント