こんな方に向けて、この記事では「現在運用しているホームページのサブドメインを使ってShopifyを設定する方法・手順」を解説します。
目次
【注意】ドメイン会社の管理画面は触らなくてOK
基本的な流れは以下の通り。
- 利用中のサーバー会社でサブドメインを取得
- ↑ のサーバー会社の管理画面からDNS設定を変更
- Shopifyの管理画面にて、取得したサブドメインを連携
僕はここでかなりハマりましたが、基本的に大元のドメインを取得した会社(お名前.com・バリュードメインなど)にログインして何か操作する必要はありません。
『サブドメインを外部サービスと連携させるための手続き』は、ドメイン会社ではなく、サーバー会社の管理画面から行う必要があるからです。
【参考】ややこしいのですが、大元のドメインと外部サービスを連携させる場合は、ドメイン会社の管理画面から操作する必要があります。『サブドメインはサーバー会社で取得したもの』だと思えば、分かりやすいかと。
ここからは、実際にサブドメイン取得〜Shopifyで表示できるようになるまでの流れを解説していきます。
【実例】既存サイトのサブドメインをShopifyに設定してみる
こんな感じの条件で、実際に設定してみます。
ドメイン会社 | お名前.com |
---|---|
レンタルサーバー | エックスサーバー |
現在のドメイン | pegaro.site(WordPressで運用中) |
サブドメイン | store.pegaro.site |
上述していますが、Shopifyをサブドメインで運用する場合は、ドメイン会社の管理画面を触る必要はありません。
操作するのは、あくまでサーバー会社の管理画面です。
- 利用中のサーバー会社でサブドメインを取得
- ↑ のサーバー会社の管理画面からDNS設定を変更
- Shopifyの管理画面にて、取得したサブドメインを連携
それでは、順番に解説していきます。
①利用中のサーバー会社でサブドメインを取得
すでにサブドメインを取得している方には不要な手順です。下の②までスクロールしてください。
まずは、エックスサーバーのサーバーパネルにログインして、画面右上の「サブドメイン設定」を選んでください。
サブドメインを設定したいドメインを選択してください。
画像①〜④の通りに情報を入力してください。②の部分がサブドメインになるので、間違えないように慎重に入力しましょう。
確認画面が表示されるので、確認して間違いがなければ「追加する」を選択してください。
※すみません、僕の入力ミスで「store」→「stores」となっていますが、各自で読み替えて頂ければと思いますm(__)m
「サブドメイン設定一覧」タブを選んでみて、画像のように「反映待ち」が表示されていればOKです。
以上で、サブドメインの取得が完了しました。「反映待ち」が消えるまで30分くらいかかるので、その間に残りの手続きを済ませてしまいましょう。
②サーバー会社の管理画面からDNSの設定を変更
サーバー画面に戻り、「DNSレコード設定」を選んでください。
サブドメインを設定したドメインを選択してください。
画像①〜⑤の通りに情報を入力してください。⑤はこれをコピペすれば楽だと思います↓↓
⑤に入力する情報 | 23.227.38.65 |
---|
確認画面が表示されるので、間違いがなければ「追加する」を選択します。
再び、画像①の「DNSレコード追加」タブを選び、②〜⑥の通りに情報を入力し、⑦の「確認画面へ進む」を選びます。⑤はこれをコピペしましょう↓↓
⑤に入力する情報 | shops.myshopify.com |
---|
確認画面が表示されるので、間違いがなければ「追加する」を選択します。
お疲れ様です。「DNSレコード一覧」のタブを選んで、上の画像のように、先ほど追加した2つの項目が反映されていればOKです ^^
以上で、エックスサーバー側での手続きは完了しました。あとはShopify側の設定ですが、こちらは非常に簡単なので2~3分で終わるかと思います。
③Shopify管理画面で、取得したサブドメインを連携
shopifyの管理画面に移動し、画像の①〜③の順番で進めてください。
「既存のドメインを接続する」をクリックします。
①の赤枠内に、作成したサブドメインを入力して「次へ」を選択します。
赤枠の「接続を確認する」をクリックします。
接続中の画面が切り替わり、上の画像のような画面が表示されれば、完了です!
サイドバー「オンラインストア」右側の「」をクリックすれば、サイトが見れる筈です。
※真っ白な画面に「無効なURLです」と表示される場合は、数分〜1時間程度待った後にもう一度確認してみましょう。
【参考にしたサイト】
参考 外部サービスのドメインに接続するShopifyヘルプセンター 参考 意外と簡単?エックスサーバーで取得したドメインからShopifyに移行・移管する方法【アピロス】 [template id=”13891″]