Statamic Tinymce Cloud Laravel Package

Getting Started

composer require mitydigital/statamic-tinymce-cloud
php artisan vendor:publish   # pick the statamic-tinymce-cloud config (+ views if you want to override)

1. Grab an API key from tiny.cloud and put it in .env:

   TINYMCE_CLOUD_API_KEY=your-key-here
   

2. Point a Bard field at the new editor — globally in config/statamic/bard.php:

   'editor' => 'tinymce-cloud',
   

   or per-field in the blueprint:

   -
     handle: body
     field:
       type: bard
       editor: tinymce-cloud
       save_html: true
   

3. Load the CP, open an entry, and confirm the toolbar renders. Then save and check the front-end output.

Start with one low-traffic field (a blog body) rather than rolling it out everywhere. The two files you'll live in are config/statamic-tinymce-cloud.php (TinyMCE init options: plugins, toolbar, menubar, content_css, valid_elements) and the blueprint that opts into it.

Implementation Patterns

Global default, per-field exceptions. Set tinymce-cloud as the default Bard editor so new fields "just work", and keep fields that need the stock ProseMirror editor (or a minimal toolbar) explicitly configured in their blueprints. Mixing editors across a site is fine — they're per-field settings.

Always pair with save_html: true. TinyMCE is a real HTML editor; without save_html you'll get an editor that writes HTML into a field the rest of Statamic expects to be ProseMirror JSON. Set it at the same time you set editor.

Match the editor to the site. TinyMCE renders inside an iframe, so your front-end styles don't apply. Add a content_css pointing at a trimmed editor stylesheet (or content_style for a small block) so headings, links, and embeds look like the published page. This is the single biggest quality-of-life change for content authors.

Keep the toolbar opinionated. The addon inherits whatever you put in plugins/toolbar. Trim it to the button set your team actually uses — the default is large, and every unused plugin is another CDN script and another thing editors can break.

Rendering. With save_html: true, {{ bard_field }} emits raw HTML. If you have multiple authors, sanitise on output or restrict valid_elements/valid_children in the config rather than relying on author discipline. Nested Bards inside Replicator/Grid sets each need their own save_html and editor keys.

Environments. TinyMCE Cloud authorises by domain, so every host that renders the CP (local.test, staging, production, per-site multisite domains) must be approved in the Tiny account. Keep a separate API key per environment if you want clean usage reporting.

Deployment. No asset build of your own is required — TinyMCE comes from the CDN. After composer update, run php artisan config:clear (and view:clear if you've published views) and hard-reload the CP, since fieldtype JS is aggressively cached by the browser.

Gotchas and Tips

• 4.0.2 "Adjust Vue setup" is a CP-side component fix only — no config or data changes. If you publish/override the addon's Vue field component, re-publish and rebuild your CP assets after upgrading, otherwise the old component keeps loading.
• The 4.x line tracks Statamic 5's Vue 3 control panel. If you're still on Statamic 4, stay on the 3.x branch.
• Config changes need a cache clear. The addon config is a normal Laravel config file; php artisan config:clear before you conclude "the setting isn't working".
• The TinyMCE version is pinned in the CDN URL by the addon, not by you. A minor addon release can move you to a newer TinyMCE — retest custom valid_elements and any content_css rules after updates.
• Free tier has visible branding and a plugin subset. Decide early whether "Powered by Tiny" and the reduced plugin list are acceptable, or budget for a paid plan.
• Extension points: the config file (init options), published views (field rendering), and a service provider binding if you need per-role editor configs — e.g. a stripped-down toolbar for contributors and the full set for admins, resolved at boot from the current user.
• Don't switch a large field blind. Snapshot the content column (or run it on a duplicated field) before converting a Bard field that already holds ProseMirror JSON.