Blog

Dynamically generate a PDF from your CMS powered posts

August 25, 2023

Need to generate up to date PDFs of your CMS content but don't want to repeatedly update the document in addition to the posts? 

Embed this script into your webflow template page and you will be able to generate up to date PDFs of your CMS content on demand.

This script with generate the download button (see button HTML element) that will trigger the generation of the PDF and open that file in a new tab while maintaining the styling from your CMS.

Open up an HTML Embed block and paste the code in there and hit publish. You should be good to go!

This utilizes the "html2pdf.js" library. The documentation can be found HERE.

<button id="pdf-btn">Download Page</button>
<!-- Include html2pdf library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
<script>
document.getElementById('pdf-btn').onclick = function () {
// Your html2pdf code here.
var element = document.getElementById('main-asset-content');
 var opt = {
 margin:       1,
 filename:     '{ add title field here }.pdf',
 image:        { type: 'jpeg', quality: 0.98 },
 html2canvas:  { scale: 2 },
 jsPDF:        { unit: 'in', format: 'letter', orientation: 'portrait' }
 };
html2pdf(element, opt);  
 }
 </script>