Make your WordPress site agent-ready with WebMCP

An AI agent in a visitor’s browser can already use your WordPress site the hard way: read the page, guess which box is which, click and hope. WebMCP lets the page tell the agent what it can do there, with a schema for every input. Making a site agent-ready means describing the few jobs visitors actually come to do.

This is no longer a lab idea. On October 21, 2026 Commerce.com and Cloudflare switched WebMCP on by default for eligible BigCommerce storefronts, so shoppers’ agents can search products and manage a cart there. On WordPress nobody does it for you, but the work is small: on most sites it is a contact or quote form, a site search and, on a shop, a catalogue filter. Allow an afternoon on a staging site.

What do you need before you add WebMCP to WordPress?

You need a Chrome that exposes WebMCP, a staging site and a short list of jobs. WebMCP is still a proposal, available in Chrome through an origin trial that started in Chrome 149; my introduction to WebMCP on forms explains the idea.

• Chrome with WebMCP on. Locally, open chrome://flags/#enable-webmcp-testing, set it to Enabled and relaunch. For real visitors, register your origin for the trial; adding the origin trial token to WordPress covers that.
• Chrome’s Model Context Tool Inspector extension, which lists a page’s tools and runs them by hand or with Gemini (Gemini needs an API key).
• Three jobs at most. Contact us, search the site, find a product: one tool each.

One change to know first. On October 8, 2026 the WebMCP spec dropped its declarative section (the form attributes) to focus on the JavaScript API, document.modelContext.registerTool(). The pull request says declarative WebMCP is “still being explored” in a separate explainer, and Chrome’s documentation still describes the attributes. So add them, but treat forms as the part most likely to change and test in the current Chrome. Guides that use navigator.modelContext or provideContext() are out of date.

How do you turn a WordPress form into a WebMCP tool?

Add toolname and tooldescription attributes to the form element. Chrome builds the input schema from the fields, and toolparamdescription on a field describes it more precisely than its label. The cleanest place to add the attributes on WordPress is your form plugin’s filter, not the theme template.

1. Pick a name and write the description. Use letters, digits and underscores, and say when to use the tool. It works if a stranger to the site would know when to call it.
2. Add the attributes through your form plugin. Contact Form 7 adds whatever wpcf7_form_additional_atts returns to the form tag. In a small plugin or child theme’s functions.php:

add_filter( 'wpcf7_form_additional_atts', 'mysite_webmcp_contact_form' );
function mysite_webmcp_contact_form( $atts ) {
	$form = wpcf7_get_current_contact_form();

	// Only the contact form. Use your form's ID from Contact > Contact Forms.
	if ( ! $form || 123 !== $form->id() ) {
		return $atts;
	}

	$atts['toolname']        = 'contact_site_owner';
	$atts['tooldescription'] = 'Sends a message to the site owner. Use it when the visitor wants to ask a question or request a call back. Needs a name, an email address and the message.';

	return $atts;
}

3. Use the matching hook in other plugins. In Gravity Forms, gform_form_tag_5 (for form 5) passes the form tag as a string, so add the attributes to it. In WPForms, wpforms_frontend_form_atts passes an array; set $atts['atts']['toolname'] and check $form_data['id']. In a hand-written form, type them into the <form> tag.
4. Give every field a real label. A field with only a placeholder reaches the agent undescribed. View the source and check the form tag carries both attributes.

How do you add other WebMCP tools to a WordPress site?

Register them with document.modelContext.registerTool() in a JavaScript file loaded by a small plugin. That suits jobs that are not one form: site search, catalogue filters, availability checks. My origin trial post has a search tool; here is a read-only WooCommerce catalogue filter using the Store API.

/* A read-only WebMCP tool that filters a WooCommerce catalogue. */
( async () => {
	const modelContext = document.modelContext;
	if ( ! modelContext || typeof modelContext.registerTool !== 'function' ) {
		return; // No WebMCP in this browser. The page works as before.
	}

	try {
		await modelContext.registerTool( {
			name: 'find_products',
			description: 'Find products in this shop by keyword, category and highest price. Returns up to ten products with price, stock and link.',
			inputSchema: {
				type: 'object',
				properties: {
					keyword: { type: 'string', description: 'Words to search for, such as "cordless drill"' },
					category: { type: 'string', description: 'A product category slug from this shop, such as "power-tools"' },
					maxPrice: { type: 'number', description: 'Highest price in the shop currency, such as 150' },
				},
			},
			annotations: { readOnlyHint: true },
			async execute( { keyword, category, maxPrice } ) {
				const url = new URL( '/wp-json/wc/store/v1/products', location.origin );
				url.searchParams.set( 'per_page', '10' );
				if ( keyword ) url.searchParams.set( 'search', keyword );
				if ( category ) url.searchParams.set( 'category', category );
				// The Store API takes prices in the smallest unit: cents for dollars.
				if ( maxPrice ) url.searchParams.set( 'max_price', String( Math.round( maxPrice * 100 ) ) );

				const response = await fetch( url );
				if ( ! response.ok ) {
					throw new Error( 'Product search failed with status ' + response.status );
				}

				const products = await response.json();
				return products.map( ( p ) => {
					const price = Number( p.prices.price ) / 10 ** p.prices.currency_minor_unit;
					const stock = p.is_in_stock ? 'in stock' : 'out of stock';
					return `${ p.name }, ${ price } ${ p.prices.currency_code }, ${ stock }: ${ p.permalink }`;
				} ).join( '\n' ) || 'No products match.';
			},
		} );
	} catch ( error ) {
		console.warn( 'WebMCP tool not registered:', error );
	}
} )();

1. Save the file in a small plugin and load it with wp_enqueue_script() on the wp_enqueue_scripts hook, only on the pages that need it (here, is_shop() || is_product_taxonomy()). A plugin survives a theme change, and registering tools only where they make sense keeps the agent’s list short. It works if the file appears in the source of shop pages only.
2. Mark tools that act, not just read. For a booking or quote request, set consequentialHint: true instead of readOnlyHint. Chrome’s documentation says this lets agents and browsers ask the person for confirmation before the tool runs. (The example assumes pretty permalinks.)

What are the common WebMCP mistakes on WordPress?

Most of them come from handing the agent too much, or hiding the tools from it by accident.

• Turning on toolautosubmit for forms that contact people. Without it the agent fills the form and the person presses Send.
• Registering a name twice. A script enqueued twice, or two forms with the same toolname on one page, leaves you with a failed registration and a tool short.
• Letting a performance plugin delay the script. Holding JavaScript back until the first click leaves the agent a page with no tools. Exclude the file.
• Dropping the feature check. Keep the document.modelContext test so browsers without WebMCP never see an error.
• Vague descriptions. Say what the tool does, what it needs and what it returns.

How do you test WebMCP on a WordPress site?

Test it in the browser console, in Chrome’s inspector extension, in Lighthouse and in a browser without WebMCP.

1. Check the console. typeof document.modelContext should print “object”, and await document.modelContext.getTools() should list your tools.
2. Run each tool in the Model Context Tool Inspector. Call it by hand, then ask Gemini something like “find a drill under 150 dollars”. If it picks the wrong tool, rewrite the description.
3. Run Lighthouse with Agentic Browsing ticked. The WebMCP audits should list your tools and stop flagging the forms you described.
4. Open the page in a browser without WebMCP. Nothing should change for a person.

Start with the form that matters most, add one read-only tool, and revisit both when Chrome updates its WebMCP documentation. The jobs your visitors come to do will not change much; the API around them still might. While you are at it, check what AI crawlers can see on your pages.