Embedded PDF

JamsEDU uses EmbedPDF to display PDF files directly on your pages. Add a div with a data-pdf attribute pointing to your PDF file, or use an embed element whose src ends in .pdf. JamsEDU turns either one into an in-page reader with zoom and scrolling. Make sure the file is somewhere your site can serve it, such as /assets/docs/.


    <div data-pdf="/assets/docs/your-handout.pdf"></div>

You can customize how the PDF viewer behaves by editing jamsEduConfig.embedPdf in assets/js/main.js. Set only the properties you need and anything you omit will use the default values. To disable the viewer entirely, set the whole key to false. For more on how jamsEduConfig works across all built-ins, see Optional Settings.

useMutationObserver: When true (default), new [data-pdf] or embed[src$=".pdf"] elements added to the page after load are automatically mounted through the shared DOM watcher. When false, only elements present in the DOM at load time are mounted.
version: The @embedpdf/snippet version to load from jsDelivr. Currently defaults to 2.14.0.
minZoom, maxZoom: Minimum and maximum zoom levels for the viewer. Currently default to 0.5 and 3.
scrollPageGap: Pixel gap between pages in continuous scroll mode. Currently defaults to 12.
disabledCategories: An array of toolbar category IDs to hide. Setting this replaces the default list entirely. The defaults hide form, redaction, document-open, document-close, document-capture, document-protect, and capture.
fullscreenProxy: When true (default), adds extra fullscreen control wiring for the viewer UI.

Live example

The embed below uses the demo PDF shipped with this documentation site.

Styling

In a standard JamsEDU app that keeps the built-in theming stack, the PDF viewer automatically follows the same light and dark palettes as the rest of your site. If you need to customize its appearance, you can override --pdf-* variables for toolbar colors, canvas background, and layout defaults like height. Behavioral options such as zoom limits and toolbar visibility are controlled through jamsEduConfig.embedPdf in assets/js/main.js. For the full list of available variables and how they connect to the shared token system, see the CSS and Theming guide.