Web制作の勉強を始めて、友人や親族にホームページ制作を依頼され何とかhtmlでホームページを作ってWordPressのテーマ化までしたけど、サーバーへのアップロードの方法がわからない！
という、初めてホームページを作る方や過去の自分に向けて WordPressテーマをConoHa WINGのFTPサーバーにアップロードするまでの手順 を説明していきたいと思います。
なんでConoHa WINGなのか？については下記の記事を参考にしていただければと思います。
はじめに
まずはじめに、WordPressテーマをConoHa WINGのFTPサーバーにアップロードするまでには
- ConoHa WINGでFTPアカウントを作成する
- FTPソフト(FFFTP)をインストールする
- FTPソフトを使ってConoHa WINGのFTPサーバー上のWordPressのthemesフォルダにWordPressテーマをアップロードする
という工程があります。「ConoHa WINGでFTPアカウントを作成する」 と 「FTPソフトをインストールする」はどちらが先でも構いません。それぞれ細かくやることがあるので一つずつ説明していきます。
FTPサーバーってなに？
そもそもFTPサーバーってなに？私も名前は知っていましたがいまいちわかっていなかったので調べてみました。
FTPサーバーの「FTP」とは、サーバーにファイルをアップロードしたりする際の通信のルールのことです。ホームページを閲覧する際にはhttpやhttpsといった通信ルールが使われています。
FTPはインターネットを利用してファイルの送受信を行うために用いられ、httpはWebサーバーとWebブラウザ間でHTMLなどのファイルのやり取りを行っています。
つまり、FTPサーバーとはFTPという通信ルールを使ってファイルのやり取りをする為のサーバーということです。
ConoHa WINGのFTPアカウントを作成する
FTPアカウントの作成
まず初めにConoHa WINGのFTPアカウントを作成します。
ConoHa WINGにログインし、サイト管理画面を表示します。
それでは、下記の図を使って説明していきます。
- サイト管理メニューの FTP をクリックします。すると、FTPアカウント画面が開きます。
- +FTPアカウント をクリックします。
- 入力フォームが表示されます。
- 入力枠の案内に従い 任意のユーザー名とパスワードを入力します。（接続許可ディレクトリはそのままでもいいです。）
- 入力が完了したら 保存 をクリックします。
これで、FTPアカウントの作成は完了です。
FTPアカウントの確認
それでは確認してみましょう。先ほどの作業が完了し、無事にFTPアカウントが作成されていると、下記のような画面が現れます。
先ほど作成したFTPアカウントのユーザーが表示されるので クリックします。
すると、ユーザー名、パスワード、FTPサーバーの情報が表示されます。これらが表示されていれば準備OKです。後ほど必要になるので確認方法は覚えておきましょう。
FTPソフト(FFFTP)をインストール
FFFTPって何？
FFFTPとは、数あるFTPソフトの中でも代表的なソフトで 無料で公開されている国産のソフトになります。
ほかにもFTPソフトはたくさんありますが、FFFTPはユーザーが多いので、使い方やエラーなど、困ったときに調べれば すぐに解決方法が見つかります。
また、操作画面も見やすく、ドラッグ＆ドロップでファイルを移動できたりするので、FFFTPはおススメです。
FFFTPをダウンロードする
それでは、早速FFFTPをダウンロードしていきましょう。
窓の杜のダウンロードページ「https://forest.watch.impress.co.jp/library/software/ffftp/」からダウンロードしましょう。
窓の杜のダウンロードページに遷移すると、【FFFTP(32bit版)】と【 FFFTP(64bit版)】の２つあるので、ご使用のOSにあったバージョンを選択して緑色のボタンよりダウンロードしてください。
OSの種類がわからない場合はWindowsアイコンを右クリックしてシステムを選択すると表示されます。【私のPC（win11)の場合】
私の場合は64bit版をダウンロードしました。
ダウンロードをクリックすると画面の左下に下記の表示が現れます。
この記事を書いているのは2023年６月なのでFFFTPのバージョンは「v5.7」となっています。
FFFTPをインストールする
先ほどの表示をクリックすると下記のセットアップ画面が表示されますので、指示に従い【次へ】をクリックします。
インストール先フォルダーが表示されるので確認して【次へ】をクリックします。
ffftpのインストール準備完了と表示されるので【インストール】をクリックします。
もし【この不明な発行元からのアプリがデバイスに変更を加えることを許可しますか？】と出てきた場合は確認して【はい】をクリックします。
【するとffftpセットアップウィザードが完了しました】と表示されるので【完了】をクリックします。
ここまで終わると、デスクトップ上にFFFTPのショートカットアイコンが現れます。
これでFFFTPのインストールは完了です。
WordPressテーマをアップロード
それではいよいよWordPressテーマをConoHa WINGのサーバーにアップロードしていきたいと思います。
まずアップロードの前にFFFTPの接続設定を行います。
FFFTPの接続設定
先ほどインストールしたFFFTPのショートカットアイコンをダブルクリックします。
すると下記の画面が現れます。
次に新規ホストをクリックします。
ホストの設定画面が現れるので、ConoHa WINGのFTPアカウントを作成したときのFTP情報を入力します。確認の仕方は【FTPアカウントの確認】をご確認ください。
- ホストの設定名 には任意の名前を入力します。（今回はblogとしました。）
- ホスト名 にはConoHa WINGのFTPアカウントで作成したFTPサーバーを入力します。
- ユーザー名 にはConoHa WINGのFTPアカウントで作成したユーザー名を入力します。
- パスワード/パスフレーズ にはConoHa WINGのFTPアカウントで作成したパスワードを入力します。
すべての入力が終わったらOKをクリックします。
すると、暗号化の状態の保存という表示が現れるので【はい】をクリックします。
するとConoHa WINGのFTPサーバーに接続され、下記の画面になります。
これでConoHa WINGにWordPressテーマをアップロードする準備が整いました。
これでFFFTPの画面を消してしまっても、再度立ち上げればホスト一覧に先ほど登録したホスト名が表示されます。
これでFFFTPの設定は完了です。
WordPressテーマのアップロード
最後にWordPressテーマをConoHa WINGのFTPサーバーにアップロードしていきます。
WordPressのテーマはConoHa WINGのサーバー内のpublic_html/ドメイン名フォルダ/wp-content/themesの中にアップロードします。
FFFTPの右側の枠に表示されているpuburic_htmlをクリックします。
public_htmlをクリックするとpublic_html内のフォルダが表示されるので
ドメイン名フォルダ→wp-content→themesの順にクリックしていき、themesフォルダの中に自作のテーマをアップロードします。
試しに【ftptest】というテーマをアップロードしてみました。
WordPressを開いて確認してみます。
WordPressの管理画面を開いて【外観】→【テーマ】をクリックするとテーマの一覧が現れます。
無事にftptestのテーマが反映されていました。これでConoHa WINGのFTPサーバーにWordPressのテーマをアップロードする作業は完了です！お疲れさまでした。
最後に
テーマにするフォルダの不具合などがなければ無事に反映されると思います。私が実際にWordPressのテーマをアップロードした際はindex.phpがないためにエラーでテーマが反映しませんでした。
flont-page.phpをindex.phpに変更したら反映されました。※初めてのテーマ制作だったので階層構造をちゃんと理解していませんでした。
今回、説明した内容は私が実際にやってみたやり方なので正しいかはわかりません。こんなやり方が正しいよ や ここが間違ってるよ等ありましたら、お問い合わせよりご連絡いただけますと幸いです。
