How to add Print button on a page?

My requirement is to trigger a print page option on a button click as we can do it using the key combination Ctrl+p. Please help.

1 Like


Adding a print button is possible via custom Javascript and is very easy on DrapCode.

Below are the steps to do it:-

Step 1: Drop the Button component on the page

Screenshot 2022-04-07 at 12.48.34 PM

Step 2:: Change the type from Submit to Button

Step 3: Provide the Id to attribute the Button Component

Step 4: Go to the Page Settings > Advance > Javascript Code

Step 5: Add the Custom Javascript code in this Block
Please make sure to replace the button Id in this code correctly.

const printBtn = document.querySelector(’#print-button’);
$(printBtn).click(function() {

Step 6: Click Update button
So that the changes get saved with the page.

Step 7: Open the page in the Preview or Published mode

Step 8: Click the Print Button
And you will see that it has opened a prompt asking you to Print the page or save it as PDF.

Hope this works :grinning:

1 Like

Awesome! Thank you. :slight_smile: