Skip to main content
All CollectionsUsing IT GlueManage Content
Embed a PDF inside a document
Embed a PDF inside a document
A
Written by Aiden Morris
Updated over a week ago

You can use the Embed Media tool to embed a PDF that you have uploaded to IT Glue.

  1. Within your document, upload the PDF into the Attachments area. Learn more about attaching files.

  2. Right-click the name of the file and click on Inspect.

    Screen_Shot_2019-04-26_at_3_25_57_PM.png
  3. In the Inspect Element, the <a> target attribute will be highlighted. Right-click on the link in the href attribute and click the Copy link address.

    Screen_Shot_2019-04-26_at_3_40_44_PM_png.png
  4. Create a new Text content block.

  5. Click the Embed Media icon and embed the HTML code in an iframe that points to the PDF URL you noted in step 3.

    Embed_Media_IT_Glue.png


    Example:
    <iframe src="https://mycompany.itglue.com/attachments/1184302?preview=1" width="100%" height="900px" frameborder="0"></iframe>

  6. Click the checkmark to see the PDF displayed in the newly created iframe.

    Iframe_Embed_Checkmark.png
  7. Publish the document, and that should now let your team view the scrollable PDF in the same part of the screen as the one they'll be reading other information in. The PDF will also display in the public version of the document as long as the browser supports it.

This produces:

Example_Embedded_PDF_IT_Glue.png

Within the viewer, you can zoom in/out, scroll, and rotate the page orientation. You can also print and download the PDF.

Embedding PDFs that are not stored in IT Glue

Google Drive offers a feature that will let you embed a PDF not stored in IT Glue. The files don't have to be uploaded to Google Drive. You just need to have published your PDF document somewhere on the web so you can get the URL of the stored document. Keep in mind that only files under 25 MB can be previewed with the Google Drive viewer.

All Google Drive viewer URLs will use the path http://docs.google.com/viewer. Your URL then becomes http://docs.google.com/viewer?url=yourURLhere. Since the path accepts an embed parameter, you can embed the PDF viewer in your document with iframes.

For example, if you wanted to view the PDF at
http://www.cs.mcgill.ca/~martin/theses/phd-duala-ekoko-2012.pdf
you would construct the URL to the embedded viewer like so:
http://docs.google.com/viewer?url=http://www.cs.mcgill.ca/~martin/theses/phd-duala-ekoko-2012.pdf&embedded=true

To use this method to embed a PDF, you just place your URL in an iframe element using the following opening and closing tags and this automatically embeds the viewer in your document:
<iframe src="http://docs.google.com/viewer?url=yourURLhere&embedded=true" width="100%" height="900px" frameborder="0"></iframe>



This produces:

Example_Google_Viewer_PDF.png

Your embedded file now displays in your IT Glue document with Google Drive viewing tools.


Note: We do not provide support or troubleshooting for third-party viewing tools. For help using Google Drive tools, refer to Google's help documentation.


When Chrome won't display your iframe

Iframes may work fine in certain browsers but will often get blocked when using Chrome. There's an easy fix to this.

This happens because the iframe is from a source other than that of the https page. The person who loads the https page with blocked mixed content will need to look for the security icon

Screenshot_2017-11-19_at_12.56.58_PM.png

in the address bar of their Chrome browser and click on it. Choosing the hyperlink to "Load unsafe script" will display the iframe.

Screenshot_2017-11-19_at_12.57.10_PM.png

For documents that you make public, you can also point the user to an http URL instead of https to avoid this warning. As always, make sure that you have the correct URL in your iframe to prevent malicious scripts from running in the browser.

IT Glue doesn’t prevent you from displaying content inside an iframe, though for security reasons, we do not allow your iframe to contain any <script> tags.

Did this answer your question?