DEV Community

Custodia-Admin
Custodia-Admin

Posted on • Originally published at pagebolt.dev

How to Use the PageBolt MCP Server in Claude Desktop

#mcp #claude #aiagents #setup

How to Use the PageBolt MCP Server in Claude Desktop

Claude Desktop is a standalone AI application with direct access to your computer and the web. With the PageBolt MCP server, Claude can take screenshots, generate PDFs, and record videos—all from natural language prompts.

Instead of writing API calls, you ask Claude:

  • "Take a screenshot of example.com"
  • "Generate a PDF from this HTML"
  • "Record a video of me signing up for this service"

Claude handles the rest.

What Is MCP?

MCP (Model Context Protocol) is a standard for connecting AI models to external tools. PageBolt publishes an MCP server that Claude Desktop can call directly.

Think of it as giving Claude superpowers: instead of just analyzing screenshots, Claude can take them.

Step 1: Get Your API Key

  1. Go to pagebolt.dev and sign up (free, 100 requests/month)
  2. In your account dashboard, copy your API key
  3. Keep it handy—you'll need it in 2 minutes

Step 2: Find Your Claude Desktop Config File

Claude Desktop stores its configuration in a JSON file. The location depends on your OS:

macOS:

~/.claude/mcp.json
Enter fullscreen mode Exit fullscreen mode

Windows:

%APPDATA%\Claude\mcp.json
Enter fullscreen mode Exit fullscreen mode

Linux:

~/.claude/mcp.json
Enter fullscreen mode Exit fullscreen mode

If the file doesn't exist yet, you'll create it in the next step.

Step 3: Add PageBolt to Your Config

Open the config file (or create it if it doesn't exist) and add:

{
  "mcpServers": {
    "pagebolt": {
      "command": "npx",
      "args": ["@pagebolt/mcp"],
      "env": {
        "PAGEBOLT_API_KEY": "your_api_key_here"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Important: Replace your_api_key_here with your actual API key from step 1.

Save the file.

Step 4: Restart Claude Desktop

Close Claude Desktop completely and reopen it. Claude needs to restart to load the MCP server.

You'll see a small icon in the bottom-right corner of Claude's window (looks like a wrench and dots). This indicates that MCP tools are connected and ready.

Step 5: Use PageBolt via Chat

Now you can ask Claude to take screenshots and generate PDFs. Try these prompts:

Take a Screenshot

You: "Take a screenshot of google.com"

Claude:

I'll take a screenshot of Google's homepage for you.
[Screenshot captured]
Enter fullscreen mode Exit fullscreen mode

Claude returns the screenshot and can analyze it, answer questions about it, or suggest changes.

Generate a PDF

You: "Convert this HTML to PDF:

Invoice #001

Total: $99.99

"

Claude:

I'll generate a PDF from that HTML for you.
[PDF generated and saved]
Enter fullscreen mode Exit fullscreen mode

The PDF is saved to your current working directory or wherever Claude has file access.

Record a Video

You: "Record a video of me navigating to example.com, clicking the sign-up button, and filling in the email field."

Claude:

I'll record that workflow for you.
[Video recorded: example_signup.mp4]
Enter fullscreen mode Exit fullscreen mode

Claude records the multi-step interaction and saves it as an MP4.

Common Workflows

1. Website Monitoring

Prompt: "Take a screenshot of my company's status page daily at 9am and alert me if anything looks different."

Claude can integrate with your calendar or scheduling system to monitor pages and detect visual changes.

2. Document Generation

Prompt: "Generate a PDF invoice from this template with customer data filled in. Use Arial font, add a logo, and email it to the customer."

Claude handles the PDF generation, styling, and can integrate with email automation.

3. Visual Testing for AI Agents

Prompt: "Record a video of my automated workflow: log into the dashboard, approve 3 pending requests, and export the results. Narrate each step."

Perfect for documenting AI agent actions and proving they completed correctly.

4. Demo Video Creation

Prompt: "Record a narrated video walking through my SaaS product's onboarding flow. Use a professional voice and add click effects."

Claude can generate polished demo videos without manual recording or editing.

Troubleshooting

"MCP tool not found" error:

  • Restart Claude Desktop completely (close all windows)
  • Check that your API key is correct in mcp.json
  • Verify the file is in the right location for your OS

"API key invalid" error:

  • Go to pagebolt.dev/account and verify your key
  • Copy it again (sometimes copy-paste issues occur)
  • Update mcp.json and restart Claude

"Screenshot/PDF failed" error:

  • Check that you have remaining API credits (free plan: 100/month)
  • Verify your internet connection
  • Try a simpler request (e.g., "Take a screenshot of example.com")

Videos aren't recording:

  • Video recording requires 3 API credits per video
  • Ensure you have credits available
  • Verify the URL/steps are valid

What You Can Build

With PageBolt in Claude Desktop, you can automate:

  • Visual regression testing — detect UI changes automatically
  • Documentation generation — create screenshots and PDFs on demand
  • AI agent audit trails — record video proof of agent actions
  • Demo videos — auto-generate product walkthroughs
  • Website monitoring — visual snapshots for compliance/monitoring
  • Report generation — combine screenshots, PDFs, and narration

All from natural language—no API coding required.

Next Steps

  1. Install PageBolt MCP — follow the 5 steps above
  2. Try a simple request — "Take a screenshot of example.com"
  3. Explore workflows — ask Claude what it can do with PageBolt
  4. Upgrade if needed — free tier is 100 requests/month; Growth plan ($49) unlocks 10,000/month

For advanced examples, see:

Ready? Sign up free at pagebolt.dev — no credit card required.

Top comments (0)