# Landing Pages

> Create, edit, and publish landing pages using AI - clone from your website, start from a template, or build from scratch.

Source: https://docs.graph8.com/studio/landing-pages/

Landing Pages let you create branded, conversion-focused pages in minutes — clone your existing website, pick a layout, or generate one with AI. Pages publish to a live URL with one click.

## Lifecycle: Create → Drafts → Publish

Landing pages live under **Studio → Content → Landing Pages** and follow a three-stage lifecycle. Each stage is its own tab so you always know where a page is.

| Stage | What's there | What you do |
|-------|--------------|-------------|
| **Create** | Layout catalog, prompt input, clone-URL | Start a new page from a layout, prompt, or URL |
| **Drafts** | Pages in progress, fully editable | Edit, iterate, run AI Review, finalize |
| **Publish** | Finalized + live pages | Publish, unpublish, swap versions, manage live URLs |

A page moves from **Create** → **Drafts** when you start it, and from **Drafts** → **Publish** when you click Publish for the first time.

## Create

Open **Studio → Content → Landing Pages → Create** to start a new page. There are three creation paths:

### Pick a Layout

1. Browse the layout catalog — cards show preview thumbnails for each archetype (Demo, Lead Magnet, Product Launch, Event, Free Trial, etc.)
2. Click a layout card — graph8 builds a draft using your brand's design tokens, colors, and fonts
3. Your selection auto-saves so the catalog "remembers" what you most recently picked across sessions

Takes 30–60 seconds. Uses credits.

### Generate from a Prompt

1. In the Create tab, write a custom prompt (e.g., "Demo request page for enterprise buyers in fintech")
2. graph8 generates a full page tailored to your prompt and brand
3. Page lands in **Drafts** for editing

Takes 30–60 seconds. Uses credits.

### Clone Any URL

1. Enter any web page URL (your homepage or a competitor's page)
2. graph8 captures the layout, styles, and structure
3. The cloned page appears in **Drafts** with your branding overlaid

Takes 10–30 seconds. Works with most public websites. Logo hygiene runs automatically — AI-invented logos are stripped and replaced with your brand assets.

## The Editor

The landing page editor is a three-column layout:

| Column | What It Contains |
|--------|------------------|
| **Left** | Page library, section navigator, image browser |
| **Middle** | Live page canvas - click any element to edit |
| **Right** | AI chat panel and editing tools |

### Editing Text

Click any text element on the canvas to edit it inline. Type directly to replace content.

### AI-Powered Editing

**Highlight-to-chat:** Select any text on the page, then type instructions in the chat panel. AI rewrites the selected text while keeping your brand voice.

**Section-level edits:** Click a section header, then describe changes in chat. AI can rewrite entire sections, change layouts, or adjust messaging.

### Managing Images

Click the **Images** tab in the left panel to open the image browser:

- Browse images extracted from your website
- Upload new images
- Filter by category (hero, product, team, logo, icon)
- Click any image to place it on the page

Images automatically match your brand's design tokens.

### Section Management

Each page is built from sections (hero, features, testimonials, CTA, footer, etc.). Use the section navigator in the left panel to:

- Reorder sections by dragging
- Show or hide sections
- Add new sections from templates

### Interactive Feature Cards

When the AI generates a page with a "Features" or "Why Us" section, repeated card content is automatically upgraded into an **interactive tabs** layout — a tab strip with one tab per feature, content switching on click. This is more compact than stacked static cards and reads better on mobile.

You can revert to static cards in the section settings if you prefer the longer scroll layout.

## AI Review

AI Review checks a draft for conversion, accessibility, and brand-consistency issues, then offers a one-click fix for each finding.

### Running a Review

1. Open a draft and click **AI Review** in the toolbar
2. The review panel opens on the right with findings grouped by category (conversion, accessibility, brand, content quality)
3. Each finding shows severity (critical / warning / info), what's wrong, and a suggested fix
4. Click **Fix with AI** on a finding to apply the suggested change automatically
5. Or click **Fix with AI** at the panel level to apply all suggestions in one pass

AI Review is also available on saved templates from the **Templates** view (under Brand Kit), so you can audit reusable layouts before reps pull them into campaigns.

### What Gets Reviewed

| Category | Examples |
|----------|----------|
| **Conversion** | CTA placement, form length, value-prop clarity |
| **Accessibility** | Color contrast, alt text presence, heading order |
| **Brand** | Voice consistency, off-brand colors, missing logo |
| **Content quality** | Placeholder text left over, broken links, ambiguous copy |

The reviewer pipeline includes URL safety guards — `javascript:` URLs and HTML injected into text fields are blocked at the schema layer, so AI fixes can't introduce unsafe content.

## Saving and Versions

Pages auto-save on every edit. View the full version history:

1. Click the **History** icon in the toolbar
2. See a timeline of all changes
3. Click any version to preview it
4. Click **Restore** to revert to that version

Chat history is preserved alongside versions, so you can see what AI edits were made and why.

## Publishing

Publish your page to a live URL:

1. Click **Publish** in the top toolbar
2. graph8 deploys the page to Cloudflare Pages
3. Your live URL appears: `https://g8-lp-{org-id}.pages.dev/{page-slug}`
4. Share the URL or embed it in campaigns

**Updating a published page:** Make edits in the editor, then click **Publish** again. Changes go live immediately.

**Unpublishing:** Click the publish menu and select **Unpublish** to take the page offline.

> **Tip:**
> Connect a custom domain for branded URLs. Contact your admin to configure DNS for your Cloudflare Pages deployment.

## Linking to Campaigns

Connect landing pages to campaigns for tracking and attribution:

1. Open a campaign in **Studio → Campaigns**
2. In the campaign dashboard, click **Add Landing Page**
3. Select an existing page or create a new one
4. The page is now linked - visits are attributed to that campaign

You can also link pages during creation by selecting a campaign from the landing page editor.

## Drafts

The **Drafts** tab is your in-progress library. Pages stay here until you publish them.

- Search and filter drafts by name or layout
- Duplicate a draft to A/B test variations
- Delete drafts you no longer need
- Promote a polished draft to a reusable **template** in the Brand Kit (see [Brand Kit](https://docs.graph8.com/studio/global/#brand-kit))

## Publish

The **Publish** tab manages your live pages.

- See all currently-published pages with their live URLs
- Unpublish to take a page offline (the URL stops resolving but the draft is preserved)
- Swap versions — bring a different draft live without changing the URL
- Search by published URL, slug, or campaign association

## Advanced Features

### Export HTML

Download the page as a standalone HTML file for hosting on your own infrastructure.

### Edit Raw HTML

Switch to code view to make direct HTML/CSS edits for fine-grained control.

## Best Practices

- **Start from your homepage clone** - this ensures perfect brand consistency
- **Keep forms above the fold** - visitors should see the CTA without scrolling
- **Use one clear CTA per page** - avoid competing actions
- **Test before sharing** - preview the published URL on mobile and desktop
- **Link to campaigns** - always connect pages to campaigns for attribution tracking

## Troubleshooting

| Issue | Fix |
|-------|-----|
| Clone captures wrong styling | Try cloning again - the capture depends on page load timing |
| Published URL not loading | Check that your org has Cloudflare credentials configured (contact admin) |
| Images not showing | Verify images are uploaded to the image browser, not just linked externally |
| AI edits not matching brand | Ensure your Global Context documents are generated (go to **Studio → Global**) |

## Related

- [Campaigns →](https://docs.graph8.com/studio/campaigns/) - Create campaigns and link landing pages
- [Global Context →](https://docs.graph8.com/studio/global/) - Generate the brand intelligence that powers AI editing
- [Content →](https://docs.graph8.com/studio/content/) - Manage all content including landing pages
