Newsletter Preset

Email clients still render with table layouts and inline styles, so a page builder configured for the web produces newsletters that break in Outlook. This preset reconfigures GrapesJS for that reality: every block is built from tables, and the export path inlines your CSS.

Blocks

Twelve blocks composed specifically to survive the major email clients. Four section layouts — sect100, sect50, sect30 and sect37 (a 30/70 split) — plus button, divider, text, text-sect, image, quote, grid-items and list-items.

Commands

• gjs-get-inlined-html — returns the template with its CSS inlined, ready to send.
• gjs-open-import-template — opens the import modal for an existing template.
• gjs-toggle-images — enable or disable images, mirroring how many clients block them by default.

Configuration

inlineCss is on by default and runs the output through the juice inliner, which you tune with juiceOpts. updateStyleManager swaps in style properties that behave reliably in email. cellStyle and tableStyle set the defaults applied inside every block's td and table, and the import and export modals are relabelled through their own options.

Good to know

Install as grapesjs-preset-newsletter. BSD-3-Clause, and the configuration behind the official GrapesJS newsletter demo.