WebBuilding

Guide

How to add an MCP connector to Claude, ChatGPT or VS Code (2026)

The short answer

To add an MCP connector, open your AI app's connectors or apps directory, pick the tool, sign in on the company's own site and approve what the AI may do. For a tool that is not listed, paste the company's official server address as a custom connector. Claude Free allows one custom connector and directory connectors need a paid plan; in ChatGPT, full custom MCP with write actions is on Business and Enterprise/Edu. Remove a connector in the AI app and revoke its access at the company.

The words you will see during setup

Setup screens use a handful of terms. Here is what each one means.

  • MCP (Model Context Protocol): the open standard that lets AI apps connect to outside tools. See our MCP connectors guide for the background.
  • Server: what a company publishes so AI apps can work with its product. A remote server lives at a web address, such as https://mcp.webflow.com/mcp. A local server is a program you install on your computer.
  • Client: the AI app that connects, such as Claude, ChatGPT or VS Code.
  • Connector: the finished link between the two. ChatGPT calls these apps.
  • OAuth: the “Sign in with…” screen. You log in on the company’s own site and approve access, and the AI app gets a token instead of your password.
  • API key: a long code you copy from your account dashboard. It works like a password and often grants broad access.
  • Tool approval: the prompt that asks you to allow or deny an action before the AI runs it.

Menu names inside AI apps change often. The steps below follow what each company documents; if a button has moved, the linked help page has the current wording.

Before you start: three checks

  1. Find the official server. Look the tool up in our MCP server list. The address should be on the company’s own domain.
  2. Check your AI plan. Each app limits connectors by plan, as covered below.
  3. Check your role at the company. Many servers follow your normal permissions. Mailchimp, for example, needs an Owner or Admin role, and Salesforce runs as the signed-in user.

How to add an MCP connector in Claude

Claude supports connectors in claude.ai, Claude Desktop and Claude Code. According to Anthropic’s help center, custom connectors (remote MCP servers you add by address) work on Free, Pro, Max, Team and Enterprise, but Free is limited to one. Remote connectors from Anthropic’s directory need a paid plan. On Team and Enterprise, only Owners (and Enterprise custom roles) can add connectors.

Option A: from the connectors directory

  1. Open the Claude connectors directory: in a chat, click the “Search and tools” button at the lower left and select “Add connectors,” or go to Settings, find the Connectors section and click “Browse connectors.”
  2. Find your tool. Notion, Canva and Stripe are listed as remote connectors, and WordPress.com and GoDaddy say they are in it too.
  3. Click the connector, review it, then click “Connect” or “Install.” Claude sends you to the company’s sign-in page.
  4. Log in and approve the access you are comfortable with. Then enable the specific tools you want Claude to use in that conversation.

Option B: a custom connector by address

  1. Copy the server address from the company’s own docs. Do not copy it from a forum or third-party marketplace.
  2. Go to Customize > Connectors, click “+ Add,” then “Add custom connector.”
  3. Enter a name and the server address, then click “Continue.” Confirm the sign-in settings and click “Add.”
  4. Sign in on the company’s site when prompted and approve access.
  5. In a chat, click the “+” button at the lower left, then “Connectors,” and switch on the connector. Review its tools and turn off any write tools you do not want used.

Anthropic notes that custom connectors are not verified by Anthropic, so connect only to servers you trust. The custom connector help article has the current steps.

Desktop extensions

Claude Desktop also offers desktop extensions, which run on your computer. Anthropic says these are open to all plans on Claude Desktop. Figma is one example in the directory.

Research mode skips approvals. Anthropic says that in Research mode Claude can call connector tools without asking again. Turn off write tools you would not want used without a prompt.

How to add an MCP connector in ChatGPT

ChatGPT connects only to remote servers. There are two routes.

Apps and plugins from the directory

OpenAI launched apps in ChatGPT, built on MCP through its Apps SDK, on October 6, 2025, for logged-in Free, Go, Plus and Pro users outside the EEA, Switzerland and the UK. Business, Enterprise and Edu got a preview on November 13, 2025. The ChatGPT apps directory opened to developer submissions on December 17, 2025, and OpenAI reviews apps before listing them. OpenAI’s help center now groups these under Plugins: a plugin can bundle one or more apps.

  1. Select “Plugins” in the ChatGPT sidebar, or open chatgpt.com/plugins, and search for your tool. Webflow, Framer, WordPress.com and Canva are among the companies that list ChatGPT as a supported client.
  2. Select the plugin and review the apps it includes. Select “Install plugin” if shown, then “Connect” for any app that needs sign-in, and sign in on the company’s site.
  3. Approve the access the app asks for. ChatGPT may ask for confirmation before actions, depending on the app’s permissions, and OpenAI blocks some risky actions.

Custom MCP servers in developer mode

To add a server by address, ChatGPT uses developer mode. According to OpenAI’s help article, Business and Enterprise/Edu get full MCP, including write actions, in beta. Pro users can connect MCP servers with read and fetch permissions only. On Business, an admin turns developer mode on under Workspace Settings, Permissions & Roles; on Enterprise and Edu, under Settings, Apps, Advanced Settings. Then go to Apps, select “Create,” enter the server address and sign-in method, click “Scan Tools,” then “Create.” OpenAI warns that connecting to untrusted servers raises the risk of prompt injection, which our safety guide explains.

How to add an MCP server in VS Code

MCP support became generally available in VS Code 1.102 on July 14, 2025, working through GitHub Copilot. If your Copilot seat is on Business or Enterprise, the “MCP servers in Copilot” policy is off by default, and an admin must turn it on first.

  1. Update VS Code to version 1.102 or later.
  2. Open the Command Palette and run “MCP: Add Server.” Choose “HTTP” and enter the company’s server address. You can also open the Extensions view, search for @mcp and select “Install.”
  3. Give the server a name, then choose where to save it: Global for just you, or the workspace to share it with a project.
  4. Review the trust and sign-in prompts before you accept them. Remote servers usually open the company’s sign-in page in your browser.
  5. Approve only tool calls you understand, and leave those prompts on.

Local servers run programs on your computer, so check the exact command before you approve it. The MCP spec says apps must show that command and get your consent before a one-click install. Some local servers have their own needs: Wix’s local mode needs Node.js 19.9.0 or later, and Shopify’s Dev MCP runs with an npx command and needs no login.

Cursor works much the same way. Cursor 1.0, released June 4, 2025, added one-click MCP install and OAuth sign-in. Cursor’s plan requirements for MCP are not stated.

Worked example: connecting Webflow

Webflow is a good test case because its server is remote, uses OAuth, and is included on every site plan. Webflow first announced an official server on April 8, 2025, and MCP 2.0 on July 20, 2026, when it said all site plans get it at no extra cost. Its docs name Claude Code, Claude Desktop, ChatGPT, Codex and Cursor, with setup guides for Windsurf and others.

  1. Get the address from Webflow. Webflow’s how-it-works page gives https://mcp.webflow.com/mcp.
  2. Add it to Claude Desktop as a custom connector. On Claude Free, this uses your one custom connector slot.
  3. Sign in to Webflow and pick a workspace. Each authorization covers one workspace and follows your Webflow roles, so a limited role gives the AI limited access.
  4. Start with a read-only request, such as “List the CMS collections on my site and how many items each has.” CMS here means the content database behind your blog or listings (see CMS).
  5. Try one small edit with approval on, such as drafting a single blog item. Read the tool request before you allow it.
  6. Check the result in Webflow before anything goes live. Webflow’s docs do not say whether the MCP can publish a site, so do not assume it cannot.

Webflow says the server can build and edit pages, components, styles and CMS content, and read site analytics. Page branches, a way to work on a copy of a page much like a staging site, need Enterprise. Our Webflow review covers plans and cost.

Other builders work the same way

  • Framer: address https://mcp.framer.com/mcp, OAuth sign-in. Framer’s help article says it publishes only when you explicitly ask and can work on a branch for review. The Framer MCP launch was October 22, 2026; Framer does not state a plan requirement. See our Framer review.
  • Wix: browser sign-in with your Wix account, and the server can publish sites, so keep approval on. See our Wix review.
  • WordPress.com: available on every WordPress.com site, including free sites, per its support page. Every write, including deletes, asks for confirmation first.

How to remove a connector

Removing a connector takes two steps: one in the AI app and one at the company. Doing only the first can leave access in place.

  1. Disconnect it in the AI app. In Claude, go to Customize > Connectors and click “Remove” or the three dots next to the connector. In ChatGPT, open Settings > Plugins, select the plugin or app, and choose “Disconnect.”
  2. Revoke access at the company. OAuth connections can usually be revoked in the company’s account settings. Stripe lists OAuth sessions in your user settings, and Notion organization owners can revoke members’ connections.
  3. Delete any API key you created for it. A key keeps working until you delete it, even after the connector is gone.
  4. On WordPress, revoke the Application Password. WooCommerce and Elementor connect through WordPress Application Passwords, and Elementor creates one in the background. We build on WordPress every week, and these are listed on each user’s profile screen in the dashboard, where you can revoke them one by one.

On Team or Enterprise plans, remember that a shared API key gives everyone who uses the connector that key’s access. Removing one person does not remove the key.

If the connector will not work

  • You cannot see the directory option in Claude: directory connectors need a paid plan, and on Team or Enterprise only Owners can add them.
  • ChatGPT will not make changes: on Pro, custom MCP servers get read and fetch permissions only.
  • VS Code shows no MCP option at work: your Copilot admin has to enable the policy.
  • Vercel refuses the connection: Vercel lets only approved AI clients connect.
  • Square tests touch real data: Square’s remote server reaches production only; Square suggests testing with its local server in a sandbox first.

Questions people ask

Can I add an MCP connector on Claude's free plan?

Yes, one. Anthropic says Free can add one custom connector by address. Remote connectors from Anthropic's directory need a paid plan, while desktop extensions are open to all plans on Claude Desktop.

Which ChatGPT plans support custom MCP servers?

In developer mode, Business and Enterprise/Edu get full MCP including write actions, in beta. Pro users can connect MCP servers with read and fetch permissions only. ChatGPT connects to remote servers only.

Where do I find a server's address?

In the company's own developer docs, such as https://mcp.webflow.com/mcp for Webflow or https://mcp.framer.com/mcp for Framer. Our MCP server list links each company's docs. Avoid addresses copied from forums or third-party marketplaces.

Do I need to install anything?

Not for a remote server: you click Connect or paste an address, then sign in. Local servers are programs that run on your computer and usually need tools like Node.js, so they suit developers.

Does removing a connector in Claude or ChatGPT cut off access?

It removes the link in the AI app, but you should also revoke the OAuth session or delete the API key at the company. A key keeps working until you delete it.

Web Building

Web Building is an independent US guide to choosing, paying for and moving a website. Our team builds and looks after 150+ WordPress sites. Facts on this page come from each platform’s own pricing pages and help docs, checked and dated. How we research · Editorial policy