Cocoonをより使いやすくカスタマイズするために、functions.phpを編集してみましょう。
Cocoon設定では対応できない細かな部分まで要素を追加できるのがメリット。
ただし、PHPというプログラミング言語を知らないと思わぬエラーが起こる可能性があるので注意が必要です。
Cocoonのfunctions.phpの場所
functions.phpは「テーマエディターファイル」から編集することができます。
まずはダッシュボードの「外観」>「テーマ」で子テーマの「Cocoon Child」を有効化します。
続いて「外観」>「テーマエディターファイル」を選択。右上の「編集するテーマを選択」の項目が「Cocoon Child」になっていることを必ず確認してください。
テーマの更新は親テーマ(Cocoon)の方で行われます。そのため、テーマ更新をした際に記載されていた内容が丸々上書きされてしまうのです。
例えるなら、フォルダ間でファイルを移動しようとしたとき、ファイルの名前がすでにフォルダ内に存在しているものと同名だと「上書きをしますか?」という警告がでるかと思います。やっていることはそれと同じです。
逆に、子テーマ(Cocoon Child)に変更は行われないため、更新内容が上書きされることがありません。
右側の「Theme Functions (functions.php)」を選択すれば、functions.phpを編集できます。
functions.phpの編集前にバックアップを取る
functions.phpでPHPの記述ミスがあると、サイト全体が表示されなくなるリスクがあります。
そのため、プログラミングに慣れていない人や編集に不安がある人はバックアップを取るのが重要。
ただ、バックアップを取るのにも、FTPが必要だったりと専門的なことが必要になり、それが大きなハードルになってしまうことも珍しくありません。
手っ取り早くリスク回避するには、もともと書いてあった内容をメモにコピーしておき、functions.phpの編集画面を2つ開く方法です。
もともと書いてあった内容をメモにコピーする
何かあったときのために、メモアプリにfunctions.phpの内容をコピペします。
functions.phpの編集画面を2つ開く
functions.phpで記載ミスがあった場合、基本的には警告が出てファイルが更新できないようになっています。
しかし、実は間違ったコードのまま保存ができてしまうこともめずらしくありません。実際に私も何度も経験しています。
サイトの表示に影響がある内容だと、保存された間違ったコードがそのまま処理されてしまい、最悪の場合サイトが表示されなくなることがあり得るのです。
そのため、functions.phpを編集したあとは
- 「ファイルを更新ボタン」を押し、リロードしてサイトを再表示
- サイトの表示がおかしくないことや、functions.phpの編集画面が開けることを確認する
という作業が必要になります。
そのため、確認が完了するまではfunctions.phpの編集画面は2つ開いておきましょう。
万が一、最初に開いていたページでfunctions.phpが開けなくなっても、サブのページで先ほどメモにコピーしていた内容(バックアップ)を貼り付け更新すれば、編集前の状態に戻すことができます。
functions.phpの編集方法
functions.phpを編集したい場合は、「//以下に子テーマ用の関数を書く」以下にコードを記載していきます。
試しに「不要なサイズの画像を生成させないようにする」の内容を書いてみます。
記載ミスでエラーが怒らないように、基本的にコピー&ペースのみで書いていきましょう。
画面下部にある「ファイルを更新」ボタンを押します。
成功すると「ファイルの編集に成功しました。」というメッセージが出てきます。
内容が反映されていれば、編集完了です。
functions.phpが保存できないときは?
特に記載ミスが見当たらない場合でも、「ファイルを更新」ボタンで更新できないときがあります。様々な要因が複雑に絡み合うことで起こることもあるのですが、「functions.php以外いじっていない」「参考にしたサイトのコードを真似ただけ」という場合は、目に見えない余分な文字(全角スペースなど)が入ってしまっている場合があります。
コードが正しいと思われる場合や、さっきまで正常に保存できた場合は以下の方法を試してみてください。
- 記載していた内容を全てコピーして、メモに残しておく。F5キーでページの「再読み込み」を行い、メモしていた内容を貼り付け直す
→突然更新できなくなった場合などに効果があることが多い - コピペでは無く手打ちでコードを書いた場合はその部分消す。再度、参考にしたコードを手打ちではなく「コピー&ペースト」で貼り付ける
→手打ちしてしまったがために入った不要な文字でエラーが起きた可能性がある。
どのプログラミング言語でも、リスクを避けるには「手打ちではなくコピー&ペースト」することが重要です。