BuilderJS - Visual HTML Email and Page Builder Plugin for Web

BuilderJS — Drag & Drop HTML Email Builder & Page Builder You Embed Inside Your Own App

BuilderJS is a self-hosted, embeddable drag-and-drop HTML email builder and page builder you drop into your own SaaS, CRM, newsletter tool, or marketing platform. Pure JavaScript, JSON-first, framework-agnostic, ships as a single ~1 MB bundle. No npm. No Composer. No Docker. No vendor lock-in. No “Powered by” badge. Your data stays on your server.

Give your end users a Mailchimp / Stripo / Beefree-style WYSIWYG email editor — without paying per-seat SaaS fees, without shipping customer data to a third party, without re-inventing a year of editor work. Trusted by hundreds of CodeCanyon authors as the editor inside their own email marketing platforms, newsletter tools, ESPs, and landing page builders.

▶ Try the live demo — drag, edit, theme, and export HTML right in your browser. No signup.

30-Second Quick Start (PHP 7.4+ — no npm, no build step)

unzip builderjs-*.zip -d ~/my-builder cd ~/my-builder php -S localhost:8000 -t demo/ open http://localhost:8000

You land on the showcase home. Click Live builder to try the editor, Examples to browse 35+ working integration walkthroughs, or Docs for the in-package developer portal. The whole demo runs on PHP’s built-in server — every other backend (Node, Laravel, Django, Rails, .NET, Go) wires up the same way.

5-Minute Integration — One Config Block, Three URLs

Open demo/builder.php. The top of the file declares a single $builderConfig array — every key is documented inline. 95% of integrations only touch three keys:

$builderConfig = [ 'endpoints' => [ 'save' => '/your-app/save', 'assetUpload' => '/your-app/upload', ], 'defaultTheme' => 'default', 'defaultSample' => 'Blank', ];

Reload the page. The Save button now POSTs to your endpoint. No build step, no rebuild — edit + reload.

What’s New in 7.0.1

7.0.1 builds on the 7.0.0 buyer-portal rebuild with new editor widgets, a stronger email-export pipeline, and quality fixes:

• YouTube element — Web + Email modes. Dual-config widget that adapts to your output context and bakes a Gmail-safe play button into email thumbnails, plus size presets.
• Social Icons widget — 11 visual styles. Palette-ready, with a rich style picker (crisp canvas SVG in the editor, email-safe pre-rendered PNG on export), per-platform backgrounds, and an in-canvas missing-URL indicator.
• Signup form templates + generator. 8 refined form templates, coordinated preset buttons, 5 creative layouts, and popup background-image support.
• Feature-list & Spacer widgets added to the Basic palette — icon size, per-item color override, and title/description typography controls.
• Inline-CSS email export — v5 pipeline. Server-side inliner with an email-safety warnings catalog so exported HTML renders consistently across clients.
• Funnel sample templates — Upsell and Thank-You pages (Simple + Extended variants) with celebration art.
• Unified link-URL validation that accepts {{ merge tags }}; consistent control panels; cleaner host file-picker integration via an onBrowse callback.

7.0.0 highlights (carried forward): 10-section showcase home, live builder, theme gallery, design-system reference, 35+ integration examples across 6 tiers, an in-package developer docs portal with Cmd-K search, reactive event bus, multi-instance support, and 400+ Playwright regression specs.

Drag & Drop HTML Email & Page Builder

BuilderJS gives your users a familiar drag-and-drop canvas with a curated set of email-safe widgets — headings, paragraphs, images, buttons, dividers, social icons, YouTube embeds, columns, lists, feature lists, spacers, signup forms, and more. If the stock palette is not enough, register your own widget in 30 lines of JavaScript using widgetsBox.addWidget().

Visual Style Manager — No HTML or CSS Required

Every element exposes a visual settings panel: typography, colors, spacing, alignment, borders, shadows, backgrounds. End users style their emails without ever opening a CSS file. CSS variables and design tokens make full theming trivial for developers.

Responsive Email & Mobile-First Design

BuilderJS produces responsive HTML that renders correctly across desktop, tablet, and mobile. The preview pane switches device width in one click. Templates use email-safe table-based layouts with progressive enhancement for modern clients (Gmail, Outlook 2019+, Apple Mail, Yahoo Mail, Thunderbird, mobile).

Inline-CSS HTML Export — Ready for Every Email Client

One call to getHtml() returns inline-CSS-flattened email HTML ready to send. Linked stylesheets are automatically extracted and converted into inline attributes — no post-processing pipeline, no Mailchimp inline-CSS tool, no manual fix-up. The 7.0.1 v5 export pipeline adds an email-safety warnings catalog so you catch client-specific gotchas before you send.

JSON-First Architecture — Versioning, Diff, AI-Ready

Every page is a JSON document. Save it, version it, diff it, hand it to an LLM to mutate, or round-trip through any backend. getData() serializes; load() rehydrates byte-identically. Perfect for SaaS products that need versioning, A/B testing, audit logs, or AI-assisted email generation.

Framework-Agnostic — Works With Any Backend

BuilderJS is pure JavaScript. It works with PHP, Laravel, Node.js, Express, NestJS, Django, Flask, Ruby on Rails, ASP.NET, Java Spring, Go, or any backend you already have. The reference demo ships in PHP because PHP has zero install friction — the engine itself doesn’t care.

White-Label & Self-Hosted

No “Powered by” badges. No telemetry. No phone-home. No external API keys. No SaaS dependency. Brand it your way: drop in your logo, swap CSS design tokens, replace icons, ship it inside your own product. Your customers’ data stays on your servers — clean for GDPR, HIPAA, and enterprise compliance.

Multi-Instance & Multi-Tenant Ready

Mount multiple BuilderJS instances on the same page. Wire one bundle per tenant in a SaaS. Each instance owns its host element, its theme, its bundle — no global state collision. Cookbook examples show A/B compare side-by-side and tenant-isolation patterns end-to-end.

Made for Developers

BuilderJS exposes a clean public API: new Builder({...}).load(data, templates, config, mediaUrl, callback). Subscribe to the event bus, register custom elements via Builder.registerElement(), subclass controls, customize widgets. Every public class is documented in the in-package developer portal — no external doc site, no GitHub round-trip.

What’s Inside the Package

• dist/ — compiled UMD bundle (builder.js + builder.css), ~1 MB total.
• demo/ — full showcase site: 10-section home, live builder, theme gallery, design system reference, 35+ examples, in-package docs portal.
• demo/examples/ — basic · backend · cookbook · events · api · extensions. Every example self-contained, copy-paste-ready.
• demo/docs/ — 15-doc developer portal with Cmd-K search.
• demo/backend/ — reference PHP endpoints for save, asset upload, HTML export, ZIP export, bundle export.
• demo/themes/ — canonical theme tree, 50+ ready-to-use email templates (newsletters, welcome series, sale announcements, transactional, event invites).
• src/ — full engine source, included in both the Regular and Extended License tiers; rebuild dist/builder.{js,css} any time with npm install && npm run build.
• README.md · CHANGELOG.md · LICENSE.md — onboarding, version history, licensing.

50+ Built-In Email Templates

Professionally designed templates included: newsletters, product launches, welcome series, abandoned cart, event invitations, sale announcements, transactional receipts, services lineups, and more. Use them as starting points or strip down to brand-blank.

Use Cases

• Email marketing SaaS — give your customers a drag-and-drop email composer instead of building one.
• Newsletter platforms — Mailchimp / Beefree / Stripo alternative you fully control.
• CRM & ESP — embed inside customer-communication tools.
• CMS & landing page builders — content editor for non-technical users.
• Marketing automation — let users design their own campaigns inline.
• Transactional email tooling — receipts, invoices, notifications, system mail.
• Internal tools — branded composer for sales, support, HR teams.
• AI-assisted email generation — JSON layer is ideal for LLM mutation, round-trip, and review.

Browser Compatibility

Latest Chrome, Firefox, Safari, Edge. Regression-tested against a 400+ Playwright spec suite covering boot, save round-trip, every example walkthrough, and design-system parity. Outlook 2019+, Apple Mail, Gmail, Yahoo, Thunderbird, and mobile clients verified for export HTML.

Comprehensive Documentation Ships Inside the Package

BuilderJS ships its complete developer documentation inside the buyer package at demo/docs/. Host the demo/ folder and you have an in-product knowledge base: JSON schema, Builder API reference, custom-element walkthrough, custom-control recipe, custom-theme guide, backend integration patterns, i18n locale packs, FAQ. Every example also has its own walkthrough page accessible from the showcase home and the examples hub.

License & Bundled Libraries

Sold under the Envato Standard License (single end product) or Extended License (SaaS / multi-tenant deployments). Full terms in LICENSE.md. Bundled libraries (Quill, EJS, Bootstrap, Prism, Material Symbols) ship under their original MIT / BSD / Apache licenses — all preserved verbatim in the package.

Support

Use the support form on this CodeCanyon item page. Bug reports, integration questions, custom-widget guidance — we respond.

Release Notes

7.0.1 / 2026-06-20 ================== * Added: YouTube element — Web + Email output modes, Gmail-safe baked-in play button, size presets * Added: Social Icons widget — 11 styles, canvas SVG in editor + email-safe PNG on export, per-platform backgrounds * Added: signup form templates + generator (8 templates, 5 layouts, popup background image) * Added: Feature-list + Spacer widgets in the Basic palette (icon size, per-item color, typography controls) * Added: inline-CSS email export v5 pipeline + email-safety warnings catalog * Added: funnel sample templates — Upsell + Thank-You (Simple + Extended) * Added: optional SEO scaffolding in demo/ (canonical/robots/sitemap/OG/JSON-LD) — OFF by default, no telemetry in the buyer copy * Changed: unified link-URL validation (accepts merge tags); consistent control panels * Changed: assetUploadHandler replaced with onBrowse callback * Changed: internal artefact_type -> outputMode refactor (backward compatible — old JSON still loads) * Fixed: button box-sizing preserved in exported email (Full-width no longer overflows) * Fixed: rounded cells clip children correctly; empty placeholder stripped from export * Fixed: YouTube/video embeds no longer swallow the selection click * Fixed: bare URLs/emails auto-wrapped in  on export; ZIP/Bundle export scoped to active sample assets 7.0.0 / 2026-05-11 ================== * Added: full buyer portal rebuild — 10-section showcase home, live builder, gallery, design system, examples hub * Added: 35+ working integration examples across 6 tiers (basic, backend, cookbook, events, api, extensions) * Added: in-package developer documentation portal at demo/docs/ — 15 docs across 4 tracks with Cmd-K instant search * Added: 8 builder chrome variants (minimal, 2-col, 3-col, sidebar-only, mobile, card, rich header, canvas-only) * Added: 4 reference backend adapters (PHP MySQL save, S3 storage, auth, realtime sync) * Added: i18n locale pack — EN, FR, VI shipped, plug your own JSON * Added: reactive event bus — document:saved, element:added, element:removed, mode:changed * Added: programmatic API examples — getData, load, setMode, selectElement, clear, undo/redo * Added: custom element registration via Builder.registerElement() * Added: custom widget registration via widgetsBox.addWidget() * Added: custom control subclassing recipe * Added: multi-instance support — mount multiple builders per page, zero global state collision * Added: light/dark mode toggle ships in the demo * Added: theme picker modal with category filter * Added: bundle and ZIP export endpoints (in addition to HTML export) * Added: 400+ Playwright regression specs (chromium + firefox) * Added: WCAG / a11y improvements across builder UI and showcase chrome * Added: PHP 8.x compatibility verified across all backend reference adapters * Fixed: drag-and-drop edge cases in Safari and Firefox * Fixed: template-load performance on first paint * Fixed: dark-mode contrast across all control surfaces * Fixed: duplicate CSS after multiple saves * Fixed: image upload edge cases with large files * Fixed: inline editor compatibility across modern browsers 6.0.6 / 2026-03-03 ================== * Added: Bootstrap is no longer required, pure HTML is now supported for widgets * Added: more base templates * Added: new 'X' icon for former Twitter * Added: more translation and language support * Fixed: drag & drop issue with Safari * Fixed: improved users' experience with drag & drop * Fixed: reduced nested HTML in widgets, easier to maintain * Fixed: older Outlook compatibility issues * Fixed: reduced templates' filesize * Fixed: PHP 7.3 compatibility issue with sample code * Fixed: better CSS-inline examples for PHP as server-side scripting * Fixed: translation typos * Fixed: image preview issue with certain browser