支援対象地域:札幌、仙台、関東、愛知、関西、広島、福岡

  • TOP
  •   
  • コラム
  •   
  • WordPressのテーマ編集に必要

はじめに

WordPressはCMSの一つです。CMSは「Contents Management System」の略で、HTMLやCSS等の知識がなくても、管理画面上の機能を利用して画像やテキストを入力していくことでサイトの作成が可能なツールです。CMSには他にもEC-CUBEやMovable Type、OpenPNEと様々ありますが、当初はブログサイトを作成する際に利用されることの多かったWordPressがある時期からホームページ作成にも多く利用されるようになり、2022年時点でも特に人気の高いCMSとなっています。

人気となった理由にはWordPress用のプラグインやテーマの充実といったことが挙げられます。プラグインとは、例えばセキュリティ設定やバックアップ、問合せフォーム等、サイトの作成や管理で利用したい機能を完成した状態で容易に導入できるものです。対してテーマは、サイトの大枠のデザインを構成してくれるテンプレートです。プラグイン、テーマ共に有料のものもありますが、無料でもたくさんの種類を利用できるようになっています。WordPressでこれらを利用することで、誰でも無料で簡単にデザイン性が高く、質の高いサイト作成ができるようになりました。

なおWordPressを利用することで初心者でもある程度様になるサイトの作成が可能ではあるものの、どうしても既存のプラグインやテーマだけでは痒いところに手が届かないことがあります。そういった場合は希望する機能を実装するにあたりPHP言語のプログラミング知識が必要となってくるため、場合によってはWordPressでのホームページ作成を専門業者に依頼します。今回紹介する「functions.php」は、このようにWordPressの管理画面であるダッシュボード内の既存メニューや、テーマ、プラグインで元々可能な設定や表示設定以外でカスタマイズをしたい場合に編集することになるファイルの一つで、「functions.php」は特にテーマに関係する変更が可能です。今回はこの「functions.php」の役割や活用方法、編集方法について紹介していきます。WordPressを利用したことのあるものの「functions.php」の存在を知らなかった方、もっと自由にカスタマイズしたいという方、業務上WordPressを管理しているものの「functions.php」をどう編集して良いかわからないという方はぜひご覧ください。

WordPressのデータについて

FTP接続が可能なサーバーにWordPressをインストールした場合は、WordPressのデータを確認することができます。サーバー内を見ると「wp-admin」「ap-content」「wp-includes」というフォルダやindex.phpや.htaccess等のファイルが確認できることでしょう(.htaccessはない場合もあります)。WordPressで作成したサイトを表示させるのに必要なデータは全てこれらの中に含まれます。なお特に設定を変更をしない限り、プラグインをインストールした場合は「wp-content/plugins」に、テーマをインストールした場合は「wp-content/themes」にそのデータが設置されます。またトップページを表示させるためのファイルはindex.php、ページのリダイレクトや制御を行うファイルが.htaccessとなっています。さらにURLの設定やデータベースの接続情報等が記述されているwp-config.phpもあり、WordPressの重要ファイルの一つとなっています。functions.phpはテーマごとに存在し、「wp-content/themes/テーマ名」内に存在するファイルとなっています。

functions.phpの役割とは?

functions.phpは適用しているテーマに対して機能を追加していく場合に編集するファイルで、プラグインと似たような働きをします。プラグインをインストールすると必要以上の機能も一度に取り込んでしまうため、たくさんインストールし過ぎるとWordPress自体が重くなってしまうことがあります。それを避けるためにfunctions.phpを使って、必要最低限の機能だけ記述していくという使い方をします。

具体的にはサイトの表示に関するショートコードの定義、何度も繰り返し行いたい処理の定義、コメント欄の文言や入力欄のカスタマイズ、管理画面や記事投稿画面の見た目、機能追加・削除といったカスタマイズ、権限ごとに振り分けたい操作のカスタマイズ等を行うための記述をします。なおショートコードとは、毎回記述すると長文になってしまうようなプログラムを「[ ]」で定義した名称と結びつけてあらかじめ定義しておくことで、今後は定義した名称を記述するだけで、その名称に結び付けられたプログラムが実行可能となる仕組みです。例えば「ホーム>カテゴリー>特集」のようにページのルートを表示させるパンくずナビゲーションは記述が長くなるため、この機能をfunctions.php内で[bread]というショートコード名に結び付けて、各ページではその後[bread]とだけ記述して汎用的に利用するといった使い方ができます。

functions.phpで追記されることの多い設定

WordPressの運用していく中で実際にfunctions.phpに記述されることの多いものを5つ紹介します。一つ目は指定したページを検索エンジンの登録から除外(noindex)する記述です。質の低いページがサイト内にあると検索結果の順位に影響があると言われているためALL in One SEO Pack等のプラグインで除外の設定ができますが、functions.phpへの記述でも同じことが可能となります。特定のページや固定ページ、カテゴリー、投稿者等様々な指定が可能です。

二つ目はウィジェットの表示を旧式に戻す記述です。最近WordPressを使い始めた方は記事作成時の画面が文章や画像等を入れ込む部分をブロックとして作成していくブロックエディタに違和感がないかもしれませんが、以前よりWordPressを使っていた方の中にはこのエディタ方式が使いづらいということもあるのではないでしょうか。その中のウィジェットはさらに独特であるため、ウィジェットを旧式に戻したい場合に以下のような記述を行います。

function example_theme_support() {
remove_theme_support( 'widgets-block-editor' );
}
add_action( 'after_setup_theme', 'example_theme_support' );

三つ目は画像の画質劣化を防ぐための記述です。WordPressは画像をアップロードする時に任意のサイズにリサイズができますが、この際に自動で圧縮がかかり、JPEGの画像であると画質が劣化することがあります。画像によっては目立たないものもありますが、デザイン性に凝っていたり、綺麗な色味や光沢をアピールしたい場合は致命的となる可能性があります。そういった場合に以下の記述をすることで劣化を防げます。

add_filter('jpeg_quality', function($arg){return 100;});

四つ目はリキャプチャを表示させるページを一部にする記述です。リキャプチャは、ログイン等を行う際に表示された画像の中から指定された部分だけを選択したり、画面に表示された文字を入力して不正なログインでないことをチェックする仕組みですが、これがページ遷移するたびに表示されてはユーザビリティを損なうことになるだけではなく、サイトの速度にも影響が出てきます。そのためリキャプチャを必要とするのはログインが必要になるページのみというように指定します。

最後に紹介するのはレスポンシブデザインの条件分岐を変更する記述です。レスポンシブデザインとは、スマートフォンやタブレット、パソコン等、アクセスする端末によって画面サイズやレイアウトを最適な状態に変換して表示する仕組みで、WordPressにも対応したテーマが多く存在します。しかし良くある問題として、タブレットはスマートフォンより画面サイズが大きいにもかかわらずスマートフォンと認識されてしまい、表示崩れが発生することがあります。タブレットをパソコンと同等と認識されるように自分で条件分岐をfunctions.phpに書き込んでおき、判別してほしいページに条件分岐の結果表示させる内容を記述しておくことでこれを解決できます。

覚えておくべきfunctions.phpの特徴と編集する際の注意点

functions.phpの特徴と注意点を抑えておくことでスムーズに利用できるようになるため、まとめて紹介します。functions.phpはテーマのディレクトリに含まれていることからわかるように、ダッシュボード内でその時指定しているテーマデータ内に設置してあるfunctions.phpのみ有効です。またテーマのテンプレートより先に読み込まれるため、指定しているテーマの初期化ができます。さらに親テーマ、子テーマが存在しているテーマの場合は、一般的に子テーマのfunctions.phpを編集します。理由としては親テーマはテーマのアップデートをした際に上書きされてfunctions.phpに書き込んでいたプログラムが削除されてしまう可能性があるからです。無料で様々なデザインを利用できる人気のテーマ「Cocoon」や有料の「AFFINGER」等には子テーマがあります。

なおfunctions.phpへの記述はPHPのルールに沿って行っていきますが、一部異なる部分があります。通常PHPでは「」で閉じますが、functions.phpでは最後の「?>」は省略することが推奨されています

次は注意点ですが、functions.phpはコーディングする中で出力させるような記述してはいけません。例えばfunctions.phpを使って「Hello」という表示をさせたいのであれば、表示させる「echo( )」等の関数自体はテンプレートの方に記述します。これはテーマを読み込む前にfunctions.phpが読み込まれて実行されるためです。

二つ目の注意点として、functions.phpは必ず元のファイルのバックアップを取得してから編集するべきということが良く言われます。functions.phpは記述に誤りがあるとサイトやダッシュボードが真っ白になってしまうことがあり、最悪の場合はWordPress自体の再作成が必要となってしまうためです。バックアップを取っておけばもしそういった状態になっても編集前のファイルに戻すことで復旧可能となります。なお今でもバックアップを取得しておくに越したことはないですが、WordPress Ver.4.9からは自動ロールバック機能が備わっているため、誤って編集してしまった場合も簡単に切り戻しが可能となっています。

バックアップの取得としては、何らかのテキストエディタに編集前の記述内容を全てコピーして貼り付けし、保存しておくという方法があります。なおWindowsのメモ帳はUTF-8という文字コードでの保存ができず記述を戻す際に正常に認識されない恐れがあるため、UTF-8での保存が可能なサクラエディタ、TeraPad、秀丸エディタといったエディタで保存することをおすすめします。FTPでサーバーに接続して直接functions.phpが確認できる場合は、サーバー内から編集前のfunctions.phpをパソコンへダウンロードしておくだけでも問題ありません。

functions.phpを編集する方法

functions.phpを編集したいとなった場合いくつかの方法がありますが、今回は3つの方法を紹介します。一つはWordPressの管理画面であるダッシュボード内からfunctions.phpのファイルを開く方法です。ダッシュボード左側メニューに「外観」というメニューがあり、この中の「テーマの編集」をクリックすると右側にテーマファイルとして「テーマのための関数(functions.php)」が表示されるためこれをクリックします。そうすると真ん中の「選択したファイルの内容」欄にfunctions.phpの内容が表示されます。この時点で内容をコピーしてエディタに保存しバックアップを取ったら、編集を始めていきましょう。なおコードは、わかりやすいように表示される内容の末尾に追記していくことをおすすめします。

二つ目は専用のプラグイン「Code Snippets」を利用する方法です。プラグインを入れ過ぎると速度が遅くなってしまうのではと懸念されることもあるかと思いますが、Code Snippetsならではのメリットもあります。記述内容にエラーがないかチェックができる点と、テーマがアップデートされる際も変更内容を維持できる点です。PHPでのプログラミングに慣れておらず編集が不安という方は利用を検討してみても良いのではないでしょうか。

三つ目はFTPソフトを利用する方法です。FFFTPやFileZilla、Cyberduckといった無料で利用可能なFTPソフトをパソコン内にダウンロードし、接続情報を入力してサーバーに接続します。接続後は利用しているサーバーのルートディレクトリから前述したディレクトリ「wp-content/themes/テーマ名」にアクセスしてfunctions.phpをダウンロードして編集し、編集が完了したらサーバーにアップロードするという流れです。なおレンタル型のサーバーサービスを利用している場合は、FTP、FTPS、SFTPいずれかの接続方法が提供されている可能性が高いので、仕様や設定方法を確認の上で接続してみましょう。 また接続方法によっては利用できないFTPソフトもあるので、各接続方法に対応したFTPソフトを利用してください。

同じくレンタル型のサーバーサービスを利用していると、FTPソフトでの接続以外にWeb画面上から簡単に接続できる独自のツールが用意されている場合があります。このツールを利用してFTPソフトのようにfunctions.phpをダウンロード、編集、アップロードをすることも可能です。会社によってWeb画面上で編集可能、ダウンロード・アップロードの容量等の仕様があるので、仕様に従って利用しましょう。なおcPanelというサーバー管理用インターフェースのソフトウェアがありますが、サーバーサービスによってはこれを採用しているところも多いです。cPanelが採用されている場合は該当するツールとして「ファイルマネージャー」が利用できます。

まとめ

WordPressは無料で提供されているプラグインやテーマをインストールしてそのまま利用するだけでも、企業サイトとして十分なホームページを作成することが可能です。しかしそれだけだとどうしてもWebデザイナーやフロントエンジニアが作成するような、デザインが秀逸でユーザビリティのあるサイトとは差が出てきてしまいます。そのためより近づけるためには今回紹介したfunctions.phpのようなファイルを編集してサイトを作り上げていく必要があります。なおWordPressは人気のCMSなので、functions.phpで設定されることの多い記述については大抵インターネット上に情報があり、そのままコピペするだけで利用可能なことが多いです。それでもプログラミング言語の知識がないと微妙に異なる部分の編集をしたい場合や、どこにも載っていないような機能の追加を行いたい場合は、PHP言語に関する知識が必要です。そのため業務上WordPressを利用するのであれば、少しずつでもPHPの知識を習得していくことをおすすめします。