How to add Print Button on an online form?

[kamal286c]

I would like to add a Print Button on an online form for user to print before submitting the form.

[Indra · Accepted solution]

@natsumimori thanks for mentioning!

Hi @kamal286c,

You can add a Rich text field to the form and add custom markup in there.

So I tried to add a button with a print function on it but this isn't allowed.

This code won't work:

<button onclick="window.print()">Print this page</button>

What you should do is create a custom function that will trigger an element on your page.

So your richt text module will look like this:

<a class="print-page">Print this page</a>

Your custom JS will look like:

document.addEventListener('click', function (event) {

  // If the clicked element doesn't have the right selector, bail
  if (!event.target.matches('.print-page')) return;

  // Don't follow the link
  event.preventDefault();
  window.print();

}, false);

[natsumimori]

Tagging in @Indra here- is this something you have experience with?

[kamal286c]

Thank you natsumimori for your clarification. Looking forward to understand how the custom development works.

[natsumimori]

Hi @kamal286c , thank you for your post.

From what I understand, there's currently no native HubSpot feature that adds "print" button on your form, so this will require some custom development works. @Jake_Lett and @JBeatty , would you be able to share your advice here?