How to make Squarespace pages print friendly

Squarespace pages are not print friendly as per this Squarespace article.

They recommend

  • take a screenshot & print it - not too useful
  • create PDFs of the content - again not too useful
  • use a 3rd party tool - they refer to PrintFriendly
  • add custom code

We'll try PrintFriendly.  Here are some articles explaining how to.  The first 2 use PrintFriendly, and the 3rd uses site-wide code injection.

  1. https://answers.squarespace.com/questions/86410/need-a-printer-friendly-button-that-print-from-a-blog-post-not-the-entire-blog-page.html
  2. https://www.squaredesignguild.com/blog/print-recipe-squarespace
  3. https://answers.squarespace.com/questions/10685/how-to-make-website-printer-friendly.html

Try using method 1

Note that the way the www.repowernoosa.com website is constructed, the majority of the detailed content is managed using blog posts.

Follow the instructions for each set of blogs.  This will add a "Print Friendly" button at the bottom of each post in the blog, as per the image below:

Screen Shot 2018-06-13 at 2.45.48 pm.png

Make sure that the same code is injected for each of the blogs.

Screen Shot 2018-06-13 at 3.10.00 pm.png

As at 13 June 2018, the blogs as per the diagram have been set up for Print Friendly.

Other enhancements can be made to the button code, eg include repowernoosa logo, etc.  Refer to the Print Friendly button page.

Note that the free version of Print Friendly will show advertisements.

Problems:

Best to show images "inline" as a separate block, and not mixed in with text, as Print Friendly will skip printing the image & text.

And even after changing a page layout to take out image + text on in a layout, text & image can be removed from Print Friendly

A similar approach could be used for non-blog pages

Method 2

Used the code injection method as suggested - just to remove header & footer.

Note article is not quite correct - you go to Settings | Advanced |Code Injection    and then insert the code snippet into the Header section.

Seems to work better with graphics & text alignment.

Problem is that some text is garbled, eg lines marked as Heading 3.  Also button text, and side menu text.

Maybe this can be fixed with addition style rending for printing.....

Print Friendly and PDF