About the PDF Embed Widget
Zyff's PDF embed widget shows a document inside your page, free — a menu, a brochure, a price list, a report. It hands the file to the browser's own PDF viewer rather than shipping a rendering library, so the widget stays tiny and nothing is downloaded until the frame is actually on screen. Zyff does not host or convert the file: you paste a link to wherever it already lives. Anything that is not a PDF cannot be previewed by a browser at all, so it renders as a download card instead. The output is one div and one script tag that works in WordPress, Shopify, Wix, Squarespace, Webflow or a hand-written HTML page alike.
How to embed a PDF on your website
Paste the file link
An https URL to wherever the document already lives — your own server, a storage bucket, a Drive share link set to public.
Give it a title
Optional; the file name is used if you leave it empty. A detail line beside it is useful for "2.4 MB · 12 pages".
Pick a layout
The inline viewer embeds it, the viewer with a header adds a title bar, the download card skips the preview entirely, and the cover layout shows your own image beside a button.
Copy the embed code
Paste the container div and script tag where the document should appear, or download the standalone HTML file. Check the 390px mobile preview before you ship it.
What the PDF Embed Widget does
The browser's own viewer, not a library
Rendering PDFs in JavaScript costs about 350 KB — more than ten times this runtime's whole budget, loaded on a page for a document most visitors never open. Handing the file to the browser costs nothing.
Nothing loads until it is needed
With lazy loading on, the PDF is not fetched until the frame nears the viewport. A brochure at the bottom of a page never costs a visitor who does not scroll.
Honest about iOS
iOS Safari renders only the first page of an embedded PDF. There is no fix without shipping a renderer, so the widget always offers a direct link — which on a phone is often how the document actually gets read.
Any file, sensibly handled
A non-PDF cannot be previewed by any browser, so the widget switches itself to a download card rather than embedding an empty frame on your page.
Your file stays yours
Zyff never stores, converts or proxies the document. Replacing the file at its URL updates it everywhere the widget is embedded.
Four layouts
Inline viewer, viewer with a title bar, download card, and a cover image beside a button.
At a glance
| File source | Any https URL — Zyff does not host it |
|---|---|
| Preview | Browser-native PDF viewer in an iframe |
| Non-PDF files | Rendered as a download card |
| Layouts | 4 templates: inline viewer, viewer with header, download card, cover and button |
| Viewer height | 240 to 1200px |
| Rendering library | None |
| Output | One container div plus one script tag, or a downloadable HTML file |
| Price | Free to build; paid plans for saved widgets |
Frequently asked questions
How do I embed a PDF on my website?
Paste the file's https link into Zyff's builder, pick a layout, then copy the generated embed code into your page. The whole flow is free with no signup, and the snippet is plain HTML, so it drops into any CMS block that accepts custom code.
Does Zyff host my PDF?
No. You paste a URL and the browser loads the file from there, so the document stays wherever you already keep it and Zyff never stores or converts it. Replacing the file at that URL updates the embed everywhere without touching the snippet.
Why does my PDF only show one page on an iPhone?
That is iOS Safari, not the widget. It renders only the first page of any PDF inside an iframe, and no embed can work around it without shipping a full JavaScript PDF renderer. This is exactly why the widget keeps a direct link alongside the frame — tapping it opens the document properly in the system viewer.
Can I hide the PDF toolbar?
You can ask. Chrome honours the request; Firefox and Safari ignore it and show their own controls regardless. It is a hint in the URL rather than a setting anyone can enforce, and the editor says so rather than presenting it as reliable.
Can I embed a Word document or a spreadsheet?
You can link to one, but not preview it — no browser renders those natively. The widget detects a non-PDF and switches to a download card, which is the honest version of what is possible without a conversion service.
Will embedding a PDF slow my page down?
Only if it loads. With lazy loading on, nothing is fetched until the frame nears the viewport, so a brochure at the foot of a page costs a visitor who never scrolls exactly nothing. The widget's own code is the smallest of any in Zyff's set.
Is an embedded PDF good for SEO?
Google can index a PDF at its own URL, but text inside an iframe on your page does not count as your page's content. If the words matter for search, put them in the page as HTML and offer the PDF as a download alongside.
Where do I paste the PDF embed code?
Wherever the document should appear — a menu page, a downloads section, a product page. Put the container div in that spot and keep the script tag with it.
Is the PDF embed widget really free?
Yes. Building it, styling it and embedding it are free with no signup, no trial and no watermark — a free embed carries a small \"PDF embed by Zyff\" link, which is how the tool stays free. The inline viewer and download card are both free, and so are the download and open-in-new-tab links: on iOS those are the fallback that makes the widget work at all. A paid plan adds the header and cover layouts, full colour control and removes the attribution link.