エックスサーバーとムームードメインでBASEの独自ドメインを設定する

エックスサーバーとムームードメインでBASEの独自ドメインを設定する

手軽に自分のネットショップを持つことができる「BASE(ベイス)」。

ハンドメイドがブームな昨今、minne(ミンネ)やSTORES(ストアーズ)と同様に人気の「グッズ販売・ショップ構築サービス」です。

登録無料で、オリジナルのハンドメイドグッズを販売して、お家にいながらお小遣いを稼げる───

10年前なら専門知識がないと到底ムリだったショッピングサイト構築が、本当に簡単にできてしまいます。

まさに、ものづくり帝国ニッポン笑

さて、BASEの登録作業は別に譲るとして、今回はちょっとテクニカルな話です。

何の話かというと、BASEで独自ドメインを設定するお話。

それも「ムームードメインで取得した独自ドメインを、既にエックスサーバーでブログやウェブサイトに使っていて、そのドメインとBASEを関連付ける方法」です。

3つのウェブサービスが絡み合うのでどこをどう設定すればいいか悩む人もいるかと思います。僕とかね。

そんなハマっちゃった人の参考になれば幸いです。

スポンサーリンク

独自ドメイン設定、その前に

本編のまえに、ちょっとだけBASEにおける独自ドメインの扱いについて。

BASEの独自ドメイン設定とは

BASEが優れている点は、独自ドメインを設定できるところではないでしょうか?

通常このようなウェブサービスは、サービス本体に紐付いたドメイン(ショップのURL)になりますよね。

例えば、「http://shopname.base.com」など。

これは自分のショップがBASEに間借りしているようなもの。

将来的にオリジナルのショップサイトを立ち上げたい!という時には、今まで使っていたショップURLを捨てることになります。

名刺や配布物なんかに印刷してたものも変えないといけないので、面倒ですよね。

それ以外にも、もっと短いURLがいい、既に独自ドメインでブログをやっているのでソレと合わせたい、など理由は様々ですが・・・

とにかく、BASEでは独自ドメインを設定できます!!

ただ、ちょっと特長があって、BASEで設定できる独自ドメイン(例:sample.com)は、

  • 「www.sample.com」・・・wwwを付ける必要がある
  • 「shop.sample.com」・・・shopなどのサブドメインを付ける必要がある

と言った縛りがあります。(shopの部分は任意の文字列です)

つまり「http://www.sample.com」は設定できるけど、「http://sample.com」は設定できないということ。

一般的に世間ではwwwの有無は意識していないと思うので、ちょっと違和感がありますね。(リダイレクトで飛ばす方法もありますが、今回はテーマがズレるので触れません)

ちなみに、サブディレクトリ(http://sample.com/sub/)も非対応です。

独自ドメインAppsの追加方法

BASEで独自ドメインを設定するには「独自ドメインApps」をインストールします。

インストールは後回しで大丈夫ですが、追加方法だけ説明。

アプリ(Apps)を追加するには、画面上部の「Apps」から「独自ドメイン」を選択。

独自ドメインAppをインストール

インストールをクリックします。

設定画面が開くので、後ほどまた説明したいと思います。

こういうアプリがモジュールになってるの、BASEだけなのかな?

新鮮で面白いし、使いやすいです。

独自ドメインの設定方法

さて、いよいよ本編です。

前述のとおり、今回説明するのはムームードメインで取得した独自ドメインを使って既にエックスサーバーでブログやウェブサイトを運営している人で、そのドメインにBASEもくっつけたい、という場合。

僕が何度もハマってしまったので、備忘録を兼ねてまとめたいと思います。

つまずいたポイントとして、紛らわしいキーワードが多いうえ、サービスをまたがって同じ設定名があること。

  • ネームーサーバー
  • DNS
  • ムームーDNS
  • サブドメイン
  • レコード
  • CNAME

難解です。

そして厄介なのが、設定が反映されるまで数時間~48時間?ほど待たなければならないこと。

つまり設定したのにそれが正しく動作してるか、時間が経たないと確認できないんです。

独自ドメイン設定の手順

すでにムームードメインとエックスサーバーは契約・運用されている状態だと思うので(そういう人を対象にした記事だからね!)、BASEのマニュアル通り、ムームードメインのカスタム設定にCNAMEレコードを追加します。

ムームーDNSを変更する

ムームードメインのコントロールパネルにログインして、ムームーDNSを変更します。

ドメイン取得は 【ムームードメイン】最安値99円!
「ムームードメイン」は、.com .net .jp .co.jpなど多種多様なドメインを取得・登録できる国内最大級のドメイン総合サービスです。取得した独自ドメインで利用できるメールサービス「ムームーメール」やレンタルサーバーもご紹介。

ムームーDNSの設定

CNAMEレコードを設定する

ちょっとスクロールして、次のような画面の箇所に、

ムームーDNSのrコードにCNAMEを設定

“cname.thebase.in” の設定をおこないます。

入力内容は、「サブドメイン」に設定したいサブドメインを、「種別」はCNAMEを、「内容」にcname.thebase.inを入力します。

最後に「セットアップ情報変更」をクリックします。

ちなみにこれをムームードメインのカスタム設定といいます。

BASEの独自ドメインAppsをインストールする

BASEに戻り、独自ドメインAppsをインストールします。

BASE (ベイス) | ネットショップを無料で簡単に作成
ネットショップ作成が30秒で。しかも無料。ネットショップをつくるのに、もう「勉強」と「お金」は必要ありません。今までECサイトを作りたくても時間・お金・技術さまざまな理由で始められなかった、そんな全ての方の悩みを解消するサービスです。

ドメイン名のところに設定したいドメイン名(サブドメインも含めたもの)を入力します。

「http://」は要らないです。

入力後、「保存する」をクリックすると・・・

CNAMEエラー

あれ?

エラーメッセージが出て保存できません。

CNAMEレコードの設定反映に時間がかかっているようです。

しかし実はこのエラーメッセージ以前に、ムームードメインでの設定が間違っている可能性があります!

次のポイントをチェックしてみてください。

カスタム設定時の落とし穴

先ほどムームードメインにて、ムームーDNSからカスタム設定でCNAMEレコードを設定したのですが、実はここで設定漏れがあります。

ネームサーバー設定変更

エックスサーバーとムームードメインを紐付けるときに、ネームサーバーを5つ入力したと思います。

僕自身ははるか昔のことなので忘れていたのですが笑

一般的なネームサーバー設定

実はこの「GMOペパボ以外のネームサーバを使用する」を当たり前のように使っていたのですが・・・

カスタム設定時のネームサーバー設定

実は今回のようにCNAMEレコードなどを使う場合は、一番上の「ムームードメインのネームサーバ(ムームーDNS)を使用する」を選ばなければいけません。

ムームードメインのネームサーバって、ロリポやカラーミーショップなどのGMOペパボグループのサービスをひとまとめにするものだと思ってました・・・

ちょっとわかりづらくありません!?僕だけ!?

エックスサーバーのネームサーバー設定はどこでする?

じゃぁエックスサーバーのネームサーバー5つはどこに入力すればよいのか?

結論から言うと『不要』です。

実はエックスサーバーとムームードメインを紐付ける方法は2つあります。

ネームサーバーを指定する方法

一つは先程の、ネームサーバー1~5を入力する方法。

一般的なネームサーバー設定

DNSレコードで設定する方法

そしてもう一つが、DNSレコードを入力する方法です。

DNSレコードを入力してエックスサーバーと紐付け

このどちらかでエックスサーバーとムームードメインを紐付けることになるのですが、BASEで独自ドメインAppsを使う以上は『CNAMEレコードの設定が必要→ムームーDNSのカスタム設定が必要』ということになります。

つまり、後者の「DNSレコードで設定する方法」で紐付けることになります。

DNSレコードに入力する内容

ではDNSレコードには何を入力すればよいのでしょうか?

先ほどの画像ではBASEの独自ドメイン設定を入力した1行目の他に、4項目が新たに追加されていました。

DNSレコードを入力してエックスサーバーと紐付け

(モザイクのところは個別の情報が入っているので隠しています)

この入力項目は、エックスサーバーのサーバーパネルから確認することが出来ます。

DNSレコードを確認する

エックスサーバーのサーバーパネルにログインし、対象となるドメインを選択します。

レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】
レンタルサーバーの【エックスサーバー】は、高速かつ高機能、稼働率99.99%以上の高い安定性で、業界トップクラスの高コストパフォーマンスを誇る、月額900円(税抜)からの高品質レンタルサーバーです。

ドメインの項目の「DNSレコード設定」を選択します。

サーバーパネルからドメインを選択

並んでいるタブから「DNSレコードの一覧」を選択します。

DNSレコード

この表示された情報が、DNSレコードとなります。(「内容」のところはモザイクをかけています)

これらを、ムームーDNSに入力しましょう。

ムームーDNSにDNSレコードを入力する

DNSレコードを入力してエックスサーバーと紐付け

ムームーDNSの設定画面に戻り、先ほどの情報を入力しましょう。

ただし、それぞれの「サブドメイン」の欄は修正が必要です。

サブドメイン 種別 内容 優先度
1 shop CNAME cname.thebase.in
2 burgburg.com A (個別のIPアドレス)
3 burgburg.com MX (指定の文字列) 50
4 www.burgburg.com A (個別のIPアドレス)
5 *.burgburg.com A (個別のIPアドレス)

上記の場合だと、『burgburg.com』を削除します。

2行目と3行目は空欄、4行目は『www』、5行目は『*』のみとなります。

「種別」や「内容」の項目は修正しません。

入力欄が足りない場合は、グレーの「入力欄を追加」をクリックします。

「優先度」は空欄にすると勝手に50が入力されます。ここではこのまま50で良いと思います。

BASEで独自ドメイン設定をする

上記の設定が終わったら、改めてBASEに戻り、独自ドメインAppsをインストールしましょう。

ドメイン名を入力すると・・・

独自ドメイン設定成功

やりました、アクセスが可能な状態になっています!!

さっそくショップを見てみましょう!

右上の緑色の「マイショップへ」をクリック!!!

設定の反映待ち

あれ?

設定の反映を待つ

ここまでいろんな設定を行ってきました。

ネームサーバーの変更やDNSレコードの追加などなど。

これらの設定変更が反映されるまで、数時間から数日間かかるそうです。

長いです。

愛しい商品たちが広大なネットの世界に羽ばたくまで、グッと我慢して待ちましょう。

ちなみに今回はネームサーバーの設定反映が数時間、レコードの設定が数十分で完了していました。

無事、設定完了!!

実際に表示してみて、それぞれのサイトが表示されれば設定完了です!!

今回の例で言うと、shop.burgburg.comでBASEのショッピングページが、

BURG BURG on the BASE
オリジナルスマホケース、スマホリングの販売。幸せが訪れるハートデザイン。

burgburg.comでソレまで使っていたウェブサイトが表示されればOKです。

創作屋台バーグバーグ
WEB戦略の総合アドバイス。Wordpressを使ったブログサポート

独自ドメインAppsの注意事項

それまでのSNSカウント数が無効に!

BASE開設後しばらく運用してから独自ドメインを設定した場合、それまで記録されていたツイート数や「いいね!」数はリセットされます。

ドメイン設定前にカウントされたFacebookのいいね数やTwitterのツイート数は、リセットされます。

外部サイトに貼ったリンクは?

商品詳細ページなどから「外部サイトに貼る」機能でリンクを埋め込んだ場合、独自ドメインを設定するとURLが変わってしまいますが、これは修正し直す必要はありません。

それまで使っていた、BASE開設時に入力したドメインから新しい独自ドメインに転送されるようになります。やったね!

まとめ

今回は3つのウェブサービスが入り混じった事案で、BASEのライブチャットサポートやエックスサーバー・ムームードメインのメールサポートには大変お世話になりました。

3社とも、すごく丁寧かつ迅速な対応をいただきました。

こう言っちゃ何だけど、悩んだら検索より問い合わせたほうが早いかも。

とにかく、今回は無事に設定が完了しました。

躓いたポイントをまとめると、

  • BASEの独自設定Appsを使うにはムームードメインにレコード設定する
  • ムームードメインで、ネームサーバーをムームーDNSに変更する
  • エックスサーバーのDNSレコード情報をムームーDNSに登録する
  • その際、丸々転記ではなく、ドメインの項目を修正する

これでも解決しなかったら、各社サポートへ!笑

なお、ネットショップを開くだけなら今回のような長ったらしい設定も必要ありません。

こんな時代だから、自分の持っているモノ作りのスキルで稼いじゃいましょう!

※当記事は当方の環境で実際に行ったものをご紹介したものです。各種設定・変更などは自己責任でお願い致します。

スポンサーリンク
スポンサーリンク
LINEスタンプ発売中です

LINEスタンプ発売中です

この記事を気に入っていただけたらTwitterやFacebookでシェアをお願いします!

更新情報をお届けします!