こんにちは。Enjoy IT Life管理人の仁科(@nishina555)です。
WordPressを利用したサイトのカスタマイズは、サイトに適用しているテーマのソースコードを編集することでできます。
テーマのソースファイルはテーマファイルなどと呼ばれています。
テーマファイルは用途に応じて複数のファイルが存在しています。
その中でもよく利用されるのは『デザインをカスタマイズするときのstyle.css』『ロジックをカスタマイズするときのfunction.php』の2つです。
テーマファイルの編集はWordPressのダッシュボード（管理画面）の『外観』→『テーマエディタ』から行えます。
しかし以下のようにstyle.css、function.php以外のPHPファイルが見当たらないという状況に出くわしたことはないでしょうか？
特に『header.php』はGoogleアナリティクスやFont AwesomeをWordPressに導入する際に編集するテーマファイルなので、テーマファイル一覧に表示されないと困るケースがあります。
結論からいうと、テーマファイルにPHPファイルが見当たらない原因は利用しているテーマが子テーマで、親テーマからPHPファイルをコピーしていないからという可能性が高いです。
そこで今回は、親テーマのPHPファイルを子テーマにコピーする手順について紹介をします。
本記事では親テーマのPHPファイルを子テーマにコピーする方法として『FTPクライアントソフトを利用する方法』と『SSH接続でリモートサーバーにログインする方法』の2種類を紹介します。
- 編集したいテーマファイルがWordPressのダッシュボードで見つからない方
- WordPressサイトのカスタマイズを検討している方
- SSH接続とFTP接続の方法について理解したい方
目次
WordPressの親テーマと子テーマの関係について
親テーマとは実際に配布や販売がされているオリジナルのテーマのことをいいます。
一方、子テーマとはオリジナルのテーマのデザインや機能を引き継いだテーマのことをいいます。
テーマのカスタマイズをする場合は、オリジナルの親テーマではなく子テーマを編集するのが一般的な方法です。
子テーマでは親テーマのテーマファイルの内容が読み込まれており、子テーマ内にテーマファイル一式が存在しているわけではありません。
配布されている親テーマと子テーマの内容を確認してみると違いがわかると思います。
親テーマのテーマファイル一覧
├── 404.php
├── CHANGELOG.md
├── comments.php
├── footer.php
├── functions.php
├── header.php
├── home.php
├── index.php
├── library/
├── licence.txt
├── page-lp.php
├── page.php
├── parts_archive_big.php
├── parts_archive_card.php
├── parts_archive_simple.php
├── parts_homeheader.php
├── parts_singlefoot.php
├── parts_slider.php
├── parts_sns.php
├── related-entries.php
├── screenshot.png
├── sidebar.php
├── single-post_lp.php
├── single.php
└── style.css
子テーマのテーマファイル一覧
├── functions.php
└── style.css
親テーマのPHPファイルを子テーマにコピーする手順
カスタマイズしたいPHPファイルがWordPressのダッシュボード上で見つからない場合、対象のテーマファイルを親テーマから子テーマにコピーする必要があります。
WordPressでは『wp-content/themes』というフォルダにインストールしたテーマが配置されています。
例えば、yswallowという親テーマとyswallow_customという子テーマがインストールされたWordPressのフォルダ構成を図で表現すると以下のようになります。
』のフォルダ名です。WordPressのフォルダ構成
web
|-- index.php
|-- license.txt
|-- readme.html
|-- wp-activate.php
|-- wp-admin
|-- wp-blog-header.php
|-- wp-comments-post.php
|-- wp-config-sample.php
|-- wp-config.php
|-- wp-content
| |-- index.php
| |-- languages
| |-- plugins
| |-- themes ← テーマ用フォルダ
| | |-- index.php
| | |-- twentynineteen
| | |-- twentyseventeen
| | |-- twentysixteen
| | |-- yswallow ← インストールされた親テーマ
| | | ...
| | | ...
| | | |-- functions.php
| | | ...
| | | ...
| | | └── style.css
| | └── yswallow_custom ← インストールされた子テーマ
| |-- upgrade
| └── uploads
...
...
└── xmlrpc.php
方法1. FTPクライアントソフトを利用する方法
FTPとはFile Transfer Protocolの略で、ネットワーク上でファイルを送受信する仕組みのことをいいます。
FTPクライアントソフトとはFTPを活用してリモートサーバーのファイルを操作するソフトです。
画面上で直感的にファイルの操作ができるため、プログラミングの知識を必要としないのがFTPクライアントソフトを利用するメリットです。
一般の方であればFTPクライアントソフトを利用する方法がオススメです。
FTPクライアントソフトはたくさんあり『Cyberduck』『FileZilla』『FFFTP』などが有名です。今回はその中でも操作性の評価が高い『Cyberduck』の利用方法について紹介をします。
Cyberduckはこちらからダウンロードできます。ダウンロードされるファイルの形式はWindowsの場合はexeファイル、macOSの場合はzipファイルとなっています。
リモートサーバーにFTP接続をする
FTPクライアントソフトを利用してリモートサーバーのファイルを操作するためにはサーバーの接続情報を設定する必要があります。
FTP接続で必要な情報は以下の通りです。
- IPアドレス or ホスト名
- ユーザー名
- パスワード
- ポート番号
Cyberduckを開いて表示される左上の『新規接続』をクリックするとフォームが表示されます。『FTP-SSL（Explicit AUTH TLS）』を選択してリモートサーバーの情報を登録します。
リモートサーバーの情報はサーバーの管理画面から確認しましょう。
例えばロリポップ！
のレンタルサーバー場合は、『ユーザー設定』→『アカウント情報』と選択するとFTP接続をする際に必要なサーバー情報が表示されます。
接続が正常に完了するとリモートサーバーのファイルが一覧で表示されます。
コピー元である親テーマのPHPファイルをコピーする
wp-content → themes → yswallowとクリックしていくとheader.phpが見つかるので選択します。
Cyberduckではショートカットキーが活用できるのでファイルを選択したらショートカットキーでコピーをします。macOSの場合は『Command + C』のショートカットキーでコピーができます。
コピー先である子テーマにPHPファイルをペーストする
次にコピー先のyswallow_customのフォルダに移動をします。
フォルダをダブルクリックすることでフォルダの移動ができます。
フォルダ移動後、先ほどコピーしたファイルをペーストします。macOSの場合は『Command + V』のショートカットキーでペーストができます。
コピーが完了すると、WordPressのダッシュボード上からテーマファイルが見られるようになります。
なお、今回紹介したCyberduckのより詳細な使い方についてはFTPソフトで楽々サーバーファイル操作!Cyberduck使い方まとめで紹介していますので興味のある方はご覧になってください。
補足: ロリポップ！ならデフォルトでFTPソフトが用意されている
今回はCyberduckの接続先のリモートサーバーのサンプルとしてロリポップ！を紹介しましたが、ロリポップ！の場合『ロリポップ！FTP』と呼ばれるFTPクライアントソフトがデフォルトで利用できます。
ですので、ロリポップ！であればわざわざFTPクライアントソフトをインストールすることなくリモートサーバー上のファイル操作を画面から行えます。
方法2. SSH接続でリモートサーバーにログインする方法
SSH接続でリモートサーバーにログインすれば、FTPクライアントソフトなしで直接サーバー上のファイルを操作できます。
こちらの方法はコマンドベースの操作に慣れているプログラミング経験者などにオススメの方法です。
リモートサーバーにSSH接続する際に必要になる情報はパスワードを含め、以下の通りです。
- IPアドレス or ホスト名
- ユーザー名
- パスワード
- ポート番号
リモートサーバーの情報はサーバーの管理画面から確認しましょう。
例えばロリポップ！のレンタルサーバー場合は、『サーバーの管理・設定』→『SSH』と選択して表示される『SSHを有効にする』ボタンを押すとログイン情報が表示されます。
sshコマンドは以下のようになります。
$ ssh [ユーザー名]@[IPアドレス or ホスト名] -p [ポート番号]
→ sshコマンド実行後『xxx@xxx's password: 』と聞かれるのでパスワードを入力してEnter
ポート番号について、デフォルトの22番を利用している場合は記載を省略できます。
初回接続の場合は『Are you sure you want to continue connecting (yes/no)?』と聞かれるので『yes』と入力します。
ログイン情報が正しければリモートサーバーにログインできます。
例えばnishinaというユーザー名でIPアドレス210.xxx.xxxのリモートサーバーにポート番号2200を利用してSSH接続する場合は以下のようになります。
### ssh接続
$ ssh nishina@210.xxx.xxx -p 2200
[nishina@210.xxx.xxx]$
→ リモートサーバーにログインできた
リモートサーバーにログイン後、以下のようにしてテーマファイルをコピーします。
### テーマが配置されているフォルダへ移動する
$ cd ~/web/wp-content/themes/
### インストールされいてるテーマ一覧を確認してみる
$ ls
index.php twentynineteen yswallow yswallow_custom
→ yswallowは親テーマ
→ yswallow_customは子テーマ
### 親テーマ(yswallow)のheader.phpを子テーマ(yswallow_custom)にコピーする
cp yswallow/header.php yswallow_custom/.
## 子テーマのファイルを確認
$ cd yswallow_custom
$ ls header.php
→ header.phpが存在していればOK
なお、今回はパスワード認証を利用したSSH接続の方法について紹介しました。
SSH接続はパスワード認証の他に、公開鍵認証を利用した方法もあります。
パスワード認証および公開鍵認証それぞれのSSH接続方法については『リモートサーバーにSSH接続する設定手順まとめ』で紹介をしていますので興味のある方はご覧になってください。
まとめ: テーマファイルが見つからないときはテーマのフォルダの中身を確認してみる
今回はテーマファイルがWordPressのダッシュボード上で見つからない時の解決方法のひとつとして、親テーマのPHPファイルを子テーマにコピーする手順について紹介しました。
テーマファイルのコピーが完了するとテーマファイルがWordPressのダッシュボードでも確認できるようになるはずです。
- リモートサーバー上のファイルを操作するにはFTPクライアントソフトやSSH接続を活用する
- 親テーマのテーマファイルを子テーマにコピーすることでダッシュボードからファイルを見られるようになる
この記事がいいなと思いましたらツイッター(@nishina555)のフォローもよろしくお願いします！
