# Create a landing page with GitHub Copilot in VS Code

> Use Copilot's VS Code agent with Pageree. Configure workspace MCP tools, build a focused page, review changes, and troubleshoot missing tools or enquiries.

- Canonical: https://pageree.com/guides/github-copilot-landing-page/
- Published: 2026-09-15. Updated: 2026-09-15.
- Collection: Guides (https://pageree.com/guides.md)
- Site index for agents: https://pageree.com/llms.txt

**The short answer.** Configure Pageree in VS Code's workspace MCP file and enable its tools in the Copilot agent conversation. This guide covers that IDE surface, with separate checks for server access, page preview, publication, and final form delivery.

## Use Copilot's agent in VS Code

GitHub Copilot can help build a landing page in a VS Code workspace and use MCP tools to connect that work to a publishing service. This guide covers **Copilot in VS Code**. It does not assume the same setup applies to GitHub.com's assistant, Copilot CLI, or other Microsoft products with Copilot in their name.

The workflow is documentation-based, reviewed on September 15, 2026. Your editor version, Copilot access, and organization policy determine which tools are available. No live account connection or customer form submission was performed for this article.

## Configure the server in the workspace

Open the project you want to use for the campaign. Add the following entry to `.vscode/mcp.json`, preserving any existing servers:

```json
{
  "servers": {
    "pageree": {
      "type": "http",
      "url": "https://mcp.pageree.com/"
    }
  }
}
```

Use the Command Palette's **MCP: List Servers** to inspect Pageree, start it if necessary, and complete authentication. Enable the relevant tools in the agent conversation. VS Code documents server management, restart behavior, and organization controls in [Add and manage MCP servers](https://code.visualstudio.com/docs/agent-customization/mcp-servers); GitHub's [Copilot MCP instructions](https://docs.github.com/en/copilot/how-tos/provide-context/use-mcp-in-your-ide/extend-copilot-chat-with-mcp) explain the IDE workflow.

Ask the agent to read your Pageree account and list pages. This should produce an actual tool response. If the server is configured but absent from chat, check whether it is disabled, waiting for authentication, blocked by policy, or excluded from the current tool selection. Restart the server after changing configuration rather than repeatedly regenerating the page.

## Give the workspace a complete brief

For an illustrative campaign, imagine a small firm offering accessibility-focused content reviews. The page should invite a discussion about scope without claiming a compliance certification or guaranteed result.

```text
Create a landing page for our website content review service in this workspace.
Audience: small-business owners who want clearer, easier-to-use website content.
Offer: a review of selected pages with practical copy and structure recommendations.
Goal: a project enquiry, not a certification or automatic audit report.
Read the approved brief and assets. Ask for missing facts and genuine experience.
Do not invent qualifications, legal assurances, testimonials, or results.
Follow Pageree's current page, form, privacy, assets, and publishing instructions.
Produce a single HTML document with inline styles and scripts and hosted images.
Collect name, email, website URL, and the pages they want reviewed.
Ask for the chosen slug and destination inbox. Save a private preview.
Retain the returned page ID for later edits and wait for publication approval.
```

Review the agent's proposed structure before it spends time on decorative sections. A focused promise, a clear process, genuine proof, and an understandable enquiry are more useful than generic feature cards. The [consultation template](https://pageree.com/templates/consultation-landing-page/) shows another way to organize a service conversation.

## Review changes in the editor, then in the browser

Use VS Code's file changes view to inspect what the agent wrote. Confirm it did not modify unrelated project files or turn the campaign into a larger application. Check that local image paths have been replaced with hosted URLs and that separate CSS or JavaScript dependencies are handled for the single-file output.

Open the private preview and inspect it directly. Test a narrow layout, long field values, keyboard navigation, and the form's required-field messages. The agent may have access to a browser tool, but it should report the checks it actually performed rather than claim a visual review from source inspection alone.

After approving the preview, publish and open the returned public URL. Send a clearly marked test from an address you control and verify the destination receipt. See [form troubleshooting](https://pageree.com/guides/ai-contact-form-not-working/) if the browser and inbox disagree.

## Make later work recoverable

Store the page identity in the workspace so another agent session can find it. Before editing, ask Copilot to check page information and retrieve the current stored source. If an open draft exists, decide whether to continue it before replacing it.

Ask for a specific change, save it as a draft on the same page ID, and review before publication. Record the reason in the changelog. If a published change causes a problem, inspect the available versions and use the [recovery guide](https://pageree.com/guides/undo-ai-website-changes/) rather than recreating the page under a second URL.

## Related
- [Build and publish a landing page with OpenCode](https://pageree.com/guides/opencode-landing-page.md): Connect OpenCode v2 to Pageree using the current MCP structure. Build static HTML, review the preview, publish, and retain the page ID for future updates.
- [Build and publish a landing page with Claude Code](https://pageree.com/guides/claude-code-landing-page.md): Connect Claude Code to Pageree, build reviewable single-file HTML, publish an approved preview, and preserve the page identity for later edits.
- [Update a live landing page with your AI assistant](https://pageree.com/guides/update-live-landing-page-with-ai.md): Change an existing page without losing its URL or working enquiry form. Read the current source, handle open drafts, review changes, and publish a new version.

## Build it with your agent

Pageree is an MCP server. Add https://mcp.pageree.com/ to an MCP client that supports Streamable HTTP and OAuth, sign in, and the agent can build, publish and measure the page. Setup for every supported client: https://pageree.com/docs.md. Sign up: https://console.pageree.com/signup.