> ## Documentation Index > Fetch the complete documentation index at: https://docs.mcpmanager.ai/llms.txt > Use this file to discover all available pages before exploring further. # Add a Connect Button to Your Site > How to put a "Connect via MCP Manager" button on your own site or README so a visitor reaches MCP Manager with your server URL and name already filled in and the connection already discovered — the deep-link URL format and its parameters, ready-to-paste HTML and Markdown snippets, what the visitor sees whether they are signed in, signed out, or have no account yet, the usage rules for the button, and how to debug a link that lands wrong. If you publish an MCP server, you can put a **Connect via MCP Manager** button on your docs, your pricing page, or your README: Connect via MCP Manager, light variant Connect via MCP Manager, dark variant Someone who clicks it arrives with your server's URL and name already filled in and the connection already worked out, so the only thing left for them to do is authorize it. Instead of copying your endpoint out of your docs and pasting it somewhere, they press one button. MCP Manager is where teams connect MCP servers to their AI apps and put governance in front of them — identity, permissions, and audit. Your users may already run it; if they don't, the link still works, and they can sign up on the way through. You need no relationship with us to publish the button, and there is nothing to register. The button is a plain link. No SDK, no script tag, no embed, and nothing that phones home, so it works on any site — including one with a strict content security policy. ## Build your link The link points at MCP Manager's servers page and carries your endpoint as a query parameter: ```text Link format theme={null} https://app.mcpmanager.ai/settings/servers?addRemoteServerUrl=&serverName= ``` | Parameter | Required | What it does | | -------------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `addRemoteServerUrl` | Yes | Your MCP endpoint — the same Streamable HTTP URL a user would paste by hand. Must be `https://` to connect automatically; anything else is pre-filled but waits for a click. | | `serverName` | No | The name your server is listed under once they've added it. Leave it out and MCP Manager falls back to the name your server advertises in its `initialize` response, then its hostname. | | `source` | No | Reserved for attribution — a registry name or your own slug. MCP Manager accepts it and ignores it today. Including it now is safe and future-proof. | Two things worth knowing before you test your own link: * **The parameters disappear from the address bar** once the dialog opens. That is deliberate — it stops a refresh or a back-navigation re-opening the dialog on top of the visitor. Your link is not being rewritten or broken. * **If a parameter appears twice, the first value wins.** `?serverName=Acme&serverName=Acme%20Docs` uses `Acme`. The values are never joined together. **URL-encode both values.** `addRemoteServerUrl` is a URL nested inside a URL, so its `://` and `/` characters must be escaped or the link breaks at the first slash. `serverName` needs encoding for spaces and `&`. In JavaScript that's `encodeURIComponent(value)`; most languages have the equivalent. A worked example, for a server named **Acme Docs** at `https://mcp.acme.com/mcp`: ```text Encoded link theme={null} https://app.mcpmanager.ai/settings/servers?addRemoteServerUrl=https%3A%2F%2Fmcp.acme.com%2Fmcp&serverName=Acme%20Docs ``` ## Copy a snippet Both colour variants are here as complete, self-contained HTML. Pick the one that suits your page, or use the auto-switching form below if your site has both themes. ```html HTML (light) theme={null} Connect via MCP Manager ``` ```html HTML (dark) theme={null} Connect via MCP Manager ``` ```html HTML (follows the visitor's theme) theme={null} Connect via MCP Manager ``` ```markdown Markdown / README theme={null} [![Connect via MCP Manager](https://docs.mcpmanager.ai/images/connect-via-mcp-manager.svg)](https://app.mcpmanager.ai/settings/servers?addRemoteServerUrl=https%3A%2F%2Fmcp.acme.com%2Fmcp&serverName=Acme%20Docs) ``` ```markdown README (follows the reader's theme) theme={null} Connect via MCP Manager ``` ```text Plain link theme={null} https://app.mcpmanager.ai/settings/servers?addRemoteServerUrl=https%3A%2F%2Fmcp.acme.com%2Fmcp&serverName=Acme%20Docs ``` Replace the endpoint and name in every snippet with your own, encoded as above. The first two HTML snippets carry their styling inline, so they inherit nothing from your stylesheet and nothing in it can break them. The third uses a class and a `prefers-color-scheme` media query instead, because an inline `style` attribute can't hold a media query — use it when your page serves both themes, and rename the class if `mcp-manager-connect` collides with anything of yours. In all three the mark is inline SVG, so there is no image request to us and nothing to break if you are offline or behind a proxy. For a README, the plain Markdown badge is the simplest thing that works everywhere. The `` form switches with the reader's theme and is supported on GitHub. Both hotlink the SVG from our docs; you are equally welcome to download either file and serve it from your own domain. | File | Use on | | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | | [`connect-via-mcp-manager.svg`](https://docs.mcpmanager.ai/images/connect-via-mcp-manager.svg) | light backgrounds — gradient mark, white ground | | [`connect-via-mcp-manager-dark.svg`](https://docs.mcpmanager.ai/images/connect-via-mcp-manager-dark.svg) | dark backgrounds — white mark, near-black ground | ## What the visitor sees The add-a-server dialog opens for them, with your endpoint in the URL field and your name in the name field. Nothing has been saved yet. It runs the same discovery it would run if they had pasted your URL themselves: fetching your [RFC 8414](https://datatracker.ietf.org/doc/html/rfc8414) authorization-server metadata and [RFC 9728](https://datatracker.ietf.org/doc/html/rfc9728) protected-resource metadata, and sending an MCP `initialize` request to see what your server asks for. They press one button. Depending on what your server supports, that runs the OAuth flow or takes them to enter a token. **MCP Manager always stops here for a click** — it never saves a server or opens an authorization window on someone's behalf, however the link was built. ### If they don't have an account The link works for someone signed out, and for someone who has never heard of MCP Manager. They're taken to sign in or sign up first, and your server is carried through the whole journey — including single sign-on and accepting terms. They come out the other side at exactly the state above, with your endpoint and name still filled in. This is the part that makes the button worth putting on a public page: you can link to it from anywhere, and a first-time visitor still lands on your server rather than an empty dashboard, with nothing to find their way back to. ## Using the button * Use the wording **Connect via MCP Manager**. Don't reword it to imply a partnership, endorsement, or certification that isn't in place. * Don't recolor, rotate, stretch, or otherwise redraw the mark. Use the light or dark SVG as shipped, or the inline HTML snippet. * Point the link at `https://app.mcpmanager.ai`. A button pointed somewhere else isn't this button. * You don't need our permission, an account, or a partnership to use it. If you operate a registry or a directory and want to generate these links in bulk, that works the same way — the format is stable and documented here. * Link to **your own** server. Don't publish a button that connects visitors to somebody else's endpoint. ## Troubleshooting The endpoint wasn't URL-encoded, so everything after its first `/` was read as part of the outer link. Encode it — see the warning above. Your endpoint isn't `https://`. Discovery runs on our servers rather than in the visitor's browser, so we don't fire a plaintext address supplied by a third-party page without a click — and that includes `localhost`, which from our side means our own infrastructure rather than the visitor's machine. Nothing is blocked: the visitor can still press **Connect**. Publish over HTTPS and the button works end to end. The link is fine — discovery reached your server and didn't find what it needed. That's the same failure a hand-typed URL would hit, so debug it as a server problem. Start with [Debugging self-hosted OAuth](/build-your-own-mcp-server/debugging-self-hosted-oauth) and the troubleshooting catalog in the [overview](/build-your-own-mcp-server/overview). Names are trimmed and capped at 200 characters, and invisible control characters are stripped. If `serverName` is empty after that, MCP Manager falls back to the name your server advertises in its `initialize` response, then to its hostname. ## Further reading The two things any server must do to work behind MCP Manager, and the troubleshooting catalog for when one doesn't. The dynamic-client-registration failure that trips up multi-instance deployments. What your users are actually adding when they press your button, and the three ways it can authenticate. Which authentication method to support, from the perspective of the server you operate.