Titan Shutters on Payload CMS

Why we built this

Not a mockup

This is your real homepage content running on Payload CMS, with a working editor behind it and AI capabilities you can use today. You did not ask us to build this, and no decision is assumed — we took your heads-up as a prompt to test whether Titan’s site would genuinely run on Payload, so that if you do go ahead you are deciding on evidence rather than estimates.

The site

Your homepage, served from Payload

Full-bleed hero slider, journey steps, product columns, reviews and contact — matched to your current design system, typography and brand colours.

Hero slider · three slides, your imagery, auto-advancing

Your journey with us · rebuilt to the same specification as your live theme

Reviews · clearly labelled sample content, see the migration section below

Contact · your real phone number and trading hours, pulled from WordPress

The editor

A working CMS, not a static page

Your team logs in and edits, exactly as they do now. Changes appear on the site immediately — no developer, no redeploy.

Page editor · sections you can add, reorder and remove, mirroring your ACF flexible content

The AI layer

Three things AI does on the site itself

One click writes the page title, meta description and an AI summary from the page’s own content

On-site assistant — answers only from CMS content, so it cannot invent product claims

/llms.txt — a machine-readable summary of the site, generated from the CMS, for ChatGPT, Perplexity and Google AI Overviews

Edit the site from Claude

No CMS login required

Claude can read and update this site’s content directly, using the Model Context Protocol (MCP) — an open standard for connecting AI assistants to real tools and data. This uses the official Payload MCP plugin, so it is talking to the same content the CMS edits, not a copy.

What it can do

• Read and update any page’s content and layout
• Read and update site settings — navigation, footer, phone number, assistant copy
• Read the media library

Deleting is switched off everywhere. An assistant should never be able to remove a live page or image.

Set it up in Claude Desktop

1. Generate an API keyin /admin → API Keys, create a new one, enable it, tick the scopes you want, save, then copy the key — Payload only shows it once
2. Open your Claude Desktop configSettings → Developer → Edit Config
3. Add the Titan serverpaste the block below, keeping any other servers already there, and swap in your key
4. Restart Claude Desktop fullyquit from the system tray too, not just the window
5. Start a new chat and try it“Using the titan tools, show me the current site settings for Titan Shutters”

{
  "mcpServers": {
    "titan": {
      "command": "npx.cmd",
      "args": [
        "-y",
        "mcp-remote",
        "https://payload-cms-rho-lake.vercel.app/api/mcp",
        "--header",
        "Authorization: Bearer <your generated API key>"
      ]
    }
  }
}

How we did it

The migration is a script, not a retyping exercise

We wrote a bridge that reads your WordPress content directly and outputs it in Payload’s format — one rule per section type. Adding a new page means adding a rule, not starting again.

1. Read WordPressthe script loads your site and reads the ACF flexible content on any page
2. Translate each section typebanner, journey, two column, reviews, contact — each has its own rule
3. Move the mediaimages are pulled from the live site and re-hosted, keeping the original WordPress ID
4. Load into Payloadcontent, images, navigation, logo and phone number, placed automatically

Your Google reviews render client-side via a third-party widget, so there is nothing stored in your database to move — the demo shows clearly labelled sample reviews. A production build would sync the Google Business Profile API into the CMS on a schedule.

Scope and technology

What is built, and what a real migration involves

Built

• Homepage with five content sections, fully editable
• Content management system with user login
• AI drafting, on-site assistant, machine-readable output for AI search
• Direct content editing from Claude via MCP
• Automated migration script, extendable to every other page type

Deliberately not built

• All other page types and templates
• Gravity Forms and the Microsoft Dynamics CRM connection
• Embedded Power BI reporting
• The 360 degree product viewer
• Site search, redirect map, and existing SEO history
• Performance and caching layer, currently NitroPack and WP Rocket