中級者向け

【危険】テーマファイル(ソース)の編集はローカルファイルで行なう!

文中の説明画像をクリックすると拡大します。

LINEで送る
Pocket

この記事は約7分で読めます。

WordPressのテーマをどうやって編集していますか?

WordPressのカスタマイズに挑もうとすると、やはりテーマファイル(テンプレートファイル)の編集という作業は避けられません。

いじる可能性が高いファイルは、style.cssでしょうか、header.phpやfooter.php、あるいはpage.phpでしょうか、機能を登録するfunctions.phpでしょうか。

ソースをいじるのが苦手な人も慣れた人も、作業効率アップのためにプラグインを利用することは多いと思います。しかしそれでも、結局は「テーマファイルの編集をする場面」は必ずやって来るはずです。

さてそのさいに、みなさんはどうやってテーマファイルを編集しているでしょうか?

管理画面(ダッシュボード)で直接編集することの危険性

一番簡単な例としては、WordPressの管理画面(ダッシュボード)、左メニューの「外観」→「テーマの編集」でテーマファイルの編集する方法でしょうか。

ここから編集すれば、ログインさえできれば、どのパソコンからアクセスしても編集して即サイトに反映することができるので、手っ取り早いという意味では便利です。

しかし同時に、この方法は大変危険です。

ここで編集して「ファイルを更新」してしまうと、元に戻らないからです。

もしも記述をミスして画面が真白になってしまったら、FTPでアクセスしてそのファイルをダウンロードし、編集し直さなければなりません。間違いがすぐに見つかればいいですが、間違えた原因・対処法がわからない場合には途方に暮れてしまうことでしょう。

それが公開中のサイトだったら、直るまでサイトを閲覧することができなくなるかもしれません。

オフライン編集するメリット

おすすめの方法は、ローカル環境(パソコン内)での編集(オフライン編集)です。

この方法は、管理画面(ダッシュボード)での編集と違って、テキストエディタとFTPソフトが必要です。
流れは以下のとおりでです。

  1. サーバーにあるテーマファイルをFTPソフトでダウンロードする。
  2. パソコン上で、テキストエディタでそのファイルを編集する。
  3. 編集したファイルをFTPソフトでサーバーにアップロードする。
  4. 確認し、問題がなければOK。問題があれば、パソコン上のファイルを元に戻すか問題点を修正して、再度アップロードする。

つまり、オフライン編集する大きなメリットは、以下のとおりです。

  1. ファイルのバックアップがとれること
  2. やり直しがきくこと

さらに、WordPressの管理画面では、編集領域に制限があり、ファイルの下の方のソースをいじるときにはスクロールダウンして、上の方をいじるときにはまたスクロールアップするなど、スムースな操作とはいえません。

その点オフライン編集では、テキストエディタを大きく開けば、その領域内をフルに使うことができます。管理画面よりもスムースに作業ができるということです。

そのうえ、コードのカラーリング表示や、検索・置換えなど、テキストエディタの機能を利用できるのも、効率的です。

そしてなんといってもオフライン編集では、undo(アンドゥ)が使えることが安心です。

アンドゥとは、行なった操作を取消して(ひとつ前、または複数回前)の状態に戻すことです。管理画面では、いったん「ファイルを更新」してしまうと、このアンドゥはできません。

FTPとは何かについては、こちらをご覧ください。

【基本】FTPって何のこと?

画面が真白になってしまった時の対処法は、こちらをご覧ください。

【恐怖】WordPressで画面が真白になった!どうすればいい?

オフライン編集の注意点

オフライン編集の注意点としては、例えば以下のことです。

  1. ローカルファイル(パソコン上のファイル)がサーバー上のファイルと一致しなくなる
  2. ローカルファイルが複数のパソコン上で一致しなくなる

まず1.のローカルファイル(パソコン上のファイル)がサーバー上のファイルと一致しなくなるですが、例えばローカルファイルを編集したのにアップロードしなかった、アップロードし忘れた、などの場合です。

ローカルとサーバーの不一致に気づいたら、ローカルファイルをいったん別ファイル名で保存してから、サーバー上のファイルをダウンロードしてローカルファイルに上書きし、それを編集すべきです(こういう場合には、サーバー上のファイルを正として両者を合わせた方がよいはずです)。

その後、ローカルファイルで編集したのに上書きで消えてしまった箇所があれば、別ファイル名で保存した中からコピーして編集すればOKです。

2.のローカルファイルが複数のパソコン上で一致しなくなるというのは、よくありそうなパターンですね。複数の人が作業する場合、あるいは作業者が一人でも複数のパソコンを使う場合に、起こりがちです。

このような場合には、まず常に各パソコン(デバイス)間で同期しておくことです。

そして、ローカルファイル同士を、iCloudやドロップボックス、Googleドライブなどの、WordPressとは別のサービスを介して同期しておくのもよいと思います(各パソコンで同じサービスの同じアカウントを利用するという前提ですが)。

例えば、パソコンA、パソコンB、モバイルA、等に同じファイルを置いている場合、いずれの機種も同じアカウントのiCloud上のファイルと同期していれば、結果的に各パソコン(デバイス)間でも同期されていることになります。

テキストエディタの例

様々なテキストエディタがあり、無料のもの・有料のもの、シンプルなもの・多機能のもの、実に様々です。ここでは、3つの無料テキストエディタを紹介しておきます。

Visual Studio Code(Win/Mac/LINUX対応)/無料

Visual Studio Codeは、マイクロソフトで開発されたソースコードエディタで、Windows、Mac、Linux上でも動作する優れものです。ライティングはもちろん、エンジニアがコーディングするときの機能が充実しています。

見やすいコードカラーリング機能があり、ソースコードを視覚的に区別できるシンタックスハイライト機能があります。

ダウンロード時は英語ですが、後は日本語に対応していて、初級者でも安心して使えます。ダウンロードはこちらです

TeraPad(テラパッド)(Windows対応)/無料

テキストエディタには海外のものと国産のものがありますが、TeraPad(テラパッド)は国産のもので、編集画面の表示も全て日本語です。

シンプルながら多少のコードカラーリングが可能で、テキストエディタを初めて使う人にはおすすめです。行番号が表示可能で、undo(アンドゥ・元に戻す機能)が64回までできます。ダウンロードはこちらです。

CotEditor(Mac対応)/無料

Mac用のテキストエディタで、国産のものです。メニューも日本語で初級者に使いやすいテキストエディタです。

カーソル位置での文字数・行数の確認ができ、カラーリング機能などで視認性が良く、ショートカットキーの役割をする「キーバインド」という機能があり、個々の習慣に合わせたショートカットキーを設定できます。

HTML、PHP、Javascript、CSS他、様々な言語に対応していて、Web制作でもよく使われているようです。ダウンロードはこちらです

 

まとめ

  • WordPressは、管理画面(ダッシュボード)の「テーマの編集」でテーマファイルの編集することができる。
  • しかし、管理画面で更新すると元に戻らないという大きな危険がある。
  • テーマを編集するのならば、ローカル環境(PC上)にファイルをダウンロードしてテキストエディタで編集し、それをアップロードすべき。
  • ローカルファイルで編集すればやり直しが聞くし、バックアップもとれる。
LINEで送る
Pocket