Make a Print Page Facilities

Sometimes when I visit other sites, I often see the facilities to print their pages (print facilities page). This facility is quite useful because blog visitors can read our blog articles offline. To install a facility like this, we need a script that works to create the print page facility.

But we must have an image the printer first. If you are not skillful drawing, you can get a picture printer scattered on the internet. Go to the Google site, and type the printer icon. Then you will get the printer icon with the many various forms. Once you have a printer icon, upload to hosting. Or if you get a picture from the internet, copy the URL you live image, and stack into a HTML code. Examples such as this.

http://tbn2.google.com/images?q=tbn:6kOu0yBsScMsPM:http://www.axialis.com/objects/ip_icon_03_PrintOk.png -> My Icon URL

I make my URL icon with HTML code, so like this.

<img src="http://tbn2.google.com/images?q=tbn:6kOu0yBsScMsPM:http://www.axialis.com/objects/ip_icon_03_PrintOk.png"/>

The result like this.




Then I lower the size of the image to be like this.

<img style="width: 33px; height: 33px;" src="http://tbn2.google.com/images?q=tbn:6kOu0yBsScMsPM:http://www.axialis.com/objects/ip_icon_03_PrintOk.png" />

The result like this.



Ok, now I already have a printer icon that will be used to create a facility to print the page. If you want, you can also use the images for you to use the facilities in the print pages in the blog belong to you.




Now the steps must be done is combine HTML code of icon print with the print page facility script. Below are the script features the print pages that have been combined with the HTML code from the printer icon that we have.

<a href="javascript:print(document)"><img style="width: 33px; height: 33px;" src="http://tbn2.google.com/images?q=tbn:6kOu0yBsScMsPM:http://www.axialis.com/objects/ip_icon_03_PrintOk.png" />&#160;Print this page</a>


Red code is a script to create the print page facility, while the blue code is the HTML code from the image that we have. The result of above code is like this.

 Print this page

If you want to install the print facility in your blog page, you can just copy the HTML code below and install in your sidebar.

<a href="javascript:print(document)"><img style="width: 33px; height: 33px;" src="http://tbn2.google.com/images?q=tbn:6kOu0yBsScMsPM:http://www.axialis.com/objects/ip_icon_03_PrintOk.png" />&#160;Print this page</a>

You can also print the page to create facilities in the form of a button. Script to create printed page facilities in the form of a button like this.

<form>
<input type="button" value="Print this page" Onclick="print()" ;>
</form>

The result like this.

Ok, I hope you can follow this tutorial correctly. Good luck! Do not forget to digg this article!