` tag if not provided) - `siteId` (string?): Optional site collection ID - `password` (string?): Password to protect the page (requires custom slug) - `organizationId` (string?): Target organization ID - Returns: `{ id, slug, url, title }` (also `updated: true` when updating an existing slug) **get_page** — Read the HTML source of a page. - `slug` (string, required): The page slug - `compact` (boolean, default: true): Strip large inline content with preview placeholders - `section` (string?): Extract a specific section at full fidelity: - `'head'` — contents of `<head>` - `'body'` — contents of `<body>` - `'meta'` — structural overview with line numbers and section sizes - `'style:N'` — the Nth `<style>` block (0-indexed) - `'script:N'` — the Nth inline `<script>` block (0-indexed) - `'svg:N'` — the Nth `<svg>` element (0-indexed) - `offset` (int?): Byte offset for chunked raw retrieval - `length` (int, default: 50000): Byte count for chunked retrieval (max 100000) **update_page** — Replace the full HTML content of a page. Prefer edit_page for small changes. - `slug` (string, required), `html` (string, required), `title` (string?), `password` (string?) - Returns: `{ slug, url, title, updated }` **edit_page** — Apply targeted find-and-replace edits without rewriting the full HTML. - `slug` (string, required): The page slug - `edits` (array, 1-50 items): Each with: - `old_text` (string, required): Exact text to find - `new_text` (string, required): Replacement text (empty string to delete) - `occurrence` (int?): Which occurrence to replace (1-indexed). If omitted, `old_text` must appear exactly once. - Returns: `{ slug, url, editsApplied, totalSize, updated }` **delete_page** — Delete a published page. - `slug` (string, required) - Returns: `{ slug, deleted }` **Recommended edit workflow**: 1. `get_page(section='meta')` — see page structure, identify sections 2. `get_page(section='style:0')` — fetch the section you need at full fidelity 3. `edit_page` with precise `old_text` from the section content 4. For repeated elements, use `occurrence` to target a specific match ### Site Tools **list_sites** — List your site collections with page counts. - No parameters - Returns: Array of `{ id, slug, name, organizationId, organizationName, pageCount, createdAt, updatedAt }` **create_site** — Create a new site collection. - `name` (string, required), `slug` (string, required), `organizationId` (string?) - Returns: `{ id, slug, name }` ### Analysis Tools **analyze_url** — Analyze a website and extract content, structure, colors, typography, and images as a brief for cloning/recreation. - `url` (string, required): URL to analyze - Returns: Structured brief with sections, navigation, color palette, typography, images (~12KB max) ### Asset Tools **import_asset_from_url** — Import an asset from a public URL (preferred method). - `slug` (string, required), `url` (string, required), `filename` (string?) - Returns: `{ id, filename, url, contentType, fileSize }` **create_asset_upload** — Get a presigned URL for direct file upload. - `slug` (string, required), `filename` (string, required), `contentType` (string, required) - Returns: `{ uploadUrl, storagePath, filename, expiresIn }` **complete_asset_upload** — Register an asset after presigned URL upload. - `slug` (string, required), `filename` (string, required), `contentType` (string, required), `storagePath` (string, required) - Returns: `{ id, filename, url, contentType, fileSize }` **upload_asset** — Upload via base64 (deprecated, use import_asset_from_url or create_asset_upload). - `slug`, `filename`, `base64Content`, `contentType` **list_assets** — List all assets for a page. - `slug` (string, required) - Returns: `{ slug, assetCount, uploadPageUrl, assets: [...] }` ### Blog Tools **list_blogs** — List your blogs with post counts. - No parameters - Returns: Array of `{ id, slug, title, description, authorName, organizationId, organizationName, url, postCount, createdAt }` **create_blog** — Create a new blog (Starter/Pro required). - `title` (string, required), `slug` (string, required, 3-100 chars) - `description` (string?), `authorName` (string?), `organizationId` (string?) - Returns: `{ id, slug, title, url }` **get_blog** — Get a single blog's details. - `blogId` (string, required) - Returns: `{ id, slug, title, description, authorName, hasLandingPage, url, ... }` **update_blog** — Update blog settings. - `blogId` (string, required), `title` (string?), `description` (string?), `authorName` (string?), `slug` (string?) - Returns: `{ success, slug, url }` **delete_blog** — Permanently delete a blog and all posts/templates. - `blogId` (string, required) - Returns: `{ deleted, id, title, slug }` ### Blog Post Tools **list_blog_posts** — List posts in a blog. - `blogId` (string, required) - `status` (enum?): Filter by `"DRAFT"`, `"PUBLISHED"`, or `"SCHEDULED"` - `limit` (number?, default 50, max 100), `offset` (number?, default 0) - Returns: `{ blog, posts: [{ id, slug, title, excerpt, status, categories, authorName, url, publishedAt, createdAt }] }` **get_blog_post** — Get a post with full markdown content. - `blogId` (string, required), `postId` (string, required) - Returns: `{ id, slug, title, markdown, excerpt, categories, authorName, status, publishedAt, createdAt, updatedAt }` **create_blog_post** — Create a new blog post. - `blogId` (string, required), `title` (string, required), `markdown` (string, required) - `slug` (string?), `excerpt` (string?), `categories` (string[]?), `authorName` (string?) - `status` (enum, default "DRAFT"): `"DRAFT"`, `"PUBLISHED"`, or `"SCHEDULED"` - Returns: `{ id, slug, title, status, url, publishedAt }` **edit_blog_post** — Update an existing blog post. - `blogId` (string, required), `postId` (string, required) - All optional: `title`, `markdown`, `slug`, `excerpt`, `categories`, `authorName`, `status` - Returns: `{ id, slug, title, status, url, updated }` **delete_blog_post** — Delete a blog post. - `blogId` (string, required), `postId` (string, required) - Returns: `{ id, title, deleted }` ### Blog Landing Page Tools **get_blog_landing** — Get the HTML landing page for a blog. - `blogId` (string, required) - Returns: `{ html, pageId?, pageSlug? }` **update_blog_landing** — Create or update blog landing page. Use `` marker for post injection. - `blogId` (string, required), `html` (string, required) - Returns: `{ success, pageSlug }` **remove_blog_landing** — Remove the custom landing page from a blog. - `blogId` (string, required) - Returns: `{ success, removedPageId? }` ### Blog Template Tools **list_blog_templates** — List HTML post templates for a blog. - `blogId` (string, required) - Returns: Array of `{ id, name, isDefault, createdAt, updatedAt }` **create_blog_template** — Create an HTML post template. Must include markers: ``, ``, ``, ``, `` - `blogId` (string, required), `name` (string, required), `html` (string, required), `isDefault` (boolean?) - Returns: Template object **update_blog_template** — Update a template's content or name. - `blogId` (string, required), `templateId` (string, required) - `html` (string?), `name` (string?), `isDefault` (boolean?) **delete_blog_template** — Delete a blog post template. - `blogId` (string, required), `templateId` (string, required) - Returns: `{ deleted, templateId, name }` ### Blog Asset Tools **import_blog_asset** — Import an image from a public URL for use in blog posts. - `blogId` (string, required), `url` (string, required), `filename` (string?) - Returns: `{ assetId, filename, url, absoluteUrl, markdown, fileSize }` ### Library Asset Tools **list_library_assets** — List reusable assets in your library. - `category` (enum?): `"BRAND"` or `"GENERAL"` - Returns: Array of `{ id, fileName, label, category, assetType, fileSize, contentType, url, createdAt }` **upload_library_asset** — Import a file from a public URL into your asset library. - `url` (string, required), `category` (enum, required): `"BRAND"` or `"GENERAL"` - `label` (string?), `filename` (string?), `organizationId` (string?) - Returns: `{ id, filename, url, absoluteUrl, category, label, fileSize }` **delete_library_asset** — Delete an asset from your library. - `assetId` (string, required) - Returns: `{ deleted, id, filename }` --- ## AI Prompt Cookbook These prompts work with ChatGPT, Claude, Gemini, or any LLM. Generate the HTML, then paste it at htmlpub.com or publish via the API. ### 1. General Single-Page Website ``` Create a complete, single-file HTML webpage for [YOUR PURPOSE]. Requirements: - All CSS in <style> tags, all JS in <script> tags — one self-contained file - Mobile-responsive with CSS flexbox/grid - Modern, clean design with a professional color scheme - Include a <title> tag with the page name - Use system fonts (system-ui, sans-serif) - Add <meta name="viewport" content="width=device-width, initial-scale=1.0"> The page should include: [DESCRIBE SECTIONS AND CONTENT] ``` ### 2. Portfolio / Personal Site ``` Create a single-file HTML portfolio website for [YOUR NAME], a [YOUR TITLE]. Include these sections: - Hero with name, title, and a brief tagline - About section with bio: [BIO - 2-3 sentences] - Projects grid showing: [PROJECT 1 NAME] - [DESCRIPTION], [PROJECT 2 NAME] - [DESCRIPTION], [PROJECT 3 NAME] - [DESCRIPTION] - Skills section with: [SKILL 1], [SKILL 2], [SKILL 3], [SKILL 4] - Contact section with email: [EMAIL] Requirements: Single HTML file, all CSS in <style> tags, responsive design, dark mode support, smooth scrolling, hover effects on project cards. Use system fonts. Include <title> tag. ``` ### 3. Landing Page / Product Launch ``` Create a single-file HTML landing page for [PRODUCT NAME]. Tagline: [TAGLINE] Description: [ONE-SENTENCE DESCRIPTION] Sections: - Hero with gradient background, headline, subheadline, and CTA button linking to [CTA URL] - Features grid (3 columns): [FEATURE 1], [FEATURE 2], [FEATURE 3] - Social proof / testimonials section - Pricing or final CTA section - Footer with links Requirements: Single HTML file, all CSS/JS inline, responsive, modern design with animations. Include <title> tag and viewport meta. ``` ### 4. Event Invitation / RSVP ``` Create a single-file HTML invitation page for [EVENT NAME]. Details: - Date: [DATE AND TIME] - Location: [VENUE NAME, ADDRESS] - Description: [EVENT DETAILS] - Dress code: [DRESS CODE] Include a countdown timer to the event date, a map placeholder, and event schedule. Make it elegant and festive. Single HTML file, all CSS/JS inline, responsive. Include <title> tag. ``` ### 5. Restaurant / Small Business ``` Create a single-file HTML website for [BUSINESS NAME], a [BUSINESS TYPE] located at [ADDRESS]. Include: - Hero with business name and ambiance photo placeholder - Menu section with categories and items: [MENU ITEMS] - Hours: [HOURS] - Location with address and map placeholder - Contact info: [PHONE], [EMAIL] - Footer Requirements: Single HTML file, all CSS inline, responsive, warm and inviting design. Include <title> tag. ``` ### 6. Resume / CV ``` Create a single-file HTML resume for [YOUR NAME]. Title: [PROFESSIONAL TITLE] Summary: [2-3 SENTENCE SUMMARY] Experience: - [JOB TITLE] at [COMPANY] ([DATES]): [DESCRIPTION] - [JOB TITLE] at [COMPANY] ([DATES]): [DESCRIPTION] Education: [DEGREE] from [SCHOOL] ([YEAR]) Skills: [SKILL 1], [SKILL 2], [SKILL 3] Contact: [EMAIL], [PHONE], [LINKEDIN URL] Requirements: Single HTML file, clean professional design, print-friendly with @media print styles, responsive. Include <title> tag. ``` ### 7. Coming Soon / Waitlist ``` Create a single-file HTML "coming soon" page for [PROJECT NAME]. Description: [WHAT IT IS - ONE SENTENCE] Expected launch: [LAUNCH DATE] Include: - Centered hero with project name and description - Animated countdown timer to launch date - Email signup form (visual only, no backend needed) - Social media links placeholder - Subtle background animation Requirements: Single HTML file, all CSS/JS inline, responsive, modern and minimal. Include <title> tag. ``` ### 8. Documentation / Help Page ``` Create a single-file HTML documentation page for [PRODUCT NAME]. Topics to cover: 1. [TOPIC 1 TITLE]: [BRIEF DESCRIPTION] 2. [TOPIC 2 TITLE]: [BRIEF DESCRIPTION] 3. [TOPIC 3 TITLE]: [BRIEF DESCRIPTION] 4. [TOPIC 4 TITLE]: [BRIEF DESCRIPTION] Include: sidebar navigation, code blocks with syntax highlighting (CSS-only), search placeholder, copy-to-clipboard buttons. Single HTML file, all CSS/JS inline, responsive, clean documentation style. Include <title> tag. ``` ### 9. Photo Gallery / Lookbook ``` Create a single-file HTML photo gallery page titled "[GALLERY TITLE]". Theme: [THEME OR DESCRIPTION] Include: - Masonry or grid layout for image placeholders (use colored placeholder divs with labels) - Lightbox effect on click (CSS/JS inline) - Filter buttons by category: [CATEGORY 1], [CATEGORY 2], [CATEGORY 3] - Smooth animations on hover and transitions Requirements: Single HTML file, all CSS/JS inline, responsive. Include <title> tag. Use placeholder images (solid color blocks with text labels). ``` ### 10. Interactive Calculator or Tool ``` Create a single-file HTML [TOOL NAME] calculator. Description: [WHAT IT CALCULATES] Inputs needed: - [INPUT 1 NAME] ([TYPE: number/text/dropdown]) - [INPUT 2 NAME] ([TYPE]) - [INPUT 3 NAME] ([TYPE]) Calculation logic: [DESCRIBE THE FORMULA OR LOGIC] Include: clean input form, real-time calculation on input change, results display with formatting, responsive design. Single HTML file, all CSS/JS inline. Include <title> tag. ``` --- ## Publishing Workflow ### Free (no account needed) 1. Go to https://htmlpub.com 2. Paste HTML or drop an HTML file 3. Get a shareable URL instantly 4. Pages expire after 7 days ### With API (Pro plan) ```bash # Publish a page curl -X PUT https://htmlpub.com/api/pages/my-page \ -H "Authorization: Bearer hp_live_YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{"html": "<!DOCTYPE html><html>...</html>"}' # Response: { "id": "...", "slug": "my-page", "url": "https://htmlpub.com/p/my-page" } ``` ### AI + API automation (Python) ```python import openai, requests # 1. Generate HTML with AI response = openai.chat.completions.create( model="gpt-4o", messages=[{"role": "user", "content": "Create a single-file HTML landing page for..."}] ) html = response.choices[0].message.content # 2. Publish to htmlpub result = requests.put( "https://htmlpub.com/api/pages/my-landing-page", headers={ "Authorization": "Bearer hp_live_YOUR_API_KEY", "Content-Type": "application/json" }, json={"html": html} ) print(f"Live at: {result.json()['url']}") ``` ### MCP (for AI assistants) Connect your AI assistant to `https://mcp.htmlpub.com/mcp` via the Model Context Protocol. OAuth-based auth, no API keys needed. Supports Claude Desktop, Cursor, Windsurf, and other MCP-compatible clients.

# htmlpub — Complete Reference > Publish HTML pages, blogs, and ecommerce sites instantly. Drop an HTML file or paste code, get a shareable URL in seconds. ## Overview htmlpub is the fastest way to publish HTML on the web. Users can paste HTML at htmlpub.com (free, no account needed) or use the REST API to publish programmatically (Pro plan). The platform also supports blogging with markdown, analytics, form collection, ecommerce, team organizations, and AI-powered content generation. **Base URL**: `https://htmlpub.com` **Auth format**: `Authorization: Bearer hp_live_YOUR_API_KEY` **Content type**: `application/json` (except asset uploads which use `multipart/form-data`) ## Plans | Feature | Free | Starter ($10/mo) | Pro ($25/mo) | |---------|------|-------------------|--------------| | Max pages | 5 | 50 | 250 | | Max blogs | 0 | 1 | 3 | | Page expiry | 7 days | Never | Never | | Custom slugs | No | Yes | Yes | | API access | No | No | Yes | | Custom domains | 0 | 1 | 5 | | Analytics | Basic (7 days) | Full (30 days) | Pro (90 days) + heatmaps | | Max asset size | 2MB | 5MB | 10MB | | Total storage | 50MB | 500MB | 5GB | | Assets per page | 15 | 50 | Unlimited | | Max integrations | 0 | 2 | 5 | | Team seats | 1 | 1 | 3 ($5/mo per extra) | | AI credits/mo | 5,000 | 20,000 | 60,000 | | Conversion goals | 1 | 3 | Unlimited | ### AI Credit Top-Up Packs | Credits | Price | Per 1K credits | |---------|-------|----------------| | 2,000 | $2.50 | $1.25 | | 5,000 | $5.00 | $1.00 | | 15,000 | $12.00 | $0.80 | | 50,000 | $35.00 | $0.70 | --- ## Authentication All API requests (except public endpoints like `/raw`, form submission, and analytics collection) require a Bearer token: ``` Authorization: Bearer hp_live_YOUR_API_KEY ``` Get API keys at https://htmlpub.com/dashboard/api-keys (Pro plan required, max 5 keys). --- ## Pages API ### PUT /api/pages/{slug} Create or update a page with a custom slug. **API key auth only** (not session). **Slug rules**: 3-100 characters, lowercase alphanumeric and hyphens, pattern: `^[a-z0-9]+(-[a-z0-9]+)*$` **Request body**: ```json { "html": "...", "siteId": "optional-site-id" } ``` - `html` (required): Complete HTML content, max 5MB - `siteId` (optional): Assign page to a site you own. Set to `null` to unassign. **Response** (201 Created / 200 OK): ```json { "id": "cm1a2b3c4d5e6f7g8h9i0", "slug": "my-page", "url": "https://htmlpub.com/p/my-page", "siteId": null } ``` **Errors**: 400 (invalid slug/HTML), 401 (invalid API key), 403 (plan limit), 409 (slug taken) ### PATCH /api/pages/{slug} Update an existing page. Supports session or API key auth. **Request body** (all fields optional, send at least one): ```json { "html": "updated...", "title": "New Title", "siteId": "site-id-or-null" } ``` Also accepts `multipart/form-data` with a `file` field for HTML upload. **Response** (200 OK): ```json { "slug": "my-page", "url": "https://htmlpub.com/p/my-page", "title": "New Title", "siteId": null } ``` ### GET /api/pages List all pages for the authenticated user. **Response** (200 OK): ```json { "pages": [ { "id": "cm1a2b3c4d5e6f7g8h9i0", "slug": "my-page", "title": "My Page", "url": "https://htmlpub.com/p/my-page", "siteId": null, "createdAt": "2025-01-15T10:30:00.000Z" } ] } ``` ### DELETE /api/pages/{slug} Permanently delete a page you own. **Response** (200 OK): `{ "success": true }` ### GET /api/pages/{slug}/raw Get raw HTML content of a published page. **No authentication required** for public pages. **Response**: Raw HTML with `Content-Type: text/html` Returns 404 if page doesn't exist or has expired. --- ## Assets API Upload images, CSS, JavaScript, and fonts to your pages. **Accepted file types**: png, jpg, gif, svg, webp, css, js, woff, woff2, ttf ### POST /api/pages/{slug}/assets Upload a file to a page. **Request**: `multipart/form-data` with `file` field **Response** (201 Created): ```json { "asset": { "id": "asset_abc123", "filename": "logo.png", "contentType": "image/png", "size": 45678 }, "url": "https://htmlpub.com/api/pages/my-page/assets/asset_abc123" } ``` **Errors**: 400 (invalid file type/too large), 403 (storage/asset count limit) ### GET /api/pages/{slug}/assets List all assets for a page. **Response** (200 OK): ```json { "assets": [ { "id": "asset_abc123", "filename": "logo.png", "contentType": "image/png", "size": 45678, "createdAt": "2025-01-15T10:30:00.000Z" } ] } ``` ### GET /api/pages/{slug}/assets/{assetId} Serve an asset file. **No authentication required** for public pages. Returns the file with appropriate Content-Type. Cache: `public, max-age=31536000, immutable` ### DELETE /api/pages/{slug}/assets/{assetId} Delete a specific asset. **Response**: `{ "success": true }` ### DELETE /api/pages/{slug}/assets Delete all assets for a page. **Response**: `{ "success": true }` --- ## Sites API Group related pages into sites with their own URL namespace. ### POST /api/sites Create a new site. **Request body**: ```json { "slug": "my-blog", "name": "My Blog" } ``` **Response** (201 Created): ```json { "id": "site_abc123", "slug": "my-blog", "name": "My Blog", "url": "https://htmlpub.com/s/my-blog", "createdAt": "2025-01-15T10:30:00.000Z" } ``` ### GET /api/sites List all sites with their pages. **Response** (200 OK): ```json { "sites": [ { "id": "site_abc123", "slug": "my-blog", "name": "My Blog", "url": "https://htmlpub.com/s/my-blog", "defaultPageId": null, "pageCount": 3, "pages": [...], "createdAt": "2025-01-15T10:30:00.000Z" } ] } ``` ### GET /api/sites/{siteId} Get site details including all pages. ### PATCH /api/sites/{siteId} Update a site's name, slug, or default page. **Request body** (all optional): ```json { "name": "Updated Name", "slug": "new-slug", "defaultPageId": "page-id-or-null" } ``` ### DELETE /api/sites/{siteId} Delete a site. **Warning**: This cascading-deletes all pages in the site. **Response**: `{ "success": true, "message": "Site deleted" }` --- ## Blogs API Create and manage blogs with markdown posts, custom templates, and landing pages. **Requires Starter or Pro plan.** ### POST /api/blogs Create a new blog. **Request body**: ```json { "slug": "my-tech-blog", "title": "My Tech Blog", "description": "Optional description", "authorName": "Default author" } ``` **Response** (201 Created): ```json { "id": "blog_abc123", "slug": "my-tech-blog", "title": "My Tech Blog", "description": "Optional description", "authorName": "Default author", "createdAt": "2025-01-15T10:30:00.000Z" } ``` **Errors**: 400 (invalid slug), 403 (blog limit/feature disabled), 409 (slug exists), 422 (blocked slug) ### GET /api/blogs List all blogs with post counts. **Response** (200 OK): ```json { "blogs": [ { "id": "blog_abc123", "slug": "my-tech-blog", "title": "My Tech Blog", "description": "Optional description", "authorName": "Default author", "postCount": 12, "createdAt": "2025-01-15T10:30:00.000Z" } ] } ``` ### GET /api/blogs/{blogId} Get a single blog's details. ### PATCH /api/blogs/{blogId} Update blog settings. **Request body** (all optional): `{ title, description, authorName, slug, siteId }` ### DELETE /api/blogs/{blogId} Delete a blog. **Warning**: Cascading-deletes all posts and templates. ### Blog Posts #### POST /api/blogs/{blogId}/posts Create a new blog post. **Request body**: ```json { "title": "My First Post", "markdown": "# Hello World\n\nThis is my first blog post.", "slug": "my-first-post", "excerpt": "A short description", "tags": ["tech", "tutorial"], "authorName": "Author Name", "status": "DRAFT", "publishedAt": "2025-02-01T00:00:00.000Z", "templateId": "template_abc123", "coverImagePath": "/api/blogs/blog123/assets/asset456" } ``` - `title` (required): Post title - `markdown` (required): Post content in markdown - `slug` (optional): URL slug, auto-generated from title if omitted - `status`: `"DRAFT"` (default), `"PUBLISHED"`, or `"SCHEDULED"` - `publishedAt` (optional): Schedule date. If status is PUBLISHED and date is future, auto-converts to SCHEDULED - All other fields are optional **Response** (201 Created): ```json { "id": "post_abc123", "slug": "my-first-post", "title": "My First Post", "status": "DRAFT", "url": null, "publishedAt": null } ``` #### GET /api/blogs/{blogId}/posts List posts in a blog. **Query params**: `status` (DRAFT|PUBLISHED|SCHEDULED, optional) **Response**: `{ "posts": [...] }` #### GET /api/blogs/{blogId}/posts/{postId} Get a post with full markdown content. #### PATCH /api/blogs/{blogId}/posts/{postId} Update a post. All fields optional: `{ title, markdown, slug, excerpt, tags, authorName, status, publishedAt, coverImagePath, templateId }` **Auto-status logic**: - Setting status to PUBLISHED with a future `publishedAt` → auto-converts to SCHEDULED - Setting status to SCHEDULED with a past `publishedAt` → auto-converts to PUBLISHED #### DELETE /api/blogs/{blogId}/posts/{postId} Delete a post. **Response**: `{ "success": true }` #### POST /api/blogs/{blogId}/posts/generate AI-generate a blog post. Returns Server-Sent Events stream. **Request body**: `{ "prompt": "Write about...", "type": "post" | "landing" | "template" }` **SSE events**: ``` data: { "type": "text_delta", "text": "..." } data: { "type": "done", "inputTokens": 500, "outputTokens": 1200, "creditsUsed": 85 } ``` **Errors**: 402 (insufficient credits), 429 (rate limit) #### POST /api/blogs/{blogId}/posts/preview Preview a post rendered through its template. Returns HTML. **Request body**: `{ title, markdown, excerpt, tags, authorName, templateId }` ### Blog Templates HTML templates define how blog posts are rendered. Templates must include markers: ``, ``, ``, ``, `` #### POST /api/blogs/{blogId}/templates Create a template. **Request body**: `{ "name": "Template Name", "html": "...", "isDefault": true }` #### GET /api/blogs/{blogId}/templates List templates for a blog. #### GET /api/blogs/{blogId}/templates/{templateId} Get template with HTML content. #### PUT /api/blogs/{blogId}/templates/{templateId} Update template HTML or name. #### PATCH /api/blogs/{blogId}/templates/{templateId} Set template as default. #### DELETE /api/blogs/{blogId}/templates/{templateId} Delete template. Posts using it fall back to default. ### Blog Landing Pages Each blog can have a custom HTML landing page. Use `` marker where post listings should be injected. #### GET /api/blogs/{blogId}/landing Get the landing page HTML. #### POST /api/blogs/{blogId}/landing Create/update the landing page. Accepts FormData with `file` field or JSON with `html`. #### DELETE /api/blogs/{blogId}/landing Remove the landing page. ### Blog Assets #### POST /api/blogs/{blogId}/assets Upload an image to a blog. Multipart form upload, `file` field. Supports PNG, JPEG, GIF, WebP, SVG (max 10MB). **Response**: `{ assetId, filename, url, contentType, fileSize }` #### GET /api/blogs/{blogId}/assets/{assetId} Serve a blog asset. No auth required. Cache: 1 year (immutable). ### Public Blog Rendering These endpoints serve rendered blog pages to the public (no auth required): - `GET /api/blogs/render/{blogSlug}` — Blog landing page with post listings. Query: `tag` for filtering. - `GET /api/blogs/render/{blogSlug}/{postSlug}` — Rendered blog post - `GET /api/blogs/render/s/{siteSlug}/{postSlug}` — Site blog post --- ## Forms API htmlpub auto-detects HTML forms on published pages and collects submissions. ### POST /api/forms/submit Submit form data. **Public endpoint, CORS enabled.** **Rate limit**: 10 submissions/minute per IP **Request body**: ```json { "pageSlug": "my-page", "formIdentifier": "contact-form", "data": { "name": "Jane", "email": "jane@example.com", "message": "Hello" } } ``` - `data`: Max 50KB, max 100 fields, HTML tags stripped, max 10KB per field **Response** (201): `{ "id": "...", "message": "Form submission received" }` **Errors**: 400 (validation), 403 (collection disabled), 404 (page not found), 429 (rate limit) ### GET /api/forms List pages with form submissions. **Response**: ```json { "pages": [ { "id": "...", "slug": "my-page", "title": "My Page", "formCollectionEnabled": true, "hasForm": true, "submissionCount": 42, "lastSubmissionAt": "2025-01-15T10:30:00.000Z" } ] } ``` ### GET /api/forms/{pageSlug} Get submissions for a page. **Query params**: `limit` (1-100, default 50), `offset` (default 0) **Response**: ```json { "page": { "id": "...", "slug": "my-page", "title": "My Page", "formCollectionEnabled": true }, "submissions": [ { "id": "...", "formIdentifier": "contact-form", "data": { "name": "Jane", "email": "jane@example.com" }, "submitterIp": "1.2.3.4", "submitterUserAgent": "...", "createdAt": "..." } ], "pagination": { "total": 42, "limit": 50, "offset": 0, "hasMore": false } } ``` ### DELETE /api/forms/{pageSlug}/{submissionId} Delete a form submission. --- ## Analytics API Track page views, scroll depth, clicks, and conversions. ### POST /api/analytics/collect Track analytics events. **Public endpoint, CORS enabled.** **Rate limit**: 30 requests/minute per IP **Request body**: ```json { "events": [ { "pageId": "...", "eventType": "page_view", "visitorId": "...", "sessionId": "...", "timestamp": 1705312200000 } ] } ``` Event types: `page_view`, `scroll_depth`, `element_click`, `form_submit`, `rum_timing` **Max**: 50 events per batch **Response** (202): `{ "accepted": 5 }` ### GET /api/analytics/overview Dashboard overview with trends. **Starter+ plan required.** **Query params**: `range` (7d|14d|30d|90d, default 7d) **Response**: ```json { "totalViews": 1234, "totalUniqueVisitors": 567, "totalSessions": 890, "avgScrollDepth": 0.65, "totalFormSubmissions": 23, "totalConversions": 12, "dailyMetrics": [{ "date": "2025-01-15", "views": 100, "uniqueVisitors": 50, "sessions": 75 }], "topSources": [{ "source": "google", "count": 200 }], "deviceBreakdown": [{ "device": "desktop", "count": 800 }], "comparison": { "viewsChange": 15.2, "visitorsChange": 8.5 } } ``` ### GET /api/analytics/pages Per-page metrics summary. **Query params**: `range` (default 7d) **Response**: ```json { "pages": [ { "pageId": "...", "slug": "my-page", "title": "My Page", "views": 500, "uniqueVisitors": 200, "avgScrollDepth": 0.72, "conversions": 5, "conversionRate": 0.025 } ] } ``` ### GET /api/analytics/pages/{pageId} Detailed analytics for a single page. **Query params**: `range` (default 7d) **Response**: ```json { "pageId": "...", "dailyMetrics": [...], "scrollFunnel": [{ "depth": 25, "reached": 450 }, { "depth": 50, "reached": 300 }], "topSources": [...], "deviceBreakdown": [...], "browserBreakdown": [...], "topClickedElements": [{ "selector": ".cta-button", "count": 45 }], "totals": { "views": 500, "uniqueVisitors": 200, "sessions": 350, "avgScrollDepth": 0.72, "formSubmissions": 10, "conversions": 5, "medianLoadTimeMs": 1200 } } ``` ### GET /api/analytics/pages/{pageId}/heatmap Click heatmap data. **Pro plan only.** **Query params**: `range`, `viewport` (desktop|tablet|mobile, default desktop) **Response**: ```json { "clicks": [{ "xBin": 45, "yBin": 120, "count": 12 }], "scrollDepth": [{ "depth": 25, "reached": 450 }] } ``` Heatmap uses a 100x1000 pixel grid. `xBin` (0-99) = horizontal position, `yBin` (0-999) = vertical position. --- ## Organizations API Team workspaces with role-based access control. **Roles**: OWNER (full control), ADMIN (manage members, resources), MEMBER (use resources) ### POST /api/orgs Create an organization. **Request body**: `{ "name": "My Team" }` ### GET /api/orgs List organizations you belong to. ### GET /api/orgs/{orgId} Get organization details. ### PUT /api/orgs/{orgId} Update organization name. ### DELETE /api/orgs/{orgId} Delete organization (OWNER only). Must be empty. ### POST /api/orgs/{orgId}/avatar Upload organization avatar. Multipart form upload, `file` field. ### POST /api/orgs/{orgId}/invites Invite a team member. **Request body**: `{ "email": "user@example.com", "role": "MEMBER" }` ### GET /api/orgs/{orgId}/invites List pending invitations. ### PATCH /api/orgs/{orgId}/invites/{inviteId} Update invitation (e.g., revoke). ### DELETE /api/orgs/{orgId}/invites/{inviteId} Delete invitation. ### GET /api/orgs/{orgId}/members List organization members. ### PATCH /api/orgs/{orgId}/members/{userId} Update member role. ### DELETE /api/orgs/{orgId}/members/{userId} Remove member from organization. ### GET /api/orgs/invites/{token} Get invitation details by token. ### POST /api/orgs/invites/accept Accept an invitation. **Request body**: `{ "token": "invite_token_here" }` ### POST /api/orgs/switch Switch active organization context. **Request body**: `{ "organizationId": "org_abc123" }` --- ## Tags API Color-coded tags for organizing pages, sites, and forms. ### POST /api/tags Create a tag. **Request body**: `{ "name": "Important", "color": "#FF5733" }` - `name`: 1-32 characters - `color`: Optional hex color **Response** (201): Tag object **Errors**: 409 (name exists) ### GET /api/tags List all tags. ### PATCH /api/tags/{tagId} Update tag name or color. ### DELETE /api/tags/{tagId} Delete tag. Cascades to remove all assignments. ### GET /api/tags/{tagId}/usage Get usage counts and entities for a tag. **Response**: ```json { "counts": { "page": 5, "site": 2, "form": 1 }, "entities": [{ "type": "page", "id": "...", "name": "My Page" }] } ``` ### POST /api/tags/{tagId}/merge Merge a tag into another. Moves all assignments, deletes source. **Request body**: `{ "targetId": "tag_target123" }` ### POST /api/tags/assignments Assign a tag to an entity. **Request body**: `{ "tagId": "tag_abc", "entityType": "page", "entityId": "page_123" }` Entity types: `page`, `site`, `form` ### GET /api/tags/assignments List all tag assignments. ### DELETE /api/tags/assignments Remove a tag assignment. **Request body**: `{ "tagId": "...", "entityType": "page", "entityId": "..." }` ### POST /api/tags/assignments/bulk Bulk assign or remove tags. **Request body**: ```json { "tagId": "tag_abc", "entityType": "page", "entityIds": ["page_1", "page_2", "page_3"], "action": "assign" } ``` Max 500 entities per request. --- ## Custom Domains API Connect your own domain to a page, site, or blog. **Pro plan required.** ### POST /api/custom-domains Add a custom domain. **Request body**: ```json { "domain": "www.example.com", "pageId": "cm1a2b3c4d5e6f7g8h9i0" } ``` **Response** (201): ```json { "domain": { "domain": "www.example.com", "status": "PENDING", "pageId": "cm1a2b3c4d5e6f7g8h9i0", "verifiedAt": null, "createdAt": "2025-01-15T10:30:00.000Z" }, "instructions": { "target": "customers.htmlpub.com", "message": "Add a CNAME record pointing www.example.com to customers.htmlpub.com" } } ``` Domain statuses: PENDING → CONFIGURING → DNS_PROPAGATING → SSL_PENDING → ACTIVE ### GET /api/custom-domains List all custom domains. ### GET /api/custom-domains/{domain} Get domain details. ### PATCH /api/custom-domains/{domain} Change which page/site/blog a domain points to. **Request body**: `{ "pageId": "new-page-id" }` ### DELETE /api/custom-domains/{domain} Remove a custom domain. ### POST /api/custom-domains/{domain}/verify Verify DNS is properly configured. **Response**: `{ "domain": { ... }, "verified": true, "cfStatus": "active" }` --- ## Credits API AI credits for page generation and blog post writing. ### GET /api/credits/balance Check current credit balance. **Response**: `{ "balance": 15000 }` ### GET /api/credits/history Get credit transaction history. **Query params**: `limit` (max 100, default 50), `offset` (default 0) **Response**: ```json { "entries": [ { "id": "...", "amount": -85, "type": "AI_DEBIT", "description": "Blog post generation", "balanceAfter": 14915, "createdAt": "2025-01-15T10:30:00.000Z" } ] } ``` Credit types: `MONTHLY_GRANT`, `WEEKLY_GRANT`, `INITIAL_GRANT`, `TOPUP`, `AI_DEBIT`, `RESERVATION`, `RELEASE`, `EXPIRY`, `ADMIN_ADJUST` --- ## Integrations API Connect to third-party services (Slack, Google Sheets, Notion, etc.) via Paragon. ### GET /api/integrations/providers List available integration providers and their actions. **Response**: ```json { "providers": [ { "id": "slack", "displayName": "Slack", "icon": "...", "connected": true, "actions": [ { "name": "send_message", "displayName": "Send Message", "triggers": ["form_submitted"] } ] } ] } ``` ### GET /api/integrations/status Check connection status for all integrations. ### POST /api/integrations/bindings Create an integration binding (connect a trigger to an action). **Request body**: ```json { "featureTrigger": "form_submitted", "providerId": "slack", "actionName": "send_message", "enabled": true, "config": { "parameterMappings": { "channel": "#leads" }, "staticParameters": { "message_prefix": "New lead:" } }, "pageSlug": "my-landing-page" } ``` ### GET /api/integrations/bindings List all integration bindings. ### DELETE /api/integrations/bindings?id={bindingId} Delete an integration binding. ### POST /api/integrations/actions/execute Execute an integration action manually. **Request body**: `{ "action": "send_message", "parameters": { "channel": "#general", "message": "Hello" } }` ### GET /api/integrations/slack/channels List available Slack channels (when Slack is connected). 5-minute cache. ### GET /api/integrations/form-fields Get form field names for a page (for mapping form data to integrations). **Query params**: `pageSlug` (optional) ### GET /api/integrations/logs View integration action execution logs. **Query params**: `page` (default 1), `status` (optional filter) --- ## E-commerce API Accept payments on published pages via Stripe Connect, PayPal, Shopify, or Lemon Squeezy. ### Stripe Connect - `POST /api/connect/v2/create-account` — Create Stripe Connect account - `POST /api/connect/v2/account-link` — Get Stripe onboarding URL - `GET /api/connect/v2/account-status` — Check account status - `POST /api/connect/v2/checkout` — Create checkout session - `GET /api/connect/v2/products` — List Stripe products ### PayPal - `POST /api/connect/paypal/authorize` — Start PayPal connection - `GET /api/connect/paypal/callback` — OAuth callback - `GET /api/connect/paypal/status` — Check connection status - `POST /api/connect/paypal/disconnect` — Disconnect PayPal ### Shopify - `POST /api/connect/shopify/connect` — Connect Shopify store - `GET /api/connect/shopify/status` — Check connection status - `POST /api/connect/shopify/test-connection` — Test connection - `POST /api/connect/shopify/disconnect` — Disconnect Shopify - `POST /api/shopify/cart/checkout-link` — Generate checkout link ### Lemon Squeezy - `POST /api/connect/lemonsqueezy/connect` — Connect Lemon Squeezy - `GET /api/connect/lemonsqueezy/status` — Check connection status - `POST /api/connect/lemonsqueezy/disconnect` — Disconnect - `POST /api/lemonsqueezy/checkout` — Create checkout session ### E-commerce Dashboard - `GET /api/internal/ecommerce/status` — Get all connected gateways - `GET /api/internal/ecommerce/sessions` — List checkout sessions - `GET /api/internal/ecommerce/revenue` — Revenue analytics - `POST /api/internal/ecommerce/add-checkout` — Add checkout to page - `POST /api/internal/ecommerce/remove-checkout` — Remove checkout from page --- ## Error Responses All errors return JSON: ```json { "error": "Error message description" } ``` | Code | Meaning | |------|---------| | 400 | Invalid request body, missing fields, validation error | | 401 | Missing or invalid API key | | 402 | Insufficient AI credits | | 403 | Plan limit reached, feature requires upgrade, or not your resource | | 404 | Resource not found or expired | | 409 | Slug or domain already taken | | 413 | HTML exceeds 5MB limit | | 422 | Reserved slug, action failed | | 429 | Rate limit exceeded (check Retry-After header) | | 500 | Internal server error | ## Rate Limits - Pages API (except /raw): 20 requests per 60 seconds per IP - /raw endpoint: 60 requests per 60 seconds per IP - API keys endpoint: 10 requests per 60 seconds per IP - Form submission: 10 submissions per minute per IP - Analytics collection: 30 requests per minute per IP Rate limit headers: `X-RateLimit-Limit`, `X-RateLimit-Remaining` --- ## MCP Tools Reference htmlpub has a remote MCP server at `https://mcp.htmlpub.com/mcp` with 37 tools that AI assistants (Claude, etc.) can connect to via the Model Context Protocol. OAuth-based auth, no API keys needed. ### Organization Tools **list_organizations** — List all organizations you have access to. Use this to discover which org to target when creating resources. - No parameters - Returns: Array of `{ id, name, isPersonal, isDefault }` ### Page Tools **list_pages** — List your published HTML pages across all organizations. - No parameters - Returns: Array of `{ slug, title, url, status, organizationId, organizationName, createdAt, updatedAt }` **create_page** — Publish an HTML page. Auto-generates a slug by default, or provide a custom slug (Starter/Pro only) to choose the URL or update an existing page. - `html` (string, required): The HTML content to publish - `slug` (string?): Custom URL slug, 3-100 chars (Starter/Pro only). Omit for auto-generated slug. - `title` (string?): Page title (extracted from `` tag if not provided) - `siteId` (string?): Optional site collection ID - `password` (string?): Password to protect the page (requires custom slug) - `organizationId` (string?): Target organization ID - Returns: `{ id, slug, url, title }` (also `updated: true` when updating an existing slug) **get_page** — Read the HTML source of a page. - `slug` (string, required): The page slug - `compact` (boolean, default: true): Strip large inline content with preview placeholders - `section` (string?): Extract a specific section at full fidelity: - `'head'` — contents of `<head>` - `'body'` — contents of `<body>` - `'meta'` — structural overview with line numbers and section sizes - `'style:N'` — the Nth `<style>` block (0-indexed) - `'script:N'` — the Nth inline `<script>` block (0-indexed) - `'svg:N'` — the Nth `<svg>` element (0-indexed) - `offset` (int?): Byte offset for chunked raw retrieval - `length` (int, default: 50000): Byte count for chunked retrieval (max 100000) **update_page** — Replace the full HTML content of a page. Prefer edit_page for small changes. - `slug` (string, required), `html` (string, required), `title` (string?), `password` (string?) - Returns: `{ slug, url, title, updated }` **edit_page** — Apply targeted find-and-replace edits without rewriting the full HTML. - `slug` (string, required): The page slug - `edits` (array, 1-50 items): Each with: - `old_text` (string, required): Exact text to find - `new_text` (string, required): Replacement text (empty string to delete) - `occurrence` (int?): Which occurrence to replace (1-indexed). If omitted, `old_text` must appear exactly once. - Returns: `{ slug, url, editsApplied, totalSize, updated }` **delete_page** — Delete a published page. - `slug` (string, required) - Returns: `{ slug, deleted }` **Recommended edit workflow**: 1. `get_page(section='meta')` — see page structure, identify sections 2. `get_page(section='style:0')` — fetch the section you need at full fidelity 3. `edit_page` with precise `old_text` from the section content 4. For repeated elements, use `occurrence` to target a specific match ### Site Tools **list_sites** — List your site collections with page counts. - No parameters - Returns: Array of `{ id, slug, name, organizationId, organizationName, pageCount, createdAt, updatedAt }` **create_site** — Create a new site collection. - `name` (string, required), `slug` (string, required), `organizationId` (string?) - Returns: `{ id, slug, name }` ### Analysis Tools **analyze_url** — Analyze a website and extract content, structure, colors, typography, and images as a brief for cloning/recreation. - `url` (string, required): URL to analyze - Returns: Structured brief with sections, navigation, color palette, typography, images (~12KB max) ### Asset Tools **import_asset_from_url** — Import an asset from a public URL (preferred method). - `slug` (string, required), `url` (string, required), `filename` (string?) - Returns: `{ id, filename, url, contentType, fileSize }` **create_asset_upload** — Get a presigned URL for direct file upload. - `slug` (string, required), `filename` (string, required), `contentType` (string, required) - Returns: `{ uploadUrl, storagePath, filename, expiresIn }` **complete_asset_upload** — Register an asset after presigned URL upload. - `slug` (string, required), `filename` (string, required), `contentType` (string, required), `storagePath` (string, required) - Returns: `{ id, filename, url, contentType, fileSize }` **upload_asset** — Upload via base64 (deprecated, use import_asset_from_url or create_asset_upload). - `slug`, `filename`, `base64Content`, `contentType` **list_assets** — List all assets for a page. - `slug` (string, required) - Returns: `{ slug, assetCount, uploadPageUrl, assets: [...] }` ### Blog Tools **list_blogs** — List your blogs with post counts. - No parameters - Returns: Array of `{ id, slug, title, description, authorName, organizationId, organizationName, url, postCount, createdAt }` **create_blog** — Create a new blog (Starter/Pro required). - `title` (string, required), `slug` (string, required, 3-100 chars) - `description` (string?), `authorName` (string?), `organizationId` (string?) - Returns: `{ id, slug, title, url }` **get_blog** — Get a single blog's details. - `blogId` (string, required) - Returns: `{ id, slug, title, description, authorName, hasLandingPage, url, ... }` **update_blog** — Update blog settings. - `blogId` (string, required), `title` (string?), `description` (string?), `authorName` (string?), `slug` (string?) - Returns: `{ success, slug, url }` **delete_blog** — Permanently delete a blog and all posts/templates. - `blogId` (string, required) - Returns: `{ deleted, id, title, slug }` ### Blog Post Tools **list_blog_posts** — List posts in a blog. - `blogId` (string, required) - `status` (enum?): Filter by `"DRAFT"`, `"PUBLISHED"`, or `"SCHEDULED"` - `limit` (number?, default 50, max 100), `offset` (number?, default 0) - Returns: `{ blog, posts: [{ id, slug, title, excerpt, status, categories, authorName, url, publishedAt, createdAt }] }` **get_blog_post** — Get a post with full markdown content. - `blogId` (string, required), `postId` (string, required) - Returns: `{ id, slug, title, markdown, excerpt, categories, authorName, status, publishedAt, createdAt, updatedAt }` **create_blog_post** — Create a new blog post. - `blogId` (string, required), `title` (string, required), `markdown` (string, required) - `slug` (string?), `excerpt` (string?), `categories` (string[]?), `authorName` (string?) - `status` (enum, default "DRAFT"): `"DRAFT"`, `"PUBLISHED"`, or `"SCHEDULED"` - Returns: `{ id, slug, title, status, url, publishedAt }` **edit_blog_post** — Update an existing blog post. - `blogId` (string, required), `postId` (string, required) - All optional: `title`, `markdown`, `slug`, `excerpt`, `categories`, `authorName`, `status` - Returns: `{ id, slug, title, status, url, updated }` **delete_blog_post** — Delete a blog post. - `blogId` (string, required), `postId` (string, required) - Returns: `{ id, title, deleted }` ### Blog Landing Page Tools **get_blog_landing** — Get the HTML landing page for a blog. - `blogId` (string, required) - Returns: `{ html, pageId?, pageSlug? }` **update_blog_landing** — Create or update blog landing page. Use `` marker for post injection. - `blogId` (string, required), `html` (string, required) - Returns: `{ success, pageSlug }` **remove_blog_landing** — Remove the custom landing page from a blog. - `blogId` (string, required) - Returns: `{ success, removedPageId? }` ### Blog Template Tools **list_blog_templates** — List HTML post templates for a blog. - `blogId` (string, required) - Returns: Array of `{ id, name, isDefault, createdAt, updatedAt }` **create_blog_template** — Create an HTML post template. Must include markers: ``, ``, ``, ``, `` - `blogId` (string, required), `name` (string, required), `html` (string, required), `isDefault` (boolean?) - Returns: Template object **update_blog_template** — Update a template's content or name. - `blogId` (string, required), `templateId` (string, required) - `html` (string?), `name` (string?), `isDefault` (boolean?) **delete_blog_template** — Delete a blog post template. - `blogId` (string, required), `templateId` (string, required) - Returns: `{ deleted, templateId, name }` ### Blog Asset Tools **import_blog_asset** — Import an image from a public URL for use in blog posts. - `blogId` (string, required), `url` (string, required), `filename` (string?) - Returns: `{ assetId, filename, url, absoluteUrl, markdown, fileSize }` ### Library Asset Tools **list_library_assets** — List reusable assets in your library. - `category` (enum?): `"BRAND"` or `"GENERAL"` - Returns: Array of `{ id, fileName, label, category, assetType, fileSize, contentType, url, createdAt }` **upload_library_asset** — Import a file from a public URL into your asset library. - `url` (string, required), `category` (enum, required): `"BRAND"` or `"GENERAL"` - `label` (string?), `filename` (string?), `organizationId` (string?) - Returns: `{ id, filename, url, absoluteUrl, category, label, fileSize }` **delete_library_asset** — Delete an asset from your library. - `assetId` (string, required) - Returns: `{ deleted, id, filename }` --- ## AI Prompt Cookbook These prompts work with ChatGPT, Claude, Gemini, or any LLM. Generate the HTML, then paste it at htmlpub.com or publish via the API. ### 1. General Single-Page Website ``` Create a complete, single-file HTML webpage for [YOUR PURPOSE]. Requirements: - All CSS in <style> tags, all JS in <script> tags — one self-contained file - Mobile-responsive with CSS flexbox/grid - Modern, clean design with a professional color scheme - Include a <title> tag with the page name - Use system fonts (system-ui, sans-serif) - Add <meta name="viewport" content="width=device-width, initial-scale=1.0"> The page should include: [DESCRIBE SECTIONS AND CONTENT] ``` ### 2. Portfolio / Personal Site ``` Create a single-file HTML portfolio website for [YOUR NAME], a [YOUR TITLE]. Include these sections: - Hero with name, title, and a brief tagline - About section with bio: [BIO - 2-3 sentences] - Projects grid showing: [PROJECT 1 NAME] - [DESCRIPTION], [PROJECT 2 NAME] - [DESCRIPTION], [PROJECT 3 NAME] - [DESCRIPTION] - Skills section with: [SKILL 1], [SKILL 2], [SKILL 3], [SKILL 4] - Contact section with email: [EMAIL] Requirements: Single HTML file, all CSS in <style> tags, responsive design, dark mode support, smooth scrolling, hover effects on project cards. Use system fonts. Include <title> tag. ``` ### 3. Landing Page / Product Launch ``` Create a single-file HTML landing page for [PRODUCT NAME]. Tagline: [TAGLINE] Description: [ONE-SENTENCE DESCRIPTION] Sections: - Hero with gradient background, headline, subheadline, and CTA button linking to [CTA URL] - Features grid (3 columns): [FEATURE 1], [FEATURE 2], [FEATURE 3] - Social proof / testimonials section - Pricing or final CTA section - Footer with links Requirements: Single HTML file, all CSS/JS inline, responsive, modern design with animations. Include <title> tag and viewport meta. ``` ### 4. Event Invitation / RSVP ``` Create a single-file HTML invitation page for [EVENT NAME]. Details: - Date: [DATE AND TIME] - Location: [VENUE NAME, ADDRESS] - Description: [EVENT DETAILS] - Dress code: [DRESS CODE] Include a countdown timer to the event date, a map placeholder, and event schedule. Make it elegant and festive. Single HTML file, all CSS/JS inline, responsive. Include <title> tag. ``` ### 5. Restaurant / Small Business ``` Create a single-file HTML website for [BUSINESS NAME], a [BUSINESS TYPE] located at [ADDRESS]. Include: - Hero with business name and ambiance photo placeholder - Menu section with categories and items: [MENU ITEMS] - Hours: [HOURS] - Location with address and map placeholder - Contact info: [PHONE], [EMAIL] - Footer Requirements: Single HTML file, all CSS inline, responsive, warm and inviting design. Include <title> tag. ``` ### 6. Resume / CV ``` Create a single-file HTML resume for [YOUR NAME]. Title: [PROFESSIONAL TITLE] Summary: [2-3 SENTENCE SUMMARY] Experience: - [JOB TITLE] at [COMPANY] ([DATES]): [DESCRIPTION] - [JOB TITLE] at [COMPANY] ([DATES]): [DESCRIPTION] Education: [DEGREE] from [SCHOOL] ([YEAR]) Skills: [SKILL 1], [SKILL 2], [SKILL 3] Contact: [EMAIL], [PHONE], [LINKEDIN URL] Requirements: Single HTML file, clean professional design, print-friendly with @media print styles, responsive. Include <title> tag. ``` ### 7. Coming Soon / Waitlist ``` Create a single-file HTML "coming soon" page for [PROJECT NAME]. Description: [WHAT IT IS - ONE SENTENCE] Expected launch: [LAUNCH DATE] Include: - Centered hero with project name and description - Animated countdown timer to launch date - Email signup form (visual only, no backend needed) - Social media links placeholder - Subtle background animation Requirements: Single HTML file, all CSS/JS inline, responsive, modern and minimal. Include <title> tag. ``` ### 8. Documentation / Help Page ``` Create a single-file HTML documentation page for [PRODUCT NAME]. Topics to cover: 1. [TOPIC 1 TITLE]: [BRIEF DESCRIPTION] 2. [TOPIC 2 TITLE]: [BRIEF DESCRIPTION] 3. [TOPIC 3 TITLE]: [BRIEF DESCRIPTION] 4. [TOPIC 4 TITLE]: [BRIEF DESCRIPTION] Include: sidebar navigation, code blocks with syntax highlighting (CSS-only), search placeholder, copy-to-clipboard buttons. Single HTML file, all CSS/JS inline, responsive, clean documentation style. Include <title> tag. ``` ### 9. Photo Gallery / Lookbook ``` Create a single-file HTML photo gallery page titled "[GALLERY TITLE]". Theme: [THEME OR DESCRIPTION] Include: - Masonry or grid layout for image placeholders (use colored placeholder divs with labels) - Lightbox effect on click (CSS/JS inline) - Filter buttons by category: [CATEGORY 1], [CATEGORY 2], [CATEGORY 3] - Smooth animations on hover and transitions Requirements: Single HTML file, all CSS/JS inline, responsive. Include <title> tag. Use placeholder images (solid color blocks with text labels). ``` ### 10. Interactive Calculator or Tool ``` Create a single-file HTML [TOOL NAME] calculator. Description: [WHAT IT CALCULATES] Inputs needed: - [INPUT 1 NAME] ([TYPE: number/text/dropdown]) - [INPUT 2 NAME] ([TYPE]) - [INPUT 3 NAME] ([TYPE]) Calculation logic: [DESCRIBE THE FORMULA OR LOGIC] Include: clean input form, real-time calculation on input change, results display with formatting, responsive design. Single HTML file, all CSS/JS inline. Include <title> tag. ``` --- ## Publishing Workflow ### Free (no account needed) 1. Go to https://htmlpub.com 2. Paste HTML or drop an HTML file 3. Get a shareable URL instantly 4. Pages expire after 7 days ### With API (Pro plan) ```bash # Publish a page curl -X PUT https://htmlpub.com/api/pages/my-page \ -H "Authorization: Bearer hp_live_YOUR_API_KEY" \ -H "Content-Type: application/json" \ -d '{"html": "<!DOCTYPE html><html>...</html>"}' # Response: { "id": "...", "slug": "my-page", "url": "https://htmlpub.com/p/my-page" } ``` ### AI + API automation (Python) ```python import openai, requests # 1. Generate HTML with AI response = openai.chat.completions.create( model="gpt-4o", messages=[{"role": "user", "content": "Create a single-file HTML landing page for..."}] ) html = response.choices[0].message.content # 2. Publish to htmlpub result = requests.put( "https://htmlpub.com/api/pages/my-landing-page", headers={ "Authorization": "Bearer hp_live_YOUR_API_KEY", "Content-Type": "application/json" }, json={"html": html} ) print(f"Live at: {result.json()['url']}") ``` ### MCP (for AI assistants) Connect your AI assistant to `https://mcp.htmlpub.com/mcp` via the Model Context Protocol. OAuth-based auth, no API keys needed. Supports Claude Desktop, Cursor, Windsurf, and other MCP-compatible clients.