エックスサーバーでサブドメインを作る方法!同時にワードプレスのSSL化

エックスサーバーで独自ドメインのサイトにサブドメインを設定してワードプレスのサイトを作ろうと思ったのですが、初めてなので、やり方がよくわかりませんでした。

特にサブドメインを作成した後にそのサイトを完全にSSL化させる手順が、戸惑いました。

検索エンジンで検索するとたくさん有力な情報がヒットするのですが、サブドメインの作成方法とサブドメインのSSL化が分けて書いてあるサイトが多いため、今後の自分のためのメモ代わりをかねて忘れないように書いておくことにしました。

今回の記事内容

1、独自ドメインサイトにサブドメインを設定する方法(エックスサーバー環境で)

2、サブドメインを設定したサイトにワードプレスをインストールする方法

3、サブドメインサイトをSSL化する方法の最終作業~.htaccessファイルの編集

などについて書いてみました。

スポンサーリンク

エックスサーバーで独自ドメインにサブドメインを設定する

ここでまず注意しなくてはいけないことは、どのサーバーでも同じだと思うのですが、サーバーを契約したときについてきた初期ドメイン(無料のドメイン)には、サブドメインを設定することが出来ないということです。

サブドメインを設定することが出来るのは、独自ドメインだけです。

例)http://ABCD.xsrv.jp (レンタルサーバーと契約したときに貰える初期ドメイン)

上記のサイトには、サブドメインを追加できません。

独自ドメインにサブドメインを設定する手順は、以下の通りです

1、まずエックスサーバーにログインします。そしてサーバー管理をクリックします

2、サーバーパネルの画面が表示されたら、サブドメイン設定をクリックします

3、ドメイン選択画面が表示されるので、その中からサブドメインを設定したいドメイン名の選択するをクリックします。

4、サブドメイン設定画面が表示されるので、サブドメイン設定追加のタブをクリックします。

5、サブドメインに必要な箇所を入力していきます。

●サブドメイン→ 自分の好きな英数字などを半角で30文字以内で入力します。

●コメント→ 特に記入する必要はありません。

無料独自SSLを利用するにチェックを入れます。

入力が終わったら、上記の画面の確認画面へ進むをクリックします。

6、サブドメイン設定の確認画面が表示されますので、問題なければ、追加するをクリックします。

補足情報!

サブドメイン設定は追加後、サーバーに設定が反映されるまで半日程度かかる場合があるとのことです。

ちなみに私は、何度もサーバーに設定が反映されたか、確認するのが面倒なので次以降の作業を次の日に行いました。

他の方のサイトを読んでみたのですが、サーバーに設定が反映されていないと新しく作ったURLにアクセスしても「無効なURLです」「設定の反映待ちか、存在しないアドレスです。」と表示されるそうです。私は、次の日まで待ったので、実際に見たことは有りませんが。

これでサブドメインの設定が完了しました。次にワードプレスをインストールしてみます。

サブドメインにワードプレスをインストールする方法

次に先ほど作成したサブドメインにワードプレスをインストールします。

1、サーバーパネルの中のWord PressWord Press簡単インストールをクリックします。

※サーバーパネルは、サーバー管理をクリックすると(先ほどの章の手順1)表示されます。

2、ドメイン選択画面が表示されますので、先ほどサブドメインを作成したドメイン名選択するをクリックします。

3、WordPress簡単インストールの画面が表示されますのでWordPressインストールをクリックしてタブを切り替えます。

4、入力画面が表示されますので下の画面の赤枠部分をクリックして先ほど作成したサブドメインを選択します。

注意!
初期設定の画面でそのまま作業を続けていくと、サブドメインではなく、独自ドメインにワードプレスが上書きされてしまいますのでここだけは、充分注意してください!

プルダウンメニューで先ほど作成したサブドメインに切り替えます。

下の図を参照

5、間違いなく先ほど作成したサブドメインを選択したら必要事項を入力していきます。

基本的に、下の図の赤枠の部分だけの入力だけでいいと思います

6、入力がすべて終わったら右下の確認画面へ進むをクリックします

7、確認画面が出てきます。「以下の内容でWord Pressをインストールしますか?」

と表示されますので、内容に問題が無ければ、右下のインストールするをクリックします。

8、インストールが完了しましたと表示され、

●管理画面のURL

●ID、パスワード

などが表示されますので、テキストファイルなどに保存しておいたほうがいいと思います。

あと、もう少しだけで作業が完了します!

作成したサブドメインサイトのSSL化の最終作業を行う

とりあえず、独自ドメインにサブドメインを設定して、そのサブドメインにワードプレスをインストールする作業が終了しました。

しかし、実は、これでは、まだ少しだけ不充分です。

先ほど新しく作成したサブドメインのワードプレスサイトにアクセスしてみてください。

そして、上部のURLアドレス欄を見てください!

どうでしょうか?

「保護されていない通信」と表示されていると思います

先ほど、サブドメインを追加すときにSSL化を行ったはずなのになぜ?SSL化されていないの?と思ってしまうのですが、実は、最終作業を行わないと

httpとhttpsの2つのURLが同時に存在することになります。

httpsのURLでアクセスするとSSL化されたサイトが開きますが、

httpのURLでアクセスすると上記のようにSSL化されていません。

このままだと、httpのURLでもhttpsのURLでも両方でサイトが開きます。そして、httpでアクセスした場合に自動でhttpsのURLに移動してくれません。

恐らく、サブドメインを設定したということは、先に独自ドメインの設定を行われているので、説明は、不要だとは思うのですが、

.htaccessファイルの編集画面でコードを追加して、httpのURLでアクセスしてもhttpsのURLへ移動してくれるようにする必要があります。

.htaccessファイルの編集の手順!

ここからの作業は、間違えの無いように慎重に行ってください。

また、自己責任でお願いします。

1、エックスサーバーにログインします。そして、ファイル管理をクリックします。

すると以下のようなページが開きます。

2、ファイルの一覧が出てきますので、その中から先ほどサブドメインを作成した独自ドメインをクリックします。間違えないように慎重に行いましょう。

3、するとさらに一覧が表示されますので、その中のpublic_htmlをクリックします。

4、さらに内部の一覧が表示されます。今度はその中から、今回サブドメインに設定した英数字をクリックします。

くれぐも間違えないようにお願いします。

5、さらに内部のファイルの一覧が表示されます。その中の.htaccessにチェックを入れます

6、チェックを入れたら、右側にあるファイルの操作の中の編集をクリックします

7、.htaccessファイルの編集画面が開きます

.htaccessファイルはとても重要なファイルなので、不安な方は、あらかじめコピーしておいたほうがよいでしょう。

ファイルの中身を以下のように書き換えます。

赤枠の部分を先頭部分に追加します

以下のコードを先頭部分に追加します(赤枠部分のコードです)

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

8、追加したら保存するをクリックします

これで、サーバー側のリダイレクトの設定が完了です。

ワードプレス側の設定を行う

ようやく、これが最後の作業です。

今度は、ワードプレス側の設定を行います。

実は、ワードプレス側では、まだSSL化前のhttpのURLで設定されているからです。

ワードプレス側の設定の手順!

1、新しく作成したサブドメインのサイトにアクセスします。

そして、ワードプレスのダッシュボード(管理画面)開きます。

2、左側のメニューの設定にマウスカーソルを合わせて、一般をクリックします。

3、すると一般設定が表示されます。よくみるとサイトのURLアドレスがhttpのままのはずです。

それを2つともhttpsに変更します。

http→https

ここの作業も慎重に行ってください。間違えるとサイトが開かなくなる恐れがあります。

以下のような感じになります

4、変更が終わったら、忘れずに変更を保存をクリックします。

これで、サーバー側とワードプレス側の両方のSSL化の作業が完了です。

一応確認のためにhttpでアクセスしてhttpsのサイトに移動するか確認したほうがよいと思います。

以上で、今回の作業がすべて終了しました。

もちろん、その後は、ワードプレスのサイトを自分の好みに設定する作業が残っています。

それにしても、ブログを運営していると、サーバーの移転をしたり、SSL化をしたりと色々大変ですよね。

サーバーを移転したときは、なかなか理解できなくて、3日間ほどかかったことを今でもはっきり覚えています。

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする