Embed a PDF in Help Center articles

hey Jordan Dayton

awesome code you have there, i appreciate the share (rhyme unintentional)

would it be possible to use the same display for google drive pdfs?

the links do not have the file name extensions and i am unable to get your code to work on my guide without them, i believe

this is similar to the question Brian Kopacz asked 3 years ago

any help would be sincerely appreciated

many thanks

owen

Here's some code that we use and will hopefully be helpful for others.

Guide Admin Console > Guide Settings (Gear Icon) > Security (section) >>>

Tick option:
❑ Display Unsafe Content ➞ Warning: Enabling this will allow potentially malicious code to be executed when viewing articles.

<details style="margin-left:3px;cursor:pointer">
<summary style="color:#ee4466;cursor:pointer">View/Download PDF supplement</summary>
<br>
<iframe src="http://cdn.zendesk.com/resources/documentation/GettingStartedGuide.pdf" width="100%" height="900px"></iframe>
</details>
<hr>

You can display PDF's, slide decks, word docs, etc. in this file viewer. Here's what it looks like:

Where exactly does the code go in the "article_page.hbs"? And does the iframe just to directly into the article? New to editing code so please bear with me.

Thanks!

Bobby

This is great code.

<iframe src="https://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>

I gather here that I can use the gviewer for pdf's.  We are making a decision on what application to use as a content storage.  We are testing box, but I cannot get the above to work.

Apps like box have unique URL's that do not end with *.PDF.  That seems to break the code.

My question is can the above be used when my url is something like:

https://apps.box.com/v/sn/8gf87sdg987g7d9sg

Thanks,

Brian

Thanks Chaz, I tried your iframe, but I'm still getting a blank page for some reason, I made this PDF public in the permissions. ( see below) BTW, can you share the JS you used? is it the same as in posted here in this thread by Wes?

I am not an expert but the trick for me was HOW I shared the google doc. My iframe line looks like the following and it works perfectly.

<p><iframe src="https://drive.google.com/file/d/168c-bglQMZ5ajOSD7F9AF7E3e0IyT0xS/preview" width="100%" height="600"></iframe></p>

Hi, 

Wes (or anyone else that can help) explain what should be placed in the iframe code after src, I understand that the url part should of course lead to the PDF but what's the src line for? 

At the moment when I paste the link in both src and url I get a blank article with some blinking of a black line...

Thanks in advance

Ori

<iframe src="https://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>

Hey Theresa!

Another option might be to save a duplicate copy of the PDF as an image file and embed that instead. You should be able to make the image into a link, as well, so folks can download the PDF version if they want.

Hi,

Sorry about not posting a status update sooner.

I opened a support ticket to address the issue in the new Help Center format not allowing PDFs to be displayed as the article when the PDF is stored in your Zendesk account as an asset or as an article attachment.

Zendesk is not going to allow PDFs to be displayed as an article if the PDF is stored in your Zendesk account. PDFs can only be stored as an attachment in an article going forward in the new Help Center format. Zendesk wants PDFs to be stored outside of your Zendesk account like in Google Docs for example if you need to display them.

I can display PDF files from another website as an article with the code posted at https://gist.github.com/moderatorwes/03a8fd4152f43a981bc12178b9238137 .

Hi Jessie - thanks so much for replying in.  We did take a look at Wes's solution but to be honest is a bit over our non-IT heads.  We are looking at just attaching the document rather than embedding,