PrintFriendly Print Button

We make it easy for you to add a button to your site that enables your users to create printer-friendly versions of your web pages, export your pages to clean PDFs, and even email links to your pages to other users.

Our button is perfect for news publications, recipe websites, blogs, and any other website where users might want to cleanly print the page without ads or navigation. Follow the steps below to create your custom button and then simply add our code to your site.

Get Started

Step 1

Choose the button that you would like to add to your site

Step 2

Configure image settings

Choose which image would you like to appear at the top of your printer-friendly pages. You can select your website icon, which will use the favicon for your site. Or, you can choose to upload an image

Show Images
OFF

Show images on your pages

Choose whether you would like to show images on your printer-friendly and PDF pages.

This option lets you choose how you would like images positioned on your printer-friendly pages.

Step 3

Custom CSS (Optional)

To customize the styling of the content or for hiding elements in Print/PDF, you can use custom CSS.

Add Custom CSS

Use a CSS File

Enter the URL to your CSS file in the custom CSS input and use the generated button code.

Use printfriendly-css tag

You can add printfriendly-css tag to the page with the CSS enclosed within it along with the button code. 

            
<printfriendly-css style="display: none;">
  h4 {
    font-size: 24px !important;
  }
</printfriendly-css>
Sample Customizations
Note

Scope your CSS roles to #printfriendly and add !important to override the default styles

Customize the margin of Print/PDF

            
@media print {
  @page {
    margin: 5mm !important;
  }
}

Hide URL

            
#printfriendly #pf-src {
  display: none !important;
}

Hide Title

            
#printfriendly #pf-title {
  display: none !important;
}

Use Google Fonts

            
/* Use the Inter Font */
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

#printfriendly {
  font-family: 'Inter', sans-serif !important;
}

Print/PDF in Landscape

            
@media print {
  @page {
    size: landscape !important;
  }
}
Step 4

Configure PrintFriendly features

Email
ON

Allow to share pages via email

This option shows an Email button on our PrintFriendly window. Choose whether your users can email your page URLs to other users.

PDF
ON

Allow PDF download

This option adds a PDF button on our PrintFriendly window. Choose whether your users can export your printer-friendly pages to PDF format.

Print
ON

Allow users to create printer-friendly versions of your web pages.

This option adds a Print button on our PrintFriendly window. Choose whether you would like your users to create printer-friendly versions of your web pages.

Click to Delete
ON

Allow users to delete content from your printer-friendly pages.

This option lets your users delete content from your printer-friendly pages before they print or PDF those pages. Users are not able to delete content from your actual website.

Pro Exclusive Features

Encode images
OFF

Encode images in base 64.

Enable this feature if your site is not publicly accessible or if your provider blocks image requests from third parties (Ex. Zendesk) or if images are not present in PDF

Show hidden content
OFF

Include content that's not visible

By default PrintFriendly Pro will only show the visible content on the page. Enable this feature if you want PrintFriendly to show hidden content. (Ex. Content in hidden tabs)

Step 5

Insert this code where you want your PrintFriendly Print Button to appear.

Get PrintFriendly Pro

PrintFriendly Pro is GDPR compliant, plus has a lot of great features. Purchase now for your domain.

Learn About Print Button Pro