Guide

How to Share a Page You Made With ChatGPT, Claude or Gemini

AI tools are great at writing a landing page, an invitation or a little game in one go. Getting that page in front of someone else is the part they leave out.

In short: save the code as index.html, open it in your browser to check it, then upload it to droply.so. You get a normal link that opens on any phone or computer, and you can replace the file later without changing the link.

Shortcut: if you use Claude or ChatGPT, you can skip the steps below. Connect Droply once and ask the assistant to put the page online; it replies with the link. Here is how to set it up.

Step 1: Get the code out of the chat

Ask the assistant for "a single HTML file with the CSS and JavaScript included". That one sentence avoids most problems later, because everything the page needs ends up in one file.

  • ChatGPT: use the copy button on the code block, or download it from the canvas panel if it opened one.
  • Claude: open the artifact, then use the copy or download option in the corner.
  • Gemini: copy the code block, or export it from Canvas.

Step 2: Save it as an HTML file

Paste the code into a plain-text editor and save it as index.html. On Windows, Notepad works, but change "Save as type" to All files so it does not become index.html.txt. On a Mac, TextEdit needs Format → Make Plain Text first. A code editor such as VS Code avoids both traps.

Double-click the file. If it looks right in your browser, it will look right online.

Step 3: Check for things that only exist in the chat

AI-made pages sometimes point to files that were never created. Look for:

  • Image paths like hero.jpg that you do not have. Either ask for placeholder images from a public URL, or put your own images in a folder with the HTML and zip it (see ZIP or HTML?).
  • Imports like import App from "./App". That is a React project, not a standalone page. Ask the assistant to "convert this into one HTML file that runs without a build step".
  • API keys in the code. If the page calls an AI or payment API with a secret key, do not publish it. Anyone can read a web page's source.

Step 4: Upload and name it

  1. Go to droply.so and type a name, for example birthday-quiz.
  2. Drop your index.html on the upload box.
  3. Confirm your email or sign in with Google, and the page is live at birthday-quiz.droply.page.

Step 5: Iterate without breaking the link

The nice thing about AI pages is how fast you can improve them. When you have a new version, open the project in your dashboard and choose Update. The link stays the same, so the people you already sent it to see the new version.

Making it look finished

  • Ask the assistant to add a <title> and Open Graph tags so the link previews nicely in chats. Our Meta Tag Preview shows how it will look.
  • Add a favicon. The Favicon Generator turns any image into one.
  • Sharing in person or on a poster? Paid plans include a QR code for every project.
  • Want it on your own domain or behind a password? Both come with the Plus plan.

Got an index.html from your AI chat? Give it a real link.

Upload your page →