Digital Marketing Programming

Xサーバにアップロードする方法を解説しました【詳しく解説】


スポンサードリンク

パソコン,画像

 

「Xサーバにアップロードしたいんだけど、どうすればいいんだろう。具体的な手順を教えて下さい。」

 

 

こういう疑問にお答えします。

 

 

Xサーバーにアップロードする方法は

・ファイルマネージャーからアップ

・FTPソフトを使ってアップ

の2つがあります。

 

  • 複数で運営しているサイトで、それぞれが見れる範囲を指定したい
  • サイト制作後、クライアントのサーバに公開したい
  • フォルダをアップロードしたい

上記に当てはまる方は、FTPソフトを使ってアップロードしましょう。

 

  • 見れる人の範囲を指定しなくていいから、ファイルを手軽にアップロードしたい

上記のかたはファイルマネージャーからアップしましょう。

 

以上のご説明を参考に、Xサーバーにアップロードする方法を決めてください。

 

  • ファイルマネージャーからアップ
  • FTPソフトを使ってアップ

の2パターンです。

 

それでは、Xサーバにアップロードする方法を詳しく紹介していきます。

 

Xサーバーにアップロードする方法【具体的な手順で説明】

 

ファイルマネージャーからアップロード

これはブラウザからアップロードする方法です。

Xサーバのサイトにある「ファイルマネージャー」からアップロードします。

 

ファイルマネージャーのサイトです👇

xサーバーの画面,画像

FTPユーザーIDとFTPパスワードを入力するスペースがあります。

Xサーバーのアカウント設定が完了したときに下記のメールが届いていますので、チェックしてください。

gmailの画面,画像

上記のようなFTP情報が書かれているところを見てください。

これがファイルマネージャーのログインコードになっています。

 

👇ファイルマネージャーのFTPのユーザIDのところにFTPユーザー名を、FTPパスワードというところにはそのままFTPパスワードを入力してログインしてください

  • FTPのユーザID → FTPユーザー名
  • FTPパスワード → FTPパスワード

xサーバーの画面,画像

 

ログインすると上記の画面が表示されますので、あなたのサイト名をクリックしてください。

ぼくの場合は「takekawanonagare.com」です。

 

xサーバーの画面,画像

public_htmlをクリックします。

xサーバーの画面,画像

 

上記の画面になりますので、こちらからファイルをアップロードしてください。

 

公開したファイルをネット上で見たいときは、

http://(サイトのドメイン)/(ファイル名)

もしくは

https://(サイトのドメイン)/(ファイル名)

でOKです。

 

ぼくの場合は、例えば

https://takekawanonagare.com/flo.jpg

で、花の画像が表示されると思います。

 

FTPソフトを使ってアップロード

FTPソフトというものを使ってアップロードする方法です。

 

FTPとは?

《File Transfer Protocol》インターネット上でファイルを転送するためのプロトコル。

インターネット上でのファイル転送サービスを意味する場合もある。                            引用元:コトバンク

 

ようするに、サーバにファイルをアップロードできるシステムのことです。

FTPを使えば、認証コードさえ知っていれば指定のサーバにアクセスすることができます。

 

今回は「Cyberduck」というFTPソフトを使ったアップロード方法をご紹介します。

インストールしていない方は、下記からどうぞ。

Cyberduckはこちらからインストールできます。

 

xサーバーの画面,画像

Cyberduckのインストールが済んだら、Cyberduckを立ち上げて、左上の「新規接続」をクリックしてください。

上記のようなボックスが表示されると思います。

 

次に、Xサーバーのサーバーパネルにログインしてください。

  • サーバ
  • ユーザ名
  • パスワード

を調べていく作業をしていきます。

 

xサーバーの画面,画像

サーバーパネルにログインしたら、「サブFTPアカウント設定」という所をクリックしてください。

xサーバーの画面,画像

あなたのサイトのドメインを選択してください。

ぼくの場合は「takekawanonagare.com」です。

 

xサーバーの画面,画像

「FTPソフト設定」というタブに移動して、

  • FTPサーバー(ホスト)名
  • ユーザー名(アカウント名)

を確認します。

 

「パスワード」については、Xサーバーのアカウント設定が完了したときに下記のメールが届いていますので、チェックしてください。

gmailの画面,画像

 

これでCyberduckの新規接続に必要な情報が揃ったので、Cyberduckの画面に戻ります。

 

Cyberduckの画面,画像

 

👆さきほど確認した

  • FTPサーバー(ホスト)名
  • ユーザー名(アカウント名)
  • パスワード

を上から順に入力していきます。

 

Cyberduckの画面,画像

 

上のような画面が表示されるかもしれませんが、「続ける」でOKです。

 

Cyberduckの画面,画像

あなたのサイトのドメインをクリックしましょう。

 

Cyberduckの画面,画像

public_htmlをクリックします。

 

Cyberduckの画面,画像

アップロードのやりかたは、

  • 上のアップロードボタンからアップロード
  • ファイルをドラッグアンドドロップ

の2つがあります。

 

また、前の階層に戻りたいときは、画面右上の「◀」で戻れます👇

Cyberduckの画面,画像

 

公開したファイルをネット上で見たいときは、

http://(サイトのドメイン)/(ファイル名)

もしくは

https://(サイトのドメイン)/(ファイル名)

で見れます。

 

ぼくの場合は、例えば

https://takekawanonagare.com/flo.jpg

で、花の画像が表示されると思います。

 

また、公開したフォルダの中のファイルをネット上で見たいときは

http://(サイトのドメイン)/(フォルダ名)/(ファイル名)

もしくは

https://(サイトのドメイン)/(フォルダ名)/(ファイル名)

で見れます。

 

https://takekawanonagare.com/folder1/file1

といった感じです。

 

ファイルが画面に表示されない場合は見たいファイルのあるところまでフォルダをたどってみてください

 

例えば、👆のようなフォルダ内部の構造だとして、見たいファイルを見るには

 

https://(ドメイン名)/folder1/folder2/見たいファイル名

 

というURLになります。

 

「フォルダをアップロードしたのに見れない」という方は上記のようにフォルダ名でたどってみてください。

 

それぞれで見れる範囲を指定する方法

 

Xサーバーのサーバーパネル

にログインして、「サブFTPアカウントの設定」をクリックしてください👇

xサーバーの画面,画像

xサーバーの画面,画像

「サブFTPアカウント追加」のタブに移動してください。

 

上記の画像の赤で囲んだ

  • FTPユーザーID
  • パスワード
  • 接続先ディレクトリ

を任意に決めて入力してください。

FTP容量は入力しなくてOKです。

 

サーバ名、FTPユーザIDの確認方法については後でふれますが、

サブFTPアカウントの「パスワード」は後で確認するのがむずかしくなるので、忘れないようにしましょう。

 

以上のFTPの情報で認証した人は、「接続先ディレクトリ」に入力したフォルダのみを編集することができます。

 

サブFTPアカウントで認証する具体的な方法を以下で詳しく説明します👇

Cyberduck画面,画像

サブFTPアカウントで認証するときは、サーバ名と先ほど決めた

  • FTPユーザーID
  • パスワード

を上から順に入力したら、「接続先ディレクトリ」に入力したフォルダを編集することができます。

 

サーバ名、ユーザID、パスワードの確認方法

コンテンツマネージャーの「サブFTPアカウント設定」から確認できます。

xサーバーの画面,画像

サブではないほうのFTPアカウントのサーバ名、ユーザー名は上記のように「FTPソフト設定」のタブにかかれています。

パスワードは、既に説明したとおり、Xサーバーのアカウント設定が完了したときに届いたメールにかいてあります。

 

サブのほうのFTPアカウントは、サーバ名のみが書かれています。

xサーバーの画面,画像

 

 

サブのFTPアカウントのユーザー名は「サブFTPアカウント一覧」のタブにかいてあります。

 

これで、Xサーバーのアップロードは怖くない!

お疲れ様でしたm(_ _)m

Xサーバーのアップロード方法について詳しくご紹介しました。

 

この記事があなたの役に立てたらうれしいです。

 

今回はサーバーにアップロードするという、工程について解説しましたが、もう少し発展した「プログラミング」について興味のある方は、以下の記事を参照ください。

 

プログラミングができると、そのスキル自体が評価されますし、物事を解説するための論理的思考力も成長できるので、持っていて損はないです。


スポンサードリンク

-Digital Marketing, Programming

© Copyrightv2019-2022 タクミ