MCP Information

What is MCP?

Model Context Protocol (MCP) is a standardized way for AI tools and web applications to securely communicate with content management systems. It allows Webpifier to send optimized images directly to your CMS without the need to download and re-upload them manually.

How MCP Works

MCP integration works through a secure API connection between Webpifier and your CMS or automation platform:

Setting Up Webflow MCP Integration

Follow these steps to connect Webpifier to your Webflow site:

1. Get your Webflow API Key

   • Log in to your Webflow account
   • Go to Account Settings → Integrations tab
   • Generate a new API key with read/write permissions

2. Find your Site ID

   • In your Webflow Dashboard, select your site
   • Go to Site Settings → General
   • Copy your Site ID from the info panel

3. Find your Collection ID (for uploads to a specific collection)

   • Go to your Webflow Designer
   • Open the CMS Collections panel
   • Select the collection you want to upload to
   • The Collection ID is in the URL: webflow.com/design/[site-name]?t=published&collection=[collection-id]

4. Configure MCP in Webpifier

   • Click the MCP icon in the Webpifier navigation
   • Select "Webflow MCP" as the server type
   • Enter your API Key, Site ID, and Collection ID
   • Click "Connect" to test the connection

Setting Up Zapier MCP Integration

Zapier MCP allows you to send compressed images to hundreds of platforms through Zapier's automation workflows:

1. Create a Zapier Account

   If you don't already have one, sign up at zapier.com

2. Create a Webhook Zap

   • In Zapier, create a new Zap
   • Choose "Webhooks by Zapier" as the trigger app
   • Select "Catch Hook" as the trigger event
   • Set up the webhook and copy the provided webhook URL

3. Configure the Action

   • Choose your destination app (WordPress, Shopify, Contentful, etc.)
   • Select the appropriate action (e.g., "Upload Media" or "Create Asset")
   • Map the incoming data from the webhook to the fields required by your action

4. Configure MCP in Webpifier

   • Click the MCP icon in the Webpifier navigation
   • Select "Zapier MCP" as the server type
   • Paste your Zapier webhook URL in the Server URL field
   • Click "Connect" to test the connection

Setting Up Custom MCP Server

For developers and advanced users, you can set up your own custom MCP server:

1. Create an MCP-compatible Endpoint

   Your endpoint should accept POST requests with multipart/form-data containing the image file

2. Configure Authentication

   Implement secure authentication for your endpoint (API key, OAuth, etc.)

3. Configure MCP in Webpifier

   • Click the MCP icon in the Webpifier navigation
   • Select "Custom MCP Server" as the server type
   • Enter the full URL to your MCP endpoint
   • Click "Connect" to test the connection

{
  "success": true,
  "url": "https://your-cms.com/assets/compressed-image-12345.webp",
  "id": "asset_12345",
  "metadata": {
    "width": 1200,
    "height": 800,
    "format": "webp",
    "size": 62145
  }
}

Using MCP for Image Uploads

Once you've configured your MCP connection, using it to upload images is simple:

1. Compress your images as usual

   Upload and optimize your images with your preferred settings

2. Use the MCP upload option

   For each compressed image, you'll see an "Upload to CMS" button alongside the download button

3. Confirm the upload

   Click the button to send the image directly to your connected CMS

4. View confirmation

   You'll receive a success message with a link to view the image in your CMS

Advanced MCP Features

MCP integration offers several advanced features for power users:

Troubleshooting MCP Connections

If you encounter issues with your MCP connection, try these solutions:

MCP Security Best Practices

When using MCP to connect to your content systems, follow these security best practices:

• Use read-scoped API keys when possible

  If you only need to read data from your CMS, use a read-only API key.

• Create dedicated API keys

  Create specific API keys for Webpifier rather than using your master key.

• Regularly rotate credentials

  Change your API keys periodically for enhanced security.

• Use private devices

  Avoid configuring MCP on public or shared computers.

• Clear browser data

  If you're on a shared device, clear your browser's local storage after use.

• Monitor activity

  Regularly check your CMS logs for any unexpected activity.