こんにちわ。

今回は、FileZillaの画面の見かたと、xserverとの紐づけ方法を図解付きで解説します♪

 

前回の記事でFileZillaというFTPソフトをご紹介しましたが、インストールはお済ですか?

まだの方は、こちらからインストールをしてからこの記事をお読みください。

→ https://saku01.com/2017/09/13/filezilla-inst/

 

xserverについては、こちらから記事をお読みください。

→ xserverカテゴリー

 

 

では早速、解説していきます。

 

FileZillaの画面の見かた

 

FileZilla を起動すると、このような画面が表示されます。

 

 

左側を【 ローカルサイト 】、右側を【 リモートサイト 】と呼びます。

各サイトの役割を説明しますね。

 

ローカルサイト

 

ローカルサイトは、現在使用しているパソコンのフォルダとファイルを表示しています。

エクスプローラーのように、ファイルの中身まで表示させることが可能です。

 

リモートサイト

 

リモートサイトは、接続したサーバーのファイルやフォルダを表示します。

表示させるにはサーバーの接続の設定が必要です。

今はまだ接続していないので何も表示されていません。

 

 

注意事項

 

これからサーバーの接続をしていきますが、

間違ってファイルを消してしまわないように、解説されていること以外は

絶対に触らないようにしてください!

 

では、早速紐づけしていきましょう♪

 

 

パソコンとサーバーを紐づける方法

 

パソコンとサーバーを紐づけるためには、サーバーに接続する設定をしないといけません。

 

xserver契約時に届いた

【Xserver】■重要■ サーバーアカウント設定完了のお知らせ (試用期間)
というメールを開いてください。

 

メール本文の、この赤い枠で囲っている部分の

【FTP ホスト】【FTP ユーザー】【FTP パスワード】

が、FileZilla とのサーバー接続設定に必要な情報です。

 

メール画面は開いたまま、FileZilla を表示させてください。

 

画面左上にあるアイコンをクリックします。

 

 

サイトマネージャが開きました。

 

画像の①~③の順番にクリックし、名称をわかりやすく『xserver』に変更します。

 

 

次に、右側の部分に、先ほどのメールに記載されていたFTPについての情報を下記詳細に従って入力していきます。

 

①【FTP ホスト】の情報。
②【匿名】から【通常】に変更して下さい。
③【FTP ユーザー】の情報。
④【FTP パスワード】の情報。
⑤【接続】をクリック。

 

このような画面↓が表示された場合、OK をクリックします。

 

 

リモートサイトにサーバー情報が表示されましたか?

 

これでサーバーの接続は完了し、パソコンとサーバーが紐づけられました。

 

紐づけ後の FileZillaについて

 

パソコンとサーバーが紐づけられると、FileZillaはこのような表示になっていると思います。

 

 

ここでは、リモートサイトにあるブログのドメインをクリックして、下にスクロールした所にある public_html をクリックして下さい。

 

 

こんな感じに、リモートサイト:/ブログのドメイン/public_htmlという表記になっていれば OKです。

 

この画面下に表示されているのが、public_html内のサーバーの設定情報やファイル情報です。

※くれぐれも、public_html 内に既にあるファイル情報は、絶対に消したりしないで下さい。

 

xserverにファイルをアップしたい時には、この public_html 内にアップロードしていく事になります。

アップロード方法は、ドラッグアンドドロップでOKです。

イメージとしては、右枠から左枠へ。といった感じですね。

 

 

次回からの接続は簡単♪

 

セキュリティ上、FileZillaは起動のたびにサーバー接続が必要になります。

が、

次回からは画面上部の【サーバー(S)】内にある【再接続】をクリックする事で、一発で、簡単に接続が出来ます。

 

 

また、このような画面が表示されますが、毎回OKをクリックしてください。

 

 

 

これでFileZillaでのパソコンとサーバーの紐づけが完了したので、試しに画像ファイルをアップしてみてください♪

※ファイル名は半角英数字に設定してください。

 

手順は・・・

サーバーの接続

ローカルサイト上にある画像ファイルをリモートサイト(public_html内)へ、ドラッグアンドドロップ

http://アップしたサイトドメイン/ファイル名でブラウザ検索

 

これで、あなたがアップした画像が表示されるはずです。

 

 

是非活用してみてくださいね♪

ここまでの作業、お疲れさまでした(^^♪