【図解】Shopifyに自社サイトのサブドメインを設定する方法

エックスサーバー

こんな方に向けて、この記事では「現在運用しているホームページのサブドメインを使ってShopifyを設定する方法・手順」を解説します。

【注意】ドメイン会社の管理画面は触らなくてOK

基本的な流れは以下の通り。

僕はここでかなりハマりましたが、基本的に大元のドメインを取得した会社（お名前.com・バリュードメインなど）にログインして何か操作する必要はありません。

『サブドメインを外部サービスと連携させるための手続き』は、ドメイン会社ではなく、サーバー会社の管理画面から行う必要があるからです。

ここからは、実際にサブドメイン取得〜Shopifyで表示できるようになるまでの流れを解説していきます。

【実例】既存サイトのサブドメインをShopifyに設定してみる

こんな感じの条件で、実際に設定してみます。

上述していますが、Shopifyをサブドメインで運用する場合は、ドメイン会社の管理画面を触る必要はありません。

操作するのは、あくまでサーバー会社の管理画面です。

それでは、順番に解説していきます。

①利用中のサーバー会社でサブドメインを取得

まずは、エックスサーバーのサーバーパネルにログインして、画面右上の「サブドメイン設定」を選んでください。

サブドメインを設定したいドメインを選択してください。

画像①〜④の通りに情報を入力してください。②の部分がサブドメインになるので、間違えないように慎重に入力しましょう。

確認画面が表示されるので、確認して間違いがなければ「追加する」を選択してください。

※すみません、僕の入力ミスで「store」→「stores」となっていますが、各自で読み替えて頂ければと思いますm(__)m

「サブドメイン設定一覧」タブを選んでみて、画像のように「反映待ち」が表示されていればOKです。

②サーバー会社の管理画面からDNSの設定を変更

サーバー画面に戻り、「DNSレコード設定」を選んでください。

サブドメインを設定したドメインを選択してください。

画像①〜⑤の通りに情報を入力してください。⑤はこれをコピペすれば楽だと思います↓↓

確認画面が表示されるので、間違いがなければ「追加する」を選択します。

再び、画像①の「DNSレコード追加」タブを選び、②〜⑥の通りに情報を入力し、⑦の「確認画面へ進む」を選びます。⑤はこれをコピペしましょう↓↓

確認画面が表示されるので、間違いがなければ「追加する」を選択します。

お疲れ様です。「DNSレコード一覧」のタブを選んで、上の画像のように、先ほど追加した2つの項目が反映されていればOKです ^^

③Shopify管理画面で、取得したサブドメインを連携

shopifyの管理画面に移動し、画像の①〜③の順番で進めてください。

「既存のドメインを接続する」をクリックします。

①の赤枠内に、作成したサブドメインを入力して「次へ」を選択します。

赤枠の「接続を確認する」をクリックします。

接続中の画面が切り替わり、上の画像のような画面が表示されれば、完了です！

サイドバー「オンラインストア」右側の「」をクリックすれば、サイトが見れる筈です。

※真っ白な画面に「無効なURLです」と表示される場合は、数分〜1時間程度待った後にもう一度確認してみましょう。

【参考にしたサイト】