JavaScript Print
You can use JavaScript to automatically open print dialogue box so that users can print the page. Although most users know they can do something like "File > Print", a "Print this page" option can be nice, and may even encourage users to print the page. Also, this code can be triggered automatically upon loading a printer friendly version.
Creating a "Print this page"
The following code creates a hyperlink and uses the Javascript print function to print the current page:
<a href="JavaScript:window.print();">Print this page</a>
The above code results in the following:
Print this pageTo automatically open the print dialogue box:
You can call the JavaScript print function upon loading a Printer friendly version. This will automatically open the print dialogue box for the user.
- Copy and paste the following code in between the <head> tags of the printer friendly version:
<script language="Javascript1.2"> <!-- function printpage() { window.print(); } //--> </script> - Add the following to your <body> tag:
onload="printpage()"
So, your body tag should look something like this:
<body onload="printpage()">Creating a "Print Version"
You can use Cascading Style Sheets to create a different print version of your web page. By this, I mean, you can apply different styles to each HTML element - you can apply one style to the screen version and another style to the print version. A common example is using a different font for the printed version or hiding "screen-only" elements.
To learn more, see the article on creating a CSS Print Version.
