Copilotで作ったホームページを、本物のURLで公開する方法
最終更新: 2026-10-15
結論から — Copilotが出したHTMLを index.html として保存し、makelayer.com トップの「手持ちのファイルを取り込む」から「HTMLファイルを開く」で選んで、アドレスを決めて公開してください。カード不要・無料で、すぐ本物のURLが開きます。
ひと目でわかる
- 所要時間
- 約1分
- 必要なプラン
- 無料プランでOK
- コードの知識
- 不要
- 操作する場所
- トップの「手持ちのファイルを取り込む」
手順
- 1
Copilotにページをお願いしましょう
作りたいページの内容を言葉で伝えると、CopilotがHTMLを書いてくれます。「1つのHTMLファイルで」と付け加えておくと、デザイン(CSS)まで同じファイルにまとまるので、次の手順がぐっと簡単になります。回答に出てくるコードブロックのコピーボタンを押せば準備は完了です。
Copilot
近所のペットサロンの紹介ページを1つのHTMLファイルで作ってください。サービス一覧と場所、予約ボタンも入れてください。index.html コピー<section class="hero"> <h1>…</h1></section> - 2
HTMLファイルに保存して、MakeLayerで開きましょう
AIの画面にダウンロードボタンがあれば、それでHTMLファイルを受け取るのがいちばん簡単です。ない場合は、コピーしたコードをメモ帳に貼り付け、保存するときに「ファイルの種類」を「すべてのファイル (*.*)」に変えてから index.html という名前で保存してください。そのままだと index.html.txt として保存され、ファイルを選ぶときに表示されません。次に makelayer.com のトップで「手持ちのファイルを取り込む」を押し、「HTMLファイルを開く」でそのファイルを選ぶと、ページが実際の見た目のままプレビューで開きます。
公開する前に、実際の見た目を確認できます。 - 3
アドレスを決めて公開しましょう
好きな名前でアドレスを決めて、「はじめて公開する」を押してください。ログインを1回挟むだけで、選んだファイルとアドレスのまますぐ公開され、その瞬間からインターネットで開けます。無料でサイト5つまで、カード登録は不要です。
myname.mklyr.com 公開中公開するとこのようなアドレスがすぐに発行されます。すでにお持ちのドメインはPlusプランから接続でき、HTTPSも自動で設定されます。
- 4
次の修正は言葉で伝えましょう
公開したあとに直したい箇所があっても、Copilotに戻る必要はありません。エディタで直したい内容を言葉で伝えると、AIが該当するコードを見つけて修正し、何が変わるかを先に見せてくれます。気に入らなければワンクリックで元に戻せるので安心です。
編集アシスタント予約ボタンをもっと目立たせて ボタンの文言と色を変更しました。気に入らなければ元に戻します。
よくある質問
本当に無料ですか?
はい。サイト5つまでは無料のままで、カード登録も求めません。無料サイトには小さな「Made with MakeLayer」バッジが表示されますが、Plusプラン以上にするとバッジは消えます。
Copilotが作ったコードはそのまま動きますか?
はい。選んだHTMLファイルがそのまま公開されます。公開前のプレビューではページ内に直接書かれたスクリプトは実行されませんが、公開後のサイトではすべて正常に動作します。
複数ページのサイトも作れますか?
はい、下層ページや画像フォルダなど複数ファイルの構成も無料プランでそのまま扱えます。無料プランで制限されるのはファイル数ではなく、ストレージとサイト数です。フォルダごとアップロードするなら、ZIPにまとめてトップの「手持ちのファイルを取り込む」から「ZIPでアップロード」を選んでください。
自分のドメインをつなぐことはできますか?
はい。Plusプランから、すでにお持ちのドメインを接続でき、HTTPS証明書も自動で発行されます。無料プランでは発行されたmklyr.comのアドレスをそのまま使えます。
コードが分からなくても修正できますか?
はい。エディタで「予約ボタンの色を変えて」のように言葉で伝えるだけで、AIがコードを見つけて修正します。画面をクリックして修正したい場所を直接指定することもできます。無料プランでも、直前の保存と、保存した日ごとに1件ずつ最新3件の自動バックアップが残り、「バージョン」から元に戻せます。公開・手動のバージョンを保管できるのはPlusプランからです。
あわせて読みたい
- ChatGPTで作ったホームページを、本物のURLで公開する方法 ChatGPTで作ったHTMLをサーバーなし・無料ですぐ実際のURLに公開する手順ガイド(日本語)
- Claudeで作ったホームページを、本物のURLで公開する方法 ClaudeでHTMLをサーバーなし・無料ですぐ実際のURLに公開する手順ガイド(日本語)
- head・bodyにコードを挿入する エディタの「設定」画面のコード挿入でhead/bodyにスクリプトを貼り付ける方法 — Proプラン以上、元ファイルは変更なし(日本語)
- すでにあるHTMLファイルを、本物のURLで公開する方法 すでにあるHTMLファイルをサーバーなし・無料ですぐ実際のURLに公開する手順ガイド(日本語)