Cross-Channel Paid Media Performance Report (Supermetrics MCP → branded HTML/PDF)

The Problem

The client (Tereza at the client) urgently requested, by end-of-day, a paid media performance report covering total spend per month, spend per platform per month (with MoM change), and current-month performance per platform including best/worst campaigns and key conversion/engagement metrics. She needed it fast while finishing her own overall performance reporting.

Approach & Architecture

Connected to the Supermetrics MCP server and discovered authenticated data sources and the client account IDs on each platform. Pulled monthly spend/impressions/clicks/conversions for FebJul 2026 per platform, plus July-MTD campaign-level breakdowns. Computed month-over-month deltas, blended KPIs, and a full-month pace projection for the partial July window. Extracted the client's real logo assets and brand tokens from the client and [internal-host], then generated a self-contained branded HTML report via a Python generator script, and rendered it to an A4 PDF with Playwright/Chromium. Iterated to fix PDF margins, filter Google conversions to only meaningful actions, and remove interpretive commentary at the client's request.

Supermetrics MCP (data_source_discovery → accounts_discovery → field_discovery → data_query → get_async_query_results, async schedule_id pattern) feeds hardcoded, verified figures into a Python build script (build_report.py). The script embeds the client's real SVG wordmark and droid mark (currentColor inline SVG) and Summit Chase's logo (base64 PNG), builds an inline SVG stacked bar chart with no external chart library, and emits a single self-contained HTML file to /mnt/user-data/outputs. Playwright Chromium prints the HTML to A4 PDF using CSS @page control (size:A4; margin:14mm 13mm 13mm) with print break rules.

Key Decisions & Trade-offs

Hardest Part

Getting consistent A4 margins in the exported PDF. Initial export used a fixed 1040x1500px page with zero margins, jamming content to page edges and cutting tables. A later attempt with @page{margin:0} plus Playwright pdf() margins caused Chromium to ignore the engine margins and collapse left/right margins to 0. Resolved by controlling margins entirely via CSS @page{size:A4;margin:14mm 13mm 13mm} with prefer_css_page_size=True, then verifying per-page content bounding boxes programmatically (PIL/ImageChops) to confirm ~13mm on all four sides across all pages.

Technical Detail

Code

// Supermetrics data_query, AW account [ads account], 2026-07-01..2026-07-20
// fields: ConversionTypeName, Conversions
// result:
// Click Header CTA 977.71 (micro, excluded)
// Click Login/Sign Up 153.06 (micro, excluded)
// Click Download for Mac 97.89 (kept)
// Copy curl 41.98 (kept)
// Contact Sales Form 7.99 (kept) => kept total 147.86

{ "ds_id": "AW", "ds_accounts": "[ads account]", "date_range_type": "custom", "start_date": "2026-07-01", "end_date": "2026-07-20", "fields": "Campaignname,ConversionTypeName,Conversions", "filters": "ConversionTypeName [] Click Download for Mac,Copy curl,Contact Sales Form"
}

days_elapsed=20; days_month=31
proj_factor=days_month/days_elapsed
jul_total=totals[5]; jun_total=totals[4]
jul_proj=jul_totalproj_factor # ~= 50194
proj_vs_jun=(jul_proj-jun_total)/jun_total100 # ~= +43.8%

import re
html=open('client_home.html',encoding='utf-8',errors='ignore').read()
svgs=re.findall(r'<svg.*?</svg>', html, re.S)
open('client_wordmark.svg','w').write(svgs[0]) # <title>the client Logo</title>
open('client_mark.svg','w').write(svgs[72]) # id="client-logo" droid mark

await pg.goto('file://.../Client_Paid_Media_Report_Jul2026.html', wait_until='networkidle')
await pg.wait_for_timeout(2500)
await pg.pdf(path='.../Client_Paid_Media_Report_Jul2026.pdf', print_background=True, prefer_css_page_size=True)
// CSS: @page{ size:A4; margin:14mm 13mm 13mm; }

@page{ size:A4; margin:14mm 13mm 13mm; }
@media print{ .kpis,.pkpi,.callout,.panel,.pbar,.mast,.foot{ break-inside:avoid; } tr,thead,.legend{ break-inside:avoid; } .s-head,.pbar{ break-after:avoid; } table.camp thead{ display:table-header-group; }
}

Measured Results

A brand-faithful, data-only paid media report was produced and delivered to the client by EOD as HTML and a 4-page A4 PDF, sourced entirely from live Supermetrics data across Google, LinkedIn and X. Two client-requested revisions were applied: Google conversions were re-scoped to three meaningful actions (dropping the count from 1,282 to 148 and correcting CPA to $119.59), and interpretive commentary was removed in favor of a separate Slack follow-up. A pre-existing generator bug that suppressed Google best/worst campaign labels was also found and fixed.

Every figure above was recorded during the work itself. Where no number was measured, none is claimed.

Full Stack