Jump to content

Add a "print" button all of my blog posts in the header

Recommended Posts

  • Replies 2
  • Views 598
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

you could inject something like this. best to do it in the "post blog code injection" as this happens after the blog has been rendered. in this example i've appended the link to my blog-item-meta-wrapper which is a 7.1 layout, but I'm not sure what your layout is.

I think you should probably change .blog-item-meta-wrapper to .Blog-meta for your site.

<script>
  const printLink = document.createElement("a");
  printLink.setAttribute("href","#");
  printLink.setAttribute("id","printlink");
  printLink.onclick=(e) => { e.preventDefault(); window.print(); }
  printLink.appendChild(document.createTextNode("Print"));
  document.querySelector(".blog-item-meta-wrapper").appendChild(printLink);
</script>

you can then style this link in your custom css by attaching a rule to #printlink

 

Dave Hart. Software/Technology Consultant living in London. buymeacoffee 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.