HTML Ad Generator MCP Server

An MCP (Model Context Protocol) server that generates populated HTML ad templates from JSON input. Provides separate tools for Google Ads and Meta (Facebook) Ads.

Features

- Separate Tools: Dedicated tools for Google Ads, Meta Ads, and Moment Science
- Google Ads Support: Generates BOTH Search Ads and Display Ads in one HTML file
- Meta Ads Support: Generate Facebook/Instagram ad previews
- Moment Science Support: Generate modal popup ads with Moment Science branding
- Validation: Built-in character limit checking and field validation
- LLM-Friendly: Simple input format designed for AI generation
- Interactive Output: Fully functional HTML with preserved JavaScript functionality

Installation

$3

``bash
npm install -g html-ad-generator-mcp
`

$3

1. Clone this repository
2. Install dependencies:
`bash
npm install
`
3. Build the server:
`bash
npm run build
`

MCP Server Setup

After installation, you need to configure your MCP client to use this server.

$3

Add the following to your MCP settings configuration:

`json
{
"mcpServers": {
"html-ad-generator": {
"command": "node",
"args": ["path/to/html-ad-generator-mcp/build/index.js"]
}
}
}
`

If installed globally via npm, use:

`json
{
"mcpServers": {
"html-ad-generator": {
"command": "npx",
"args": ["html-ad-generator-mcp"]
}
}
}
`

$3

Add to your Claude Desktop configuration file:

On macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
On Windows: %APPDATA%\Claude\claude_desktop_config.json

`json
{
"mcpServers": {
"html-ad-generator": {
"command": "npx",
"args": ["html-ad-generator-mcp"]
}
}
}
`

$3

After configuring, restart your MCP client. The server should appear in your connected servers list with the following tools:
- generate_google_ad_html
- generate_meta_ad_html
- generate_moment_science_ad_html
- validate_ad_content
- get_google_ad_schema
- get_meta_ad_schema
- get_moment_science_ad_schema

Available Tools

$3

Generates a complete Google Ads HTML file with BOTH search and display ads.

Input Parameters:
- searchAd (required): Object with headlines (3 strings) and descriptions (2 strings)
- displayAd (required): Object with headline, longHeadline, description, businessName, and optional imageUrl

Note: Both searchAd and displayAd must be provided together.

Example:
`json
{
"searchAd": {
"headlines": ["Buy Running Shoes", "Free Shipping", "50% Off Today"],
"descriptions": ["Premium quality shoes for athletes", "Limited time offer!"]
},
"displayAd": {
"headline": "Summer Sale",
"longHeadline": "Exclusive Summer Collection - Up to 70% Off",
"description": "Limited stock available. Shop now!",
"businessName": "FashionBrand",
"imageUrl": "https://example.com/banner.jpg"
}
}
`

$3

Generates a complete Meta (Facebook/Instagram) ad HTML file.

Input Parameters:
- headline: Main ad headline (max 40 chars)
- description: Short description (max 30 chars)
- primaryText: Main ad text content
- cta: Call-to-action button text
- businessName (optional): Business/page name
- profileImageUrl (optional): Profile picture URL
- mainImageUrl (optional): Main ad image URL

Example:
`json
{
"headline": "3 Months Free Trial",
"description": "New subscribers only",
"primaryText": "Get 3 months of our premium service absolutely free.",
"cta": "Start Free Trial"
}
`

$3

Validates ad content for any platform.

Input Parameters:
- platform: Either "google", "meta", or "moment-science"
- content: The ad content to validate

$3

Returns the expected schema for Google Ads with examples.

$3

Returns the expected schema for Meta Ads with examples.

$3

Generates a complete Moment Science modal popup ad HTML file.

Input Parameters:
- headline: Array of 3-5 ad headlines (max 70 chars each)
- description: Array of 3-5 ad descriptions (max 180 chars each)
- positive_cta: Array of 3-5 positive call-to-action button texts (max 20 chars each)
- negative_cta: Array of 3-5 negative call-to-action button texts (max 20 chars each)
- imageUrl (optional): Image URL for the ad

Example:
`json
{
"headline": [
"Save 25% on an AARP Membership Today!",
"Join AARP and Save Big on Everything",
"Exclusive AARP Member Benefits Await"
],
"description": [
"Pay only $15 for your first full year.",
"Get access to exclusive discounts and benefits.",
"Join millions of members saving money daily."
],
"positive_cta": [
"Join Now!",
"Sign Up Today",
"Get Started"
],
"negative_cta": [
"No, Thanks",
"Maybe Later",
"Not Now"
],
"imageUrl": "https://example.com/aarp-logo.jpg"
}
`

$3

Returns the expected schema for Moment Science Ads with examples.

Usage Examples

$3

`json
{
"searchAd": {
"headlines": ["Premium Headphones", "Noise Cancelling", "Buy Now - 40% Off"],
"descriptions": [
"Crystal clear audio with 30-hour battery life. Free shipping.",
"Rated 4.8/5 by customers. 1-year warranty included."
]
},
"displayAd": {
"headline": "Audio Sale",
"longHeadline": "Premium Noise-Cancelling Headphones - 40% Off Today",
"description": "Experience studio-quality sound. Limited time offer.",
"businessName": "AudioTech",
"imageUrl": "https://example.com/headphones.jpg"
}
}
`

$3

`json
{
"headline": "Learn Web Development",
"description": "Start coding today",
"primaryText": "Join our comprehensive bootcamp and master HTML, CSS, JavaScript and more.",
"cta": "Enroll Now",
"businessName": "CodeAcademy"
}
`

$3

`json
{
"headline": [
"Save 25% on an AARP Membership Today!",
"Join AARP and Save Big on Everything",
"Exclusive AARP Member Benefits Await"
],
"description": [
"Pay only $15 for your first full year.",
"Get access to exclusive discounts and benefits.",
"Join millions of members saving money daily."
],
"positive_cta": [
"Join Now!",
"Sign Up Today",
"Get Started"
],
"negative_cta": [
"No, Thanks",
"Maybe Later",
"Not Now"
],
"imageUrl": "https://example.com/aarp-logo.jpg"
}
`

Character Limits

$3

- Headlines: 30 characters each
- Descriptions: 90 characters each
- Business Name: 25 characters

$3

- Headline: 40 characters
- Description: 30 characters
- Primary Text: 125 characters

$3

- Headlines: 90 characters each (3-5 options)
- Descriptions: 220 characters each (3-5 options)
- Positive CTAs: 25 characters each (3-5 options)
- Negative CTAs: 25 characters each (3-5 options)

Output

The tools return complete HTML files that:
- Display your ad content in a professional preview interface
- Include interactive elements (dropdowns, character counters)
- Can be opened directly in a browser
- Maintain all original template functionality

For Google Ads, the HTML includes both Search and Display ad previews with tabs to switch between them.

Error Handling

The server provides clear error messages for:
- Missing required fields (e.g., if you only provide searchAd without displayAd)
- Content exceeding character limits
- Invalid input format

Development

To modify the server:
1. Edit files in the src directory
2. Run npm run build` to compile
3. The server will automatically reload with your changes

License

MIT