Dynamically generate a PDF with this script
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>