ChatGPT で作ったサイトをホスティングする方法
ChatGPT(と Canvas)は HTML、CSS、JavaScript で完全なサイトを書けますが、それをオンラインに公開することはできません。そのすき間を埋めるのが SiteDrop です。ChatGPT が作ったファイルを zip にまとめれば、誰とでも共有できる公開リンクが手に入ります。
無料でサイトを公開 →5 ステップで公開
- ChatGPT にサイトを作ってもらい、コード全体を出力してもらいます。できれば index.html 1 つにまとめてもらいましょう(CSS と JavaScript も中に含められます)。
- 出力されたコードを、パソコン上の index.html という名前のファイルにコピーします。styles.css や script.js が別ファイルで出力された場合は、同じフォルダーに保存します。
- すべてのファイル(画像も含む)を 1 つのフォルダーにまとめ、index.html を最上位に置きます。
- フォルダーを右クリックして .zip に圧縮します(Windows:送る → 圧縮フォルダー、Mac:圧縮)。
- .zip を SiteDrop にアップロードすれば、1 分以内に本物のリンクでサイトが公開されます。
使えるファイルの種類
ChatGPT が出力するのは素の HTML、CSS、JavaScript で、まさに静的ホスティングが配信するものです。index.html と .css、.js、画像(.png/.jpg/.svg)、フォントのファイルを 1 つのフォルダーにまとめれば、ビルドなしですべて動きます。動かないのはサーバー側のコード(PHP、データベース、秘密の API キー)だけですが、ChatGPT の静的サイトはそもそもそれを作りません。
うまくいかないときと直し方
- zip をアップロードすると真っ白なページになる。
index.html は zip の最上位に置く必要があり、サブフォルダーの中ではいけません。フォルダーごとではなく、ファイルそのものを選んで圧縮してください。
- ページは表示されるが、スタイルや画像がない。
ChatGPT は、説明はしたものの実際には出力していない styles.css や画像を参照していることがあります。ファイルを 1 つずつ名前を指定して出力してもらい、使われているファイル名そのままで index.html の隣に保存してください。
- ChatGPT がサイトを複数の HTML ページに分けて、リンクが 404 になる。
すべての .html ファイルを同じフォルダーに置き、相対リンク(/about ではなく about.html)を使ってください。まとめて zip にしてアップロードします。
SiteDrop と、Netlify をそのまま使う場合の比較
同じフォルダーを Netlify にドラッグすることもできますが、Netlify は git リポジトリとビルド工程を前提に作られていて、CLI の利用を勧められ、設定の一部はアカウント設定の奥にあります。ChatGPT がすでに完成した HTML として書いたサイトには不要な手間です。SiteDrop なら zip を受け取って 1 分以内に公開リンクを返し、有料プランでは独自ドメインもターミナルなしで追加できます。
ChatGPT のホスティング — よくある質問
ChatGPT がサイトをホスティングしてくれますか?
いいえ。ChatGPT はコードを書くだけで、公開 URL に公開する手段はありません。そのコードの zip を受け取ってオンラインに公開するのが SiteDrop です。
ChatGPT で作ったサイトが HTML ファイル 1 つだけですが、大丈夫ですか?
はい。名前を index.html にして、zip にしてアップロードしてください。CSS、JavaScript、画像は同じフォルダーに置けば一緒に配信されます。
公開後にサイトを変更できますか?
はい。ChatGPT からもう一度書き出し、更新したファイルを zip にして再アップロードしてください。リンクはそのままです。
ChatGPT のサイトを公開する準備はできましたか?
.zip をアップロードすれば、1 分以内に共有できる公開リンクが手に入ります。7 日間の無料プレビュー付き、カードは不要です。
今すぐ公開する →