Hatena Blog Theme Custom

はてなブログテーマ『Minimal Green』のデモブログ。はてなブログカスタマイズや、HTML、CSSなどについて書いています。

はてなブログで設定した独自ドメインのサブドメインでWordPressを新規作成する

f:id:minimalgreen:20181224022443j:plain
はてなブログで独自ドメインを設定している場合に、追加でサブドメインのWordPressを新規作成するときの手順のまとめを書きます。

・既にはてなブログ:www.example.com として運営している(HTTPS化済み)
・追加でサブドメインsubdomain.example.comのWordPressサイトを作りたい

こういう状況です。

先に手順をまとめておきます。

手順
①レンタルサーバーにメインドメイン(www無し)を独自ドメインに追加する

②(レンタルサーバーとドメイン取得した業者が違う場合)ネームサーバーの設定

③レンタルサーバーでサブドメインを追加設定する

④(可能であれば)サブドメインに無料の独自SSLを導入する

⑤サブドメインにWordPressをインストール

レンタルサーバーにメインドメイン(www無し)を独自ドメインに追加する

ここではレンタルサーバーを既に契約しているという体で話を進めます。自分で使えるサーバーを持っていない方はエックスサーバーロリポップ!などを契約してみて下さい。
WordPressを運営するならエックスサーバーがおすすめです。


ムームードメインで独自ドメインを取得している場合はロリポップ!がおすすめです。



www無しのメインドメインにアクセスするとどうなるか?

はてなブログでwwwありの独自ドメインで運営されている方はご自分のはてなブログのURLからwwwを削除してアクセスしてみて下さい。
f:id:minimalgreen:20181224010818p:plain
下記のように別途設定をしていない限り、「このサイトにアクセスできません」と出ると思います。
www無し独自ドメイン→wwwあり独自ドメインへ301リダイレクト

はてなブログへwwwありで独自ドメインを設定しただけだと、www無しの独自ドメインはどこにも割り当てられていないのでこうなります。
まず、レンタルサーバーでwww無しの独自ドメインを登録します。

各レンタルサーバーでの独自ドメイン設定

各レンタルサーバーの公式ヘルプを参考に独自ドメインを設定して下さい。
lolipop.jp
www.xserver.ne.jp
help.sakura.ad.jp

ロリポップでは以下のように独自ドメイン設定をします。
管理画面のサーバーの管理・設定→ドメイン設定を開きます。www無しの独自ドメインのサイトをロリポップで作成します。
f:id:minimalgreen:20180909213341p:plain

f:id:minimalgreen:20180909213640p:plain
「独自ドメインをチェックする」をクリックします。
独自ドメインをムームードメインで取得している場合は「ネームサーバー認証」を行います。「ムームーID」、「ムームーパスワード」を入力し、「ネームサーバー認証」をクリックします。
f:id:minimalgreen:20180909213934p:plain
確認画面で「設定」をクリックします。
f:id:minimalgreen:20180909213951p:plain


お名前.comで取得した独自ドメインをエックスサーバーなど他社サーバーで使う場合

この手順はムームードメイン*ロリポップなど連携できる業者でドメインとレンタルサーバーを契約している場合は不要です。
独自ドメインを取得した業者とレンタルサーバーの業者が別会社である場合は別途のネームサーバーの設定が必要です。
メインドメインもサブドメイン(www以外の新規追加のサブドメイン)もエックスサーバーで使う場合は以下のおすすめ!さんの記事をご参照下さい。
osusume.bz

メインドメインはエックスサーバーに割り当てず、サブドメインのみエックスサーバーで運用したい場合は以下のcom4tisさんの記事をご参照下さい。
com4tis.net

ムームードメインで取得したドメインをエックスサーバーで使う場合

ムームードメインで取得したドメインをエックスサーバーで使う場合は以下のように
f:id:minimalgreen:20181224140920p:plain
ムームードメインのコントロールパネル>ドメイン操作>ネームサーバー設定変更で「GMOペパボ以外 のネームサーバを使用する」を選択しエックスサーバーのネームサーバー情報を入れます。
(エックスサーバーのネームサーバー情報は予めエックスサーバーのサーバーパネルで調べておきます。)

  • ns1.xserver.jp
  • ns2.xserver.jp
  • ns3.xserver.jp
  • ns4.xserver.jp
  • ns5.xserver.jp
エックスサーバーのネームサーバー情報は現時点では↑となっています。

レンタルサーバーでサブドメインを追加する

エックスサーバーやロリポップなどレンタルサーバー側でサブドメイン設定をします。
www.xserver.ne.jp
lolipop.jp

ロリポップではユーザー専用管理画面で「サブドメイン設定」へと進みます。
f:id:minimalgreen:20181224093044p:plain
「新規作成」をクリックします。
f:id:minimalgreen:20181224093135p:plain

サブドメイン:http://◯◯◯.example.comの◯◯◯となる
公開(アップロード)フォルダ:適当な名前をつける

必要事項を入力したら「作成」をクリックします。サブドメインの設定は以上です。

サブドメインにWordPressをインストールする

WordPressのインストール・設定は下記のリンクをご参照下さい。WordPressのインストールは通常のメインドメインへのWordPressインストールと同じです。
ureshi-design.com

lolipop.jp

ドメイン管理事業者側で正しくはてなブログへ向けてDNSレコードの設定がされているか確認する

https://cdn-ak.f.st-hatena.com/images/fotolife/m/minimalgreen/20180909/20180909195537.png

以上の手順でサブドメインのWordPressサイト作成は終わりですが、wwwありのメインドメインが以前と同様に正しくDNSレコードの設定がされているか一応確認してください。
問題なくwwwありのメインドメインではてなブログが表示されていればOKです。

補足・独自SSLの導入

エックスサーバー、ロリポップなどでは無料の独自SSLが導入できますので有効にしておきましょう。
独自SSLはメインドメインだけでなく、サブドメインにも個別に設定しないとサブドメインでは有効になりません。以下にロリポップでの独自SSLの導入画面を入れておきます。
f:id:minimalgreen:20181224015530p:plain
ロリポップの管理画面でセキュリティ>独自SSL証明書導入へと進み、
f:id:minimalgreen:20181224015856p:plain
追加したサブドメインにチェックを入れて「独自SSL(無料)を導入する」ボタンを押して進めて下さい。

SSL導入が完了したらWordPressの管理画面の一般設定で忘れずにWordPressアドレスとサイトアドレスをhttpsに変更して再度ログインし直しておきましょう。
https://ureshi-design.com/wp-content/uploads/2018/05/common-setting-768x403.png

またhttp→httpsへリダイレクトするようにサブドメインの公開アップロードフォルダの.htaccessへ以下の記述を追記してください。

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

注意:GoogleAdSenseの関連コンテンツユニット

メインドメインとサブドメインの両方で別々のブログを作ると、GoogleAdSenseの関連コンテンツユニットでは両方の記事が表示されます。内容的に紐付けられたくない場合はサブドメインではなく別の新規独自ドメインを取得した方が良いと思います

以上はてなブログで設定している独自ドメインのサブドメインでWordPressサイトを立ち上げる手順でした。簡易的なまとめですが、流れ的にこんな感じでできるので、WordPressのインストールなどの詳細は上記の各参照記事をご確認いただければと思います。