← Back to Email Builder

OCC Email Builder

Generate ready-to-paste HTML emails from a Google Docs copy document and an optional UTM spreadsheet. No coding required.

Before You Start

You will need:

A Google Docs copy document — the campaign email copy, formatted with headings like “Email #1”, “Email #2”, etc.
A UTM spreadsheet (optional) — an .xlsx or .csv file with tracking links. If you skip this, the builder will insert {need UTM} placeholders you can replace later.

Use any modern browser. Google Chrome is recommended for the best experience.

1 Export Your Google Doc as HTML

Open the copy document in Google Docs.
Go to File → Download → Web Page (.html, zipped).
A .zip file will be saved to your Downloads folder.
Extract the zip file:
- Windows: Right-click the .zip → Extract All… → click Extract.
- Mac: Double-click the .zip file. A folder will appear beside it.
Open the extracted folder. Inside you will find an .html file — this is the file the builder needs.

For convenience, you can move the .html file into the drop-google-doc-html-here folder inside occ-builder. This makes it easy to find later, but it is not required — you can drag the file from anywhere.

2 Open the Email Builder

Navigate to the occ-builder folder on your computer.
Double-click index.html. It will open in your default web browser.
You will see the upload screen with two drop zones.

The tool runs entirely in your browser. Nothing is uploaded to the internet — all processing happens on your computer.

3 Upload Your Files

Drag & drop the .html file from Step 1 onto the first drop zone labeled “Google Docs HTML (.html)”.
The zone border will turn green and show the filename when accepted.
Or click the drop zone to browse and select the file.
(Optional) Drag the UTM spreadsheet (.xlsx or .csv) onto the second drop zone labeled “UTM Spreadsheet”.
Click Generate Emails.

The builder will process your files and take you to the review screen.

4 Review Your Emails

The review screen has several areas:

Email Sidebar (left) Lists all emails by number and send date. Click any email to switch to it.

Metadata Card (top) Shows the subject line, preview text, sender, signature type, and language for the selected email.

Segment Pills Toggle between audience segments (e.g., Engaged Audience Unengaged Audience). Each segment has its own version of the email.

HTML Editor The raw HTML code for the selected email and segment. You can edit it directly if needed.

Using the Preview

Click the Preview button in the top-right corner of the toolbar. A live preview panel will open to the right of the editor, showing you what the email looks like with the full OCC branding — header, body content, footer, and social links.

The preview updates automatically when you switch emails, change segments, or edit the HTML.
Scroll down in the preview to see the footer and social icons.
Click Hide Preview or the × button to close the preview panel.

5 Copy or Download Your HTML

At the bottom of the screen you will find two action buttons:

Copy HTML — copies the HTML to your clipboard. You can then paste it directly into Luminate Online. The button will briefly change to “Copied!” to confirm.
Download .html — saves the HTML as a file on your computer.

Remember to copy or download each segment separately. Switch between segments using the pills at the top, then copy/download each one.

Starting a New Build

Click New Build in the bottom-right corner to clear everything and return to the upload screen. You can then drop in a new document and start fresh.

Tips & Troubleshooting

Problem	Solution
“No emails found” error after generating	Make sure the Google Doc uses headings formatted as “Email #1”, “Email #2”, etc. The builder looks for this pattern to identify each email.
You see `{need UTM}` in the HTML	This means no UTM spreadsheet was provided. Either upload the UTM spreadsheet and regenerate, or manually replace these placeholders with the correct tracking URLs.
Preview panel looks blank or bare	Make sure you scroll down inside the preview — the email body, footer, and social icons may be below the visible area.
The drop zone does not accept the file	Confirm the file has an `.html` or `.htm` extension (for the first zone) or `.xlsx` / `.csv` (for the UTM zone). If you downloaded the Google Doc as a `.zip`, make sure you extracted/unzipped it first.
Some emails show fewer segments than expected	The builder detects segments from the color-coded segmentation keys in the copy document. If a segment is missing, check that the Google Doc has the correct highlight colors for that email’s segmentation table.
Forward (FWD) emails look incomplete	FWD emails automatically stitch in the body from the base email they reference. If the base email is missing or has a different number, the FWD may appear incomplete. Check that both the FWD and base emails are in the document.

Quick Reference

Switch Email Click an email in the left sidebar

Switch Segment Click a segment pill at the top

Toggle Preview Click the Preview button (top right)

Copy to Clipboard Click Copy HTML (bottom left)

Download File Click Download .html (bottom left)

Start Over Click New Build (bottom right)