テーマカスタマイズに!FTPソフト(FileZilla)の設定方法

子テーマを使ってカスタマイズする際に、WordPress初心者が最初にぶち当たる壁がFTPによるファイル転送です。

  • FTPソフト?何それ?
  • 子テーマをに親テーマのファイルをコピー?はて。何のことやら…

FTPというのが専門用語で聞き慣れない言葉であるため、意味がわからないという気持ちはわかります。

この記事ではFTPソフトを使ったファイルのダウンロード&アップロードの方法を一例を元にご紹介したいと思います。

FTPとは何か?

まずはじめにFTPとは何なのか?

what-ftp

簡単にいうと、FTPという仕組みを利用してサーバーにファイル転送を行うものと思ってもらえれば良いと思います。

File Transfer Protocol(ファイル・トランスファー・プロトコル、FTP、ファイル転送プロトコル)は、ネットワークでファイルの転送を行うための通信プロトコルの1つである。
FTPは、インターネット初期から存在する古いプロトコルであり、セキュア(安全)なプロトコルとして設計されていない。ユーザ名やパスワードなどの認証情報を含むすべての通信内容を暗号化せずに転送するなどの問題の他、数多くのセキュリティ脆弱性が指摘されている。FTPは、Gumblarなどのコンピュータウイルスの標的にもされた。そのため、現在では、FTPではなく FTPS (SSL/TLSを使ったFTP) や SFTP (SSH File Transfer Protocol)、SCP、SSH上でのrsync、など暗号化された手法を用いることが強く推奨される。

引用元:File Transfer Protocol - Wikipedia

ちょっと脱線しますが...

通常WordPressをインストールするにはこのFTPクライアントソフトを使って行うのですが、最近のサーバーでは「簡単インストール」といった名前で、サーバーの管理画面からボタン1つでWordPressをインストールする機能があるためにFTPソフトを使う必要がないのです。

簡単インストールは便利な反面、いざカスタマイズをしようとした際に「FTPって何?」ということになってしまうのです。

FTPソフトのインストール

インターネット上には、様々な種類のFTPソフトがありますが、基本的にやっていることは同じです。

ここでは一例として、WindowsでもMacでもほぼ同じ使用感で利用できるFileZilla(ファイルジラ)というソフトを使いたいと思います。

その他のFTPソフト

ちなみに 今回紹介するFileZilla以外にも多くのFTPソフトがありますので、慣れてきたら自身の使いやすいものを見つけてみるのも良いかもしれません。
下記に他のFTPクライアントソフトも記載しておきます。

  • FFFTP(無料:Windowsのみ)
  • Cyberduck(無料:Macのみ)
  • Transmit(有料:Macのみ)

参照:初心者にもおすすめフリーのFTPクライアントソフト10選

f30a181a88a19403efe9aa301ae2c411

上記公式サイトへアクセスし、Windows用かそれ以外かで、お使いの環境に合わせたものを選んでダウンロードしてください。

 

ここではMac版のインストールを例にご紹介いたします。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-15-33

圧縮された(ZIPファイル)ファイルがダウンロードされるので、解凍ソフトを使い解凍します。

Macの場合、解凍するとアプリのアイコンが表示されるので、これをダブルクリックで開きます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-20-03

すると下記のようなウインドウが立ち上がりインストール画面が立ち上がります。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-20-37

▲「I Agree(同意する)」を押す

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-20-45

▲インストール中...

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-20-55

▲インストール完了。「Done」を押して閉じる

すると自動的にアプリが立ち上がりますので、ここから設定に進んでいきます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-24-47

インストール完了後表示されるアプリのウインドウ

このようなアプリの画面が表示されれば、ここまででアプリのインストールは完了です。
続いてFTPを接続する設定に進んでいきたいと思います。

FTP接続する設定

FTP接続には、利用中のサーバーのFTP情報が必要になります。

基本的には、サーバー契約時のメール内や、サーバーの管理画面内にて確認することができますが、使用中のレンタルサーバーによって様々です。

どこにあるかわからない場合は、契約中のサーバーに「FTP情報はどこで確認することができますか?」といった感じで問い合わせしてみてください。

ここでは一例として、エックスサーバーの内容で進めていきたいと思います。

エックスサーバーを例にFTP接続してみる

エックスサーバーのFTP情報は、契約時に送られてきたメール内か、サーバーのコントロールパネル内(FTPアカウント設定にて)で確認することが可能です。

※ちなみにコントロールパネル内ではFTPパスワードは確認できません。

契約時に送られてきたメール内に記載

契約時に送られてきたメール内に記載

最低限必要な情報として、

  • FTPホスト
  • FTPユーザー
  • FTPパスワード

を使用します。

①サイトマネージャーにてサイト情報を登録する

FTP情報を用意できたら、FileZillaを開き、画面右上にある【File > Site Manager】を開きます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-37-13

ここで自分のサイトのFTP情報などを保存しておけば、次回FTP接続する際に、再度入力する必要がないので便利。最初に登録しておくことをおすすめいたします。

②New Siteを押し新しくサイトを定義

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-14-37-26

上記画面のNew Siteをクリックし、新しいサイト(情報)としてFileZillaアプリに定義していきます。

③Hostの欄に「FTPホスト」をコピペ

c69b22d752e7fee27641c29901c971ed

サーバーのFTP情報内の、「FTPホスト」の項目をコピーし、アプリ内の「Host」の入力欄にはりつけます。

④ユーザーID、パスワードを入力

次にFTPユーザーIDとパスワードを入力していきます。

FileZillaでは、デフォルトでは接続の度にFTPユーザー名とパスワードを入力する設定になっているので、「Login Type」の欄をNormalに変更し、保存しておいた方が便利かもしれません。

bfd7a6db577c2b7ed33835745ab462d2

その後、「User」と「Password」の欄が入力可能になるので、ここにFTPユーザーとFTPパスワードの値をそれぞれコピペします。

ここまで入力したら、画面下の「Connect」というボタンを押して、保存&接続をします。

※FTPS接続

エックスサーバーの情報にて接続する場合、Connectボタンをおした後に、下記のようなウインドウが表示されます。

45d46168b7f70ef2b90c8426c5432395

これはFTPSで接続しようとしているので、セキュリティの観点から[Always trust certificate ~~~]の部分にチェックをいれて「OK」を押してください。

FTPSという言葉がなんなのかわからない場合も、ここではおまじない程度に用語だけでも覚えておくとよいかと思います。気になる方は「FTPSとは」などで調べてみてください。

⑤接続確認

すると下記画像のようにウインドウ右側にて、サーバーに接続されサーバー内のファイルを参照することができるようになります。

1ba310a22dcc0b54dbee866b39819819

接続完了

ここまででFTPソフトでのサーバー内ファイルへの接続ができるようになりました。

ちなみにWordPressのファイル構造上、よく見ることになるフォルダは下記です。

テーマフォルダを参照したい場合

(ドメイン名など)/wp-content/themes/(テーマフォルダ名)

プラグインフォルダを参照したい場合

(ドメイン名など)/wp-content/plugins/(プラグインフォルダ名)

こなれてくると、上記のフォルダ以外にも見るべき場所はでてきますが、テーマファイルの編集の場合は、この2つの場所を覚えておけば大体OKだと思います。

FileZillaの日本語化

最初に紹介しておくべきでしたが、FileZillaは環境設定から日本語に変更することができます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-03-15-47-01

Macの画面右上の【FileZilla > Settings】を選び、【Language】を選択後、【Japanese(ja_JP)】を選び「OK」ボタンを押して保存します。

これだけでは、英語表示のままですが、アプリを再起動することで、次回から日本語表示となってくれます。

74ac6497ac5c9dd10b5d3edf2b1d9482
FileZillaを再起動することで日本語にかわる

FileZillaを再起動することで日本語にかわる

(すいません。説明する前に一番最初に言っておくべきでした...)

さいごに

さて、ここまでFTPクライアントソフト(FileZilla)を使って、サーバーにアクセスする方法をご紹介いたしました。

WordPressテーマをカスタマイズしたい場合には必ずと言っていいほど使用する仕組みなので、ぜひ覚えておくと良いかと思います。

特に、「子テーマに親テーマのファイルをコピーして~~~」などと言った内容が書かれていた場合には、WordPressの管理画面内ではファイルをコピーすることができませんので、実質、子テーマをカスタマイズする際には必ずと言っていいほど使用することになります。

テーマをカスタマイズすることがなければ、FTPクライアントソフトとは無縁となれるかもしれませんが、テーマやプラグインをアップデートする際や、普段からファイルのバックアップをとっておきたい場合などには、FTPを利用すると便利ですし、理解が深まり、レベルアップすることは間違いありません。

なれれば簡単で、FileZillaではなく、別のFTPソフトを使用したい場合も入力する欄は

  • FTPホスト
  • FTPユーザー
  • FTPパスワード

の3種類である場合がほとんどなので、今回の知識の応用でなんとかなると思います。

他のソフトを使っている場合で、接続方法がわからない場合は、

「FTPソフトの名前 使い方」などでGoogle検索すれば多くの使い方記事が出てくると思いますのでそちらをご参照ください。

※ ○○というFTPクライアントソフトの使い方を教えてくださいというご質問にはお答えできません。

新作!究極のモバイルファースト
WPテーマ「ストーク」

「新しいスマホビュー時代をつくろう」というのをコンセプトに、スマホでの見やすさ、操作しやすさにとことんこだわりました。

インパクトのあるアニメーション
WPテーマ「ハミングバード」

インパクトのあるアニメーションでブログを演出します。

誰が使っても美しいデザイン
WPテーマ「アルバトロス」

シンプルかつ正統派のブログテーマです。
新ショートコード
新機能ボックスショートコードのテスト
現時点でストークテーマのみで実装。検証完了次第別テーマにも実装します。