How to embed a PDF on a website (4 ways, and the one that works on phones)

You add a PDF to your site, it looks perfect on your laptop, and then someone opens the page on their phone and sees an empty grey rectangle. This is the single most common way PDF embedding goes wrong, and it isn't a mistake in your markup — it's that the two tags every tutorial recommends were designed for a plugin that mobile browsers don't have.

Why the classic tags fail on phones

<embed> and <object> don't render a PDF. They hand the file to whatever PDF plugin the browser provides and step back. Desktop Chrome, Firefox and Safari all ship one, so it works on your machine. iOS Safari does not expose one to embedded content, so it renders nothing at all — or, depending on the version, a single frozen first page you can't scroll.

The four ways, compared

Method 1: <embed> and <object> — skip these

Included only so you can recognise them in the tutorial you were about to follow. Both depend on a browser plugin, both fail on iOS, and neither gives you any control over what the failure looks like. There is no configuration that fixes this; the approach is the problem.

Method 2: Just link to it

Honest option, and sometimes the right one: <a href="report.pdf">. It works everywhere because the browser takes over completely. But it isn't an embed — the visitor leaves your page, lands in a bare PDF viewer or a download, and many won't come back. Fine for a downloadable appendix; wrong for a menu, a brochure, or anything that's meant to bepart of the page.

Method 3: The Google Drive iframe

Upload to Drive, choose Embed item, paste the iframe. It does work on mobile, because Drive renders the PDF server-side and sends back a web page rather than a raw file. Three things to know before you commit to it:

• Drive's chrome comes with it. A toolbar, a pop-out button, and Google branding sit around your document on your page.
• It depends on a sharing setting you might change later. The file has to stay on “Anyone with the link.” Tighten permissions during a cleanup and your public page starts showing a permission error to strangers.
• You can't see usage. Drive won't tell you how many people actually opened the embedded document.

Method 4: Embed a viewer page (the one that just works)

The principle behind both working methods is the same: don't point the browser at a .pdf file — point it at a page that renders the PDF. That page draws each page of the document with JavaScript, so the result is identical on desktop, Android and iOS, with no plugin involved anywhere.

On Link in Seconds every link already has that viewer, and every link has a ready-made embed code. Open the link's settings, copy Embed on your site, and paste it into your page:

<iframe
  src="https://linkinseconds.com/p/your-link?embed=1"
  width="100%"
  height="640"
  style="border:0;border-radius:12px"
  allowfullscreen
></iframe>

The ?embed=1 is what matters: it serves the document chrome-free, with no header, footer or branding around it, so it sits inside your layout as though it were part of the page. It's available on every plan, not just paid ones.

Sizing it so it looks right

1. Keep width="100%" so it fills whatever container you drop it into.
2. Set a height in pixels, not a percentage. A percentage height collapses to zero unless every ancestor element has an explicit height — this is the second most common “my embed is invisible” cause after the iOS one. 640px suits a portrait A4 page.
3. For a responsive aspect ratio, wrap it in a div with aspect-ratio: 1 / 1.414 (A4 portrait) and give the iframe height: 100%.

What embedding does and doesn't do for SEO

Worth being precise, because this gets overstated in both directions. The text inside an embedded PDF is not part of your page's content — Google may index the PDF as its own separate document, but it contributes nothing to what your page ranks for. So if the PDF holds the content that should be ranking, put that content on the page as real HTML and treat the PDF as the printable version alongside it.

The embed is not a penalty either. It's simply neutral: a visual element, like an image. Judge it on whether it helps the reader, not on whether it helps the crawler.

Quick answers

Related guides

• How to turn a PDF into a link — the step before this one.
• Share a PDF people can view but not download — pairs well with an embed.
• Turn a PDF into a QR code — the print equivalent of embedding.