Learn moreKontent.ai Horizons is back! Secure your free spot today.
Petal

3 easy steps to export headless content to PDF

It’s usual to serve content from your CMS to your customers via a website. Using a headless CMS like Kontent by Kentico, you can also create a mobile app or even a voice assistant. But what if you need to give your audience a PDF?


Dave KlementFeb 22, 2022

There is a number of ways to convert Delivery API responses to PDF or other formats. You can leverage a third-party service, or you can run a conversion script on your own server.

This article will show you how the Customer Education team at Kontent by Kentico handles exporting the content of Kontent Learn, its learning center, to PDF.

We decided to go with the service option and chose Api2Pdf. The service consumes styled HTML pages served via a URL and returns PDF documents. Easy. But wait—styled HTML? The Delivery API returns JSON, not styled HTML, right?

Yes. Let’s take it from the beginning to see how we did it.

Step 1: Prepare JSON data for PDF

Kontent’s Delivery API serves your content in JSON without visual information. To serve it to your customers, you need to add the visuals yourself. For websites, you assemble the content in HTML pages, style it with CSS and use Javascript for interactivity. 

But how do you do it for PDF documents? It’s very similar to webpages—HTML with CSS, just the CSS needs to be tailored to the fact that PDF documents aren’t responsive, comprise of pages, and so on.

As mentioned before, the Api2Pdf service consumes the URL of the article that you want to convert. What we do before we send the article to the service, though, is that we inject the article with a special CSS that accounts for the aforementioned PDF specifics.

Step 2: Create the PDFs

Now that we have the visuals prepared for PDF, we can convert the content. For each article in our learning center, we’ve added a button that lets our visitors download the particular tutorial in PDF.

This button calls a function on our back end that sends the article’s URL to the Api2Pdf service. The service processes the content and responds via API with a one-time link to the resulting PDF.

The Kontent Learn web app downloads the PDF to store it server-side for caching as well as to serve it to the customer who requested the PDF.

Step 3: Cache the PDFs

Caching is a well-known and used practice with websites, but it’s useful for this use case too. The goal here is to avoid calling the Api2Pdf service every time a visitor clicks the button to get an article in PDF.

The Kontent Learn web app stores the PDF files as well as metadata about content that has already been converted. When someone requests a PDF version of a tutorial, we check whether we have it in the cache. If we do, we serve the cached PDF, if we don’t, we call the Api2Pdf service.

You may ask why we store metadata about the converted content. Why not just the PDF files? The answer is cache invalidation.

The metadata we store for each PDF file contains the codename of the corresponding content item. When there’s a content change in the learning center, Kontent sends a webhook notification that contains codenames of affected content items. That makes it easy for us to decide which PDF files are affected and need to be deleted.

Conclusion

Kontent delivers your content in JSON structured based on your content model. When you receive the JSON from the Delivery API, it doesn’t specify any visual aspects of your content. This gives you the freedom to do whatever you want with the content. You can push it to your mobile app, transform it to styled HTML and serve it as a website, or you can feed it to a tool that generates a nice PDF with your printable price sheets, brochures, or anything else.

But it doesn’t stop with websites, mobile apps, and PDFs. You can feed the structured content into any channel in any format you want—the options are limitless.

Written by

Dave Klement

I came to Kontent.ai to write tutorials, and I quickly learned customer education is so much more than that. I write, make videos, create e-learning courses… Besides that, I love photography, Linux, FOSS, and linguistics. I also love the Czech language, so I’m an ardent promoter of using it correctly.

More articles from Dave