Display content only in PDFs

There are two ways to customize the look and feel of individual article PDFs.

For general structure/layout of individual articles, go to Settings > PDF and adjust the settings there--you can add a watermark, password, header HTML, and footer HTML.

But if you want to show or hide content in PDFs, custom CSS is your friend.

The class "hg-pdf" is added to our PDF downloads. You can use this class to style elements differently in your PDF downloads. Add this class before the element you want to target, and you can create customized styles for your PDFs!

Here's how to add your logo to your PDFs:

Go to Settings > Style.
Below the preview pane, select Custom HTML.
Select Article from the Custom HTML dropdown.
Near the top of your article, wherever you'd like the logo to appear, add some HTML for your logo. We recommend using a div overall with a class of "pdf-logo", and putting the image inside that div, like this:
```
<div class="pdf-logo" align="center">
      <img src="https://dyzz9obi78pm5.cloudfront.net/app/image/id/1111/n/pdflogo.png" />
</div>
```
If you use the above code as a sample, be sure to replace the img src in row 2 with a URL of a valid image file in your File Library!
Go to Custom CSS.
Copy the CSS below and paste it into your Custom CSS. The first CSS here will hide the PDF logo in the live knowledge base; the second will display it only in PDFs.
```
/* Hide PDF logo in live knowledge base */
.pdf-logo {
    display:none;
}

/* Display PDF logo in PDFs only */
.hg-pdf .pdf-logo {
    display:block;
}
```
Be sure to Save your changes.

Note: Once you make changes to PDF styling, you'll only see these changes once PDFs are regenerated. For the Standard PDF and Custom PDF exports, you can generate these yourself. For individual article PDFs, save the article with a small change (such as some added text or a new paragraph break) to regenerate the PDF to see if you like your changes. Once you have the styling the way you want, contact us to regenerate all your article PDFs.

Related Articles