Najprostsze i najszybsze rozwiązanie, to użycie gotowej funkcji języka JavaScript: print(), która uruchomi okienko kreatora wydruku. Jeśli nie masz w systemie zainstalowanej drukarki to zgłoszony zostanie wyjątek.
Przykład z wydrukiem całej zawartości strony:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Drukowanie strony</title> </head> <body> <h1>window.print()</h1> Lorem ipsum dolor sit amet, exerci molestiae an est, ea falli reprimique contentiones est. Id agam recusabo disputationi his, saperet legendos comprehensam no usu, modus harum eum no. <p><a href="#" onclick="javascript:window.print()">drukuj temat</a></p> <footer>Copyright © 2016 e-spin.pl</footer> </body> </html> |
Po Kliknięciu na hiperłącze “drukuj temat” nastąpi wywołanie okienka wydruku. Wydruk dotyczy całej zawartości strony, tak więc wydrukowane zostanie menu strony, nagłówek, stopka itp (czyli cała zbędna zawartość, nie mówiąc już o niepotrzebnej stracie tuszu :). Aby tego uniknąć można w osobnym folderze zapisać pliki z właściwą treścią do drukowania, a na stronie umieścić hiperłącza z odwołaniem do nich, jak w przykładzie poniżej:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Drukowanie strony</title> </head> <body> <h1>window.print()</h1> Lorem ipsum dolor sit amet, exerci molestiae an est, ea falli reprimique contentiones est. Id agam recusabo disputationi his, saperet legendos comprehensam no usu, modus harum eum no. <p><a href="print/gotowy.html">wydrukuj temat</a></p> <footer>Copyright © 2016 e-spin.pl</footer> </body> </html> |
Plik gotowy.html z zawartością do wydruku:
|
1 2 3 4 5 6 7 8 9 10 11 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Treść do wydruku</title> </head> <body onload="javascript:window.print()"> Lorem ipsum dolor sit amet, exerci molestiae an est, ea falli reprimique contentiones est. Id agam recusabo disputationi his, saperet legendos comprehensam no usu, modus harum eum no. </body> </html> |
Polecenie onload=”javascript:window.print()” wklejamy do znacznika <body>, tak że po otwarciu strony (onload) automatycznie uruchomiony zostanie proces wydruku.
Ostatni już sposób to skorzystanie z właściwości media=”print” i zapisanie osobnego pliku ze stylami CSS, w którym ukrywamy niepotrzebne elementy strony za pomocą np:
display:none.
|
1 |
<link href="print.css" rel="stylesheet" media="print" /> |
Przykład zawartości pliku print.css:
|
1 |
header, footer, nav { display:none; } |
I to wszystko, do następnego! ==>
