Legionsites

Documentation

Embedding a PDF

We covered linking to PDFs in another help document. When clicking on linked PDF document, it will either open in the browser for viewing or download to the user's computer (depending on the user's browser settings). However, most browsers will support  embedding a PDF viewer into a webpage as well. This technique is a more advanced procedure that requires the admin user to work within the Page Editor's source area,  but many have used this technique to provide a more seamless viewing for their PDFs.

A webpage with an embedded PDF viewer.

To get started, create a webpage with the basic content that you want, save the page, then click on the Source button.

Click on the Source button in the menu bar.

Copy the HTML Embed code below, and paste it into the proper location in the HTML source area for your webpage. Locating the proper location can be difficult, but try to look for the page content that you intend to come right before the PDF viewer.

<embed width="100%" height="420px" src="/files/doc-location.pdf" style="border: 1px solid #000;" type="application/pdf"></embed>

Paste the HTML code into the HTML source for the webpage.

Within the above embed code, you will need to edit the "src" attribute so you can get the correct path to your file.

You can get the path to your file within the File Manager admin page.

You can also edit the width, height and style attributes. Since the editor does not have support for the embed html element, you will not see the emdedded PDF within the Page Editor's normal view. However, while in the source view, you can save your page and click on the Preview button to view the page.