Helios Open Reader includes shortcodes for embedding rich content responsively, with automatic dark/light theme detection where supported.
iFrame – [iframe]
[iframe url="https://example.com/embed"]
Embeds any URL in a responsive 16:9 container. Add a title for accessibility (recommended), and optionally set a different ratio:
[iframe url="https://example.com" title="My embedded content"]
[iframe url="https://example.com" title="My embedded content" ratio="4:3"]
Google Slides – [googleslides]
[googleslides url="https://docs.google.com/presentation/d/..." title="Introduction slides"]
Embeds a Google Slides presentation responsively. Paste the "Publish to the web" embed URL. Supports ratio="4:3".
PDF Viewer – [pdf]
[pdf url="https://example.com/document.pdf" title="Course reading"]
Displays a PDF via Google Docs viewer. Default ratio is 16:9. For letter or A4 documents:
[pdf url="https://example.com/document.pdf" title="Course reading" ratio="portrait"]
H5P Interactive Content – [h5p]
Embed via full URL:
[h5p url="https://h5p.org/h5p/embed/123" title="Interactive quiz"]
Or via Content ID (requires H5P Content Embed Source URL to be set in plugin settings):
[h5p id="123" title="Interactive quiz"]
Embedly Cards – [embedly]
[embedly url="https://example.com/article"]
Renders an Embedly card with dark mode support. Useful for embedding links to articles, videos, and other web content with rich previews.
Tip
All embed shortcodes are responsive by default. Always add a descriptive title parameter to iframe-based shortcodes (, , , ) — this sets the iframe's accessible title for screen readers. The 16:9 ratio works well for video content and slides; use ratio="portrait" for PDF documents and ratio="4:3" for older slide formats.