A fictional equipment guide contains a short demonstration of fitting a recorder's windscreen. The author can play the clip while signed into the media service. Before sending the guide to volunteers, they need to establish that the saved document contains the intended reference and that those readers can actually open it.
Add the media control to the existing editor
Merge the following options into the application's current TinyMCE initialization:
const equipmentGuideMedia = {
plugins: 'media',
toolbar: 'media',
media_live_embeds: false,
media_poster: true,
media_alt_source: true,
media_dimensions: true
};
Retain the existing plugin list, toolbar controls, selector, and license configuration. Replacing the complete lists with these two short strings would remove the application's other authoring features. This object describes the media configuration and does not initialize TinyMCE by itself.
media_live_embeds: false uses a placeholder in the editing area instead of a live embedded preview. The documented default is true. This setting concerns the authoring display; it is not a reader access policy or a command to delete the media from exported content.
The other options retain the dialog's poster, alternative-source, and dimensions fields. Hiding a field does not create a missing poster or convert an incompatible media format.
Choose a file reference or a platform embed
A direct media source must point to media the reader can fetch, such as a video file served by the organization's media host. A platform page URL may require that platform's supported embed handling. A watch page and a direct MP4 address are different resources; inspect the saved result when deciding which one to use.
For this equipment guide, record the intended clip title, source address, and poster before inserting it. If the media service supplies an official embed code, use that supported route under the application's content policy. Do not paste a browser's temporary object URL: a blob: address from the author's session does not provide a durable media location for volunteers.
Keep a text instruction beside the video, for example: “Slide the windscreen over the capsule without covering the recorder controls.” That sentence gives the reader the essential action even before they press Play. Supply captions or an equivalent accessible explanation appropriate to the clip; enabling the media toolbar does not produce them.
Capture the document and inspect its references
After insertion, use the existing save route to capture the editor's current HTML:
const editor = tinymce.get('equipment-guide');
if (!editor) throw new Error('Equipment guide is not ready');
const equipmentGuideHtml = editor.getContent();
// Send this HTML through the application's existing save service.
Here equipment-guide is the real editor ID chosen by the application. Inspect the resulting media element or iframe and its actual source. TinyMCE can normalize markup, so a placeholder's editing appearance is not the source of truth for the stored representation. The TinyMCE content capture guide covers capturing the latest instance at submission.
Leave the documented media HTML filtering enabled. If valid markup disappears later, inspect the editor configuration, server sanitizer, and reader renderer in turn. Disabling filtering broadly to make one embed appear can introduce a separate content safety problem.
Check the saved guide as the intended reader
Reopen the saved equipment record and confirm that its clip and neighboring instruction remain together. Then use the application's actual reader route with the access level intended for volunteers. Check playback, the first meaningful frame, the poster if used, and whether the host requests an unexpected login.
If the source fails, inspect the network request and the media host's permissions before changing the editor button. A working toolbar cannot repair an expired URL or authorize a private video. The HTML video guide explains native sources and tracks when the saved output uses a video element.
Read the narrow version too. The clip should fit the content column, and the windscreen instruction should remain visible nearby. Finish by sending the saved guide through the organization's normal review route with the media access condition stated accurately.