How do I add a WebMCP tool to my site in ten minutes?

Pick the action

Search the catalogue, check availability, look up an order status, get a quote. One tool, the thing a person asks about most. A tool that reads is safe to expose without confirmation; a tool that books or buys needs a human step, and the specification's own threat model is the reason.

Register it

Name it in the permitted character set, describe what it returns and when to prefer it, type every input property with a description, and mark it read-only. The execute function calls the endpoint your site already has.

await navigator.modelContext.registerTool({
  name: "add_to_cart",
  description: "Add a product to the cart by SKU.",
  inputSchema: { type: "object", properties: { sku: { type: "string" }, qty: { type: "integer" } }, required: ["sku"] },
  execute: async ({ sku, qty }) => { /* your code */ },
});

Or annotate a form

If the action already exists as a form, the declarative route needs no JavaScript at all: a toolname and a description on the form, and the browser derives the schema from the fields you already ship. Attribute names are still settling in the specification; check the current text before rolling it out widely.

<form toolname="request_quote" tooldescription="Request a quote for a product and quantity." action="/quote" method="post">
  <label for="sku">Product</label><input id="sku" name="sku" required>
  <label for="qty">Quantity</label><input id="qty" name="qty" type="number" min="1" required>
  <button type="submit">Request quote</button>
</form>

Ship, then measure

Add the polyfill so the API exists where the browser has not shipped it, deploy, and run the readiness check on webmcp-tool.com to see the tool recognised. With the Agent Tracking snippet on the page, the Tools view shows calls, duration, success rate and errors from the first agent onward, which is the only way to know whether the description works.

<script defer data-domain="example.com" src="https://agenttracking.co/agent.js"></script>

In short