Printing/PDF/Emailing Help Center Articles

43 Comments

  • Colin Piper
    Comment actions Permalink

    Excellent article Wes (as always!). Implemented within seconds. 

    Have you tried adding th PrintFriendly css to the HC css and referencing that file to achieve consistent styling? Does it work?

    0
  • Wes Drury
    Comment actions Permalink

    @Colin - I haven't played around with the CSS styling yet so I'm curious on what exactly it does.  If you get a chance to try it out let me know.

    0
  • Colin Piper
    Comment actions Permalink

    I did not get enough time to actually make it work but I suspect I got a step along the path. I used the application-d9c,,,,,,33.css file that my HC uses (no idea if this GUID changes at all) and whilst I did not see any impact, I could see that this stylesheet was used but the style overwritten by other styles. 

    If i get a bit more time I will play again to see if I can finish the task off. I am not totally sure that I will achieve all that i want to but I should be able to override H1 and similar heading tags.

    0
  • Jessie Schutz
    Comment actions Permalink

    Great tip, as always! :)

    1
  • Wes Drury
    Comment actions Permalink

    Thanks Jessie :-)

    1
  • Irena Caranovic
    Comment actions Permalink

    Great script, but why is the PDF generated without pictures? 

    1
  • Wes Drury
    Comment actions Permalink

    @Irena - I'm not sure why the images are not showing on the PDF version. They show up correctly on the Printed version. May have to contact the developers of this plugin as it may be a bug.

    0
  • Andrea Saez
    Comment actions Permalink

    I couldn't get the button to show up either, at all. I tried moving the JS script over to the JS page, but still nothing..

    0
  • Wes Drury
    Comment actions Permalink

    @Andrea - The code should go into your Article Page so that it shows up on all articles.  What theme are you using and I'll see if I can replicate it. 

    0
  • Andrea Saez
    Comment actions Permalink

    Yeah I tried Wes, it's not working :( I'm on a customized version of the swiftest elk

    0
  • Søren Nødskov Hansen
    Comment actions Permalink

    @Irene & Wes, we are experiencing the same issue with the PDF not including images but I think I've narrowed it down to this:

    Publicly available articles have no issue generating PDFs with images. However, articles that needs authentication to be viewed (i.e. requires the user to log in to Zendesk) cannot generate PDFs with images.

    I tried downloading the Print Friendly JS and uploading it to Zendesk as an Asset. Initially, I thought it worked but it turned out to just be my browser cache toying with me so if anyone has a clever idea on how to solve this, I'd be most grateful.

    Thanks.

    /Søren

    2
  • Julz Fabs
    Comment actions Permalink

    Great article. Thanks for the info. Does anyone know where I can find a blank "how to print pdf email" to fill out?

    0
  • Vegardkolbeinsen
    Comment actions Permalink

    Is it possible to remove the URL at the top of the print?

    0
  • Wes Drury
    Comment actions Permalink

    @Vegardkolbeinsen - Since this is a third party tool you can read their documentation from here.

    0
  • Rory Kingan
    Comment actions Permalink

    This might be ok for some customers who have public help centers and don't mind spamming their customers with ads. A better solution would be a print css from Zendesk for the help center that renders articles suitably for printing. 

    2
  • Wes Drury
    Comment actions Permalink

    @Rory - I have this in my Production environment which is a private Help Center and have never seen any ads so I'm not sure what you are referring to about spamming customers with ads.  I've been using this solution for almost a year now with no ads.  Can you give some more details on this and where you are seeing ads at.  Yes this is a just a great work around solution until Zendesk comes up with a better solution. 

    0
  • Johannes Lindberg
    Comment actions Permalink

    This could be a useful solution for me.

    Unfortunately are the images not placed correctly in the pdf or print.

    Some images have right position, others are not placed at original position at all.

    Do anyone have some ideas to solve this?

    Ex in this article here:

    0
  • Pete LeRoy
    Comment actions Permalink

    This functionality is excellent, but recently we've noticed that all images appear to be floating right for Print and for PDF. We've attempted to select different Image Style options (see: http://www.printfriendly.com/button), but none seem to correct the issue. If you Inspect Element on images, it looks like the following CSS (PrintFriendly's, not Zendesk's) is controlling this:

    #pf-content img {
      float:right;
      clear:right;
      border:none;
      display: inline-block;
      margin:1em 0 1em 1.5em;
    }

    Is this a known issue with PrintFriendly? Thank you!

    0
  • Pete LeRoy
    Comment actions Permalink

    Just a follow up to my last question.We were able to resolve this issue by creating a custom CSS file and entering the file URL to the "Custom css url" field here: http://www.printfriendly.com/button.

    0
  • Ben Everist
    Comment actions Permalink

    We have videos embedded on our help centre and we have word content also. Any way to ignore the video and other unrelated information from when we print or create a PDF?

    0
  • Nessim Btesh
    Comment actions Permalink

    Hi everyone I created a script to transfer ZenDesk knowledge base to PDF 

    https://github.com/nesbtesh/zendesk-to-pdf

    0
  • Steve Wiseman
    Comment actions Permalink

    An alternative is to author the content in a CCMS outside of Zendesk and push the articles into Zendesk. We have partnered with Paligo for just this. They have a direct integration with Zendesk. Paligo is also a completely cloud based solution. 

    So with Paligo you can create PDF books, reuse content, have multiple versions of articles, keep versions of product versions and other tools professional technical authors use. 

    Click https://sales.contextengage.com/hc/en-us/articles/115000812229 for more. We give weekly demo webinars. Links from the page. 

    0
  • Russur
    Comment actions Permalink

    Is there a way to either when you create a pdf or send a file to be printed to a pdf, to append to an existing pdf?

     

    0
  • Steve Wiseman
    Comment actions Permalink

    @Russur. Please see my comment previously.

    We also provide a service to create PDFs from your HC content. If that can help, please write to swiseman@contextengage.com

    0
  • Johannes Lindberg
    Comment actions Permalink

    I still have troubles With images that are floating in the middle of the text.

    Pete, you wrote "We were able to resolve this issue by creating a custom CSS file and entering the file URL to the "Custom css url" field here: http://www.printfriendly.com/button."

    Can you please explain that further? How do you create a custom CSS file and from where do you get the URL?

    Wes, are Zendesk going to develope something about this print issue soon?

    So we doesn`t need to use PrintFriendly including Ads?
    Customers got ads after they hit the button, but before they print or generate PDF.

    0
  • Pete LeRoy
    Comment actions Permalink

    Johannes,

    You don't create a custom CSS file, you use your existing Help Center CSS file, then add to it. Here are the steps I used:

    1. Right-click any page in your Help Center, then click View page source
    2. Search for <link rel="stylesheet" type="text/css". The CSS file URL should start out with something like this: https://p5.zdassets.com/hc/themes/
    3. Right-click the CSS file URL, then click Copy link address  
    4. Access printfriendly, then paste the CSS file URL into the Custom CSS field
    5. Copy the code generated at the bottom of the screen
    6. Access Help Center > Customize Design > Edit Theme > Article page
    7. Paste the code directly above the <footer></footer> tags
    8. Within the pasted code, wrap the <a></a> tags (these are after the <script> tags) in <div align="middle"></div>
    9. Access Help Center > Customize Design > Edit Theme > CSS
    10. Add the following CSS after the rules for "body": 

      #printfriendly img {
      float:none;
      margin-top: 12px;
      margin-right: 12px;
      }

      #pf-content img {
      float:none;
      clear:right;
      border:none;
      display: inline-block;
      margin:1em 0 1em 1.5em;
      }

    11. Click the Save button
    12. Click the Publish button 

     Pete

    0
  • Johannes Lindberg
    Comment actions Permalink

    Thanks a lot for Your reply Pete.

    Your comment actually solved the problem:

    " You don't need to create a custom CSS file, you can use the CSS file used by Zendesk in your Help Center.

    Right-click any page in your Help Center, click View page source, then search for <link rel="stylesheet" type="text/css". The CSS file URL should start out with something like this: https://p5.zdassets.com/hc/themes/.

    Access printfriendly, then enter the full URL of the CSS file into the Custom CSS field. This should generate the code you need to insert into your Article pages to correctly display images in your articles."

    Only problem now is missing images in PDF.

    0
  • Pete LeRoy
    Comment actions Permalink

    Johannes,

    You're welcome. I actually added to my comments from yesterday. I'm glad you didn't need the additional steps. 

    Pete

    0
  • Agustin Collazo
    Comment actions Permalink

    Hi, this is really useful, however the downloaded file is not attaching the images. Any idea about this?

    Thanks

    Agustin

    0
  • Pete LeRoy
    Comment actions Permalink

    Agustin and other Zendesk clients experiencing the problem with PDF's not displaying images,

    I just submitted the following issue to PrintFriendly's Support:

    "We love the PrintFriendly print/email/PDF functions. however, we and several other Zendesk clients are experiencing a problem. When creating a PDF version of an article, images are not displaying. Alt text is displaying, but not the image itself. Printed version of articles are displaying images just fine. Any ideas? Thanks"

    Note: per a PrintFriendly help article titled PDF: Images Not Included: "The Email and PDF features can be affected if the content is not publicly accessible or in a secure network. Typically, the images do not get included in the PDF."

    Thanks,

    Pete

    0

Please sign in to leave a comment.

Powered by Zendesk