メインコンテンツにスキップ
すべてのコレクション公開サイト公開独自ドメイン・TLS証明書
独自ドメインを使用してサイトを公開する方法
独自ドメインを使用してサイトを公開する方法

Studioで制作したWebサイトを独自ドメインで公開する手順と注意点、トラブルシューティング方法をご紹介します。

Saika avatar
対応者:Saika
昨日アップデートされました

独自ドメインでのサイト公開手順

有料プラン契約プロジェクトでは、独自ドメインを使用したサイトが公開可能です。この記事では、独自ドメインでのサイト公開手順をご紹介します。

Tips:他サービスからStudioへの移行については、他サービスから独自ドメインを引き継いで、StudioへWebサイトを移行する方法をご覧ください。

記事内で使用する用語

サイト公開全体の流れ

下記の流れでStudioでサイトを作成し、公開します。

  1. サイトを作成、プラン契約(Studio)

  2. 独自ドメインを取得(Studio外)

  3. 公開パネルでドメインの入力(Studio)

  4. DNSレコード設定(Studio外)

  5. ドメインの接続確認(Studio)

  6. TLS証明書の発行を待つ(Studio)

  7. サイトの公開(Studio)

公開作業前の確認事項

  1. 移行完了までのダウンタイム

    他社サービス・サーバーで公開中のWebサイトを、独自ドメインをそのままにStudioへと切り替える際、サイトにアクセスできない時間帯(ダウンタイム)が必ず発生します。

  2. メールサービスの利用

    Webサイト(例:example.com)とメール(例:john@example.com)を同じホスティングサービスで運用したい場合、ドメイン取得サービスのDNS設定で必要なレコードを設定が必要な可能性があります。

  3. wwwあり・なし両方のURLでサイト表示

    Studioでは、Webサイト公開時に接続できるドメインは1つのみです。

    そのため、例えばexample.comをプロジェクトに接続し公開した場合、example.com へアクセスするとStudioで制作したサイトが表示されますが、www.example.com にアクセスしてもサイトは表示されません。カスタムプロキシなどを使って両方URLでサイトへのアクセスが実現できます。

事前準備

  1. Studioでサイトの作成とプランを契約します

    独自ドメインでのサイト公開は、有料プランでのみ可能です。事前にプランをご契約ください。

  2. ドメインを取得します
    Studioにはドメインの取得・管理機能はありません。まだドメインをお持ちでない場合は、先に外部サービスでドメインを取得してください。

  3. DNSレコードの設定を変更

    レコードの設定が反映されるまで数時間を要することがあるため、可能であれば前日までに設定を完了しておくことを推奨しています。

    別サービスですでにサイトを公開中の場合、レコードを変更することでサイトが表示されなくなります。ご注意ください。

設定手順

この手順には、Studioでの操作と外部サービスでの操作が含まれます。

Step 1. 独自ドメインの接続

  1. 作成したStudioのプロジェクトを開きます。

  2. エディタ右上の[公開]ボタンをクリックします。

  3. 公開パネル中央の[独自ドメイン設定]をクリックします。

  4. 接続したいドメインを入力し、[OK]をクリックします。

  5. 表示されるAレコード(例: A 34.111.141.225)をコピーします。

GIF:独自ドメインを接続する様子。

Step 2. DNSでのレコード設定

ご利用のドメイン取得サービスのDNS設定画面で操作します。

  1. DNS設定画面を開きます。

  2. Aレコードとして、Studioの画面からコピーしたAレコード(例: A 34.111.141.225)を設定します。

注意

Step 3. ドメインの接続確認

  1. Studioの公開パネルに戻ります。

  2. [次へ]をクリックして、接続状況を確認します。 設定が正しくてもすぐには反映されないことがあります。反映までお待ちください。この間、公開パネルは閉じていただいても構いません。

Step 4. TLS証明書の発行

接続時には暗号化された安全な通信を行うため、自動でTLS証明書が発行されます。このプロセスは自動で行われ、時間がかかる場合があります。

公開パネルを閉じたり、PCをシャットダウンした状態でも発行は中断されません。完了時に通知は送信されないため、発行状況は公開パネルよりご確認ください。

Step 5. サイトの公開と動作確認

  1. 公開パネル右上の[公開]をクリックします。

  2. 公開が完了すると、ポップアップが表示されます。

  3. 公開URLをクリックし、サイトの表示を確認します。

スクリーンショット:サイトの公開ボタンをクリックする様子。

注意

  • 公開サイトへアクセスしても404ページが表示される場合は、公開パネルで[更新]をクリックしてください。

  • すでにStudioのサブドメインで公開していた場合でも、独自ドメインに切り替えると最初は非公開状態(Studio 404表示)となります。公開準備が完了した時点で、公開パネルで[更新]をクリックしてください。

トラブルシューティング

下記でご紹介する対応方法を実施しても解決できない場合は、エディタ右下の[?]からチャットサポートへお問い合わせください。ご状況やチェックいただいた内容を併せて送信いただくとスムーズです。

Q. 公開パネルにエラーが表示されています。エラーを解消するにはどうすればいいですか?

A. ドメイン接続確認の手順で、正常にドメイン接続が確認できない場合、エラーが表示されます

  • ドメインの向き先が確認できません

  • ドメインが別のサーバーに向いています

  • ドメインが複数のサーバーに向いています

以下の記事でその詳細と対応方法をご確認ください。

Q. TLS証書を発行し始めてから、4時間以上経過しています。発行完了を早めることはできますか?

A. DNSレコードの反映状況により、証明書の発行には最大で72時間程度かかる場合があります。

Studioではより迅速なサイト公開を支援するため、証明書の発行に4時間以上かかる場合は手動での発行サポートを行なっています。お困りの場合にはチャットサポートまでお問い合わせください。

Q. 公開パネルに、リトライボタンが表示されています。

A. 証明書の取得に失敗した場合はリトライボタンが表示されます。このボタンをクリックして再取得を行ってください。

Q. 独自ドメイン設定は完了しましたが、URLにアクセスしてもサイトが表示されません。

A. 何らかの理由でサイトが表示されていない可能性があります。まずは、DNSレコードが正しく設定されているかを以下の記事を参考にご確認ください。

カスタムドメイン

こちらの回答で解決しましたか?