AI Studio: create pages with Claude, ChatGPT and Gemini via MCP

What is AI Studio for?#

AI Studio lets you work directly with Claude, ChatGPT or Gemini via MCP (the protocol that lets an AI assistant call LDPage's tools). Once connected, the AI reads the design guide, searches templates and photos, and creates or edits pages with LDPage's engine, so the pages stay drag-and-drop editable like any other. AI Studio prepares a well-structured request for you to paste into the AI, so you do not have to write it from scratch.

1. 1

   Open Landing Pages in the left menu and choose AI Studio (badge "Mới" — New) under Build.

2. 2

   Under the title you see the connection status (for example "Đã kết nối · 3 ngày trước" — Connected · 3 days ago) and the Connection guide button (Hướng dẫn kết nối).

3. 3

   The left column has two tabs, Create a new landing page (Tạo landing page mới) and Improve an existing page (Tối ưu trang có sẵn); the right column is the Request for the AI panel (Yêu cầu gửi cho AI).

1. Connect your AI once#

1. 1

   Click Connection guide (when not connected yet, click "Lấy địa chỉ kết nối →" — Get the connection address — on the "Kết nối AI (một lần)" card). The "Connect AI to LDPage" drawer opens.

2. 2

   Choose the AI you use: Claude (web, desktop and mobile apps), ChatGPT (Developer mode on chatgpt.com), Gemini (Connected apps on gemini.google.com), Claude Code (command line), Cursor · VS Code (MCP-enabled code editors) or Other AI (no MCP support).

3. 3

   Under Your connection address (Địa chỉ kết nối của bạn), click Copy. Claude Code has a Copy command button; Cursor/VS Code has a Copy configuration (JSON) button.

4. 4

   Follow the connection steps shown in the drawer. For Claude: Settings › Connectors › Add custom connector, name it LDPage and paste the address into Remote MCP server URL. For ChatGPT: turn on Developer mode in Settings › Apps › Advanced settings, click Create app, paste the address into MCP Server URL and choose No authentication.

5. 5

   The drawer status changes from Waiting for the AI to connect… to Connected as soon as the AI calls LDPage for the first time.

2. Create a new landing page#

1. 1

   On the Create a new landing page tab, click a chip under "Industry templates — click to prefill an example" (Home – Furniture, Beauty cosmetics, F&B, Real estate, Webinar…), then adjust it to your business. If the form already has data, LDPage asks before replacing it.

2. 2

   Fill in Product or service (required — a short description or a product link) and Details (one item per line: brand, specs, guarantees, warranty, address, opening hours, what the form should collect…).

3. 3

   Fill in Target customers, choose the Main conversion goal (Leave details via form, COD order via form, Book an appointment, Call / Zalo message, Direct payment, Branding), Market and Page language.

4. 4

   Add Price and offer, Hotline / Zalo (shows floating call/Zalo buttons on phones) and Style, colors.

5. 5

   Toggle the options: Review the outline before creating, Prefer LDPage's ready-made templates, Automatic conversion optimization (CRO audit), Publish when I am happy (lets the AI publish and send the public link once you agree).

6. 6

   Click Clear (Làm trống) at the tab corner to empty the form. What you enter is remembered in this browser.

3. Improve an existing page#

1. 1

   Switch to the Improve an existing page tab and choose the Page to improve from the workspace (published pages carry a Published badge).

2. 2

   Select one or more tasks: Audit & optimize conversion, Rewrite content better, Refresh the design, Add missing parts, Optimize SEO, Optimize for phones, Translate into English.

3. 3

   Add an optional extra request, for example "change the offer to 30% off until the end of October".

4. Send the request to the AI#

1. 1

   In the Request for the AI panel, choose the target: Claude, ChatGPT, Gemini, Claude Code or Other AI. The request text updates automatically from the left-hand fields and the chosen target.

2. 2

   You can edit the text by hand; the note then says you edited this request manually — click Reset (Đặt lại) to go back to the automatic version.

3. 3

   Click Copy request, or the open button: Open Claude opens claude.ai with the request prefilled (not sent, so you can check LDPage is enabled); Open ChatGPT copies the request so you can enable Developer mode and LDPage, then paste; "Copy & open Gemini" copies and opens Gemini; for Claude Code the request is copied for you to paste into the terminal.

4. 4

   If the target AI is not connected, the panel warns that pages cannot be created yet and offers a Connect now button.

While the AI works, the "What the AI just did" card (AI vừa làm gì) shows each action in real time, such as reading the design guide, searching photos, browsing templates, creating pages, auditing and publishing. Click Open page to open that page in the editor.

5. Import HTML from an AI without MCP#

1. 1

   Choose Other AI in the request panel, copy the request and paste it into ChatGPT, Gemini or Claude (free plans work too). The AI writes the page as a single HTML file.

2. 2

   Download the HTML file or copy the code.

3. 3

   In AI Studio, click Import HTML (Nhập HTML, under "Có file HTML rồi?"). In the "Import HTML into LDPage" dialog, drag and drop the .html file (up to 300 KB) or paste the code into "Or paste HTML code".

4. 4

   Enter a Page name and click Create page. LDPage creates the page so you can preview it, edit the code and publish.

Troubleshooting#

1. 1

   Status stays at Waiting for the AI to connect…: make sure you pasted the full address and enabled LDPage in the conversation (the + button in the Claude/ChatGPT chat box), then send a request so the AI calls LDPage.

2. 2

   The AI can no longer reach LDPage after you regenerated or revoked the token: paste the new address into the AI or create another address.

3. 3

   ChatGPT does not show LDPage: Developer mode requires a ChatGPT Plus, Pro, Business, Enterprise or Edu plan.

4. 4

   HTML import says the file is too large (max 300 KB) or only .html files are accepted: shrink the file or ask the AI to remove embedded images; a permission error means your plan does not include custom code.