JS: boton para imprimir

Enviado por Webmaster el Julio 24, 2011 - 15:03

-Haga un botón para imprimir la página actual-

La impresión de páginas web puede parecer inútil pues nosotros webmasters utilizamos mucho la pantalla para leer contenidos en la red, pero no debemos subestimar la grande demanda por parte de los usuarios. Algunos usuarios desean imprimir para mantener una referencia de la información en papel o simplemente para leer tranquilamente más tarde en el metro por ejemplo. Las razones realmente no importan y es tan simple de hacer este botón que vale la pena ofrecer esta posibilidad.

 

El botón de imprimir

realidad, no vamos imprimir la página actual, sino vamos redirigir el usuario a una página adaptada para impresión que va automáticamente se auto-imprimir.

<form action="mipaginaparaimpresion.html" target="_blank">
<input type=submit value="Imprimir">
</ form>

Todo el secreto está en esta segunda página que se lanza en una ventana del navegador, se imprime y se cierra, todo de forma automática.

La página para impresion

El primer paso es hacer esta página adaptada para impresión. La mipaginaparaimpresion.html contendrá sólo la información esencial (no ponga encabezados, pies de página o barras laterales), no ponga colores (sólo si es absolutamente necesario), tampoco animaciones o funciones interactivas de modo general ... ya has entendido la idea, hay que se parecer mucho como una página de un libro. Para facilitar esta tarea debes adjuntar un archivo CSS que sea específico para todas las páginas para imprimir, a diferencia de las páginas usuales que utilizan el hermoso CSS que usas en tu sitio.

El segundo paso es bastante simple y hace toda la magia del botón de impresión. En el body tag de mipaginaparaimpresion.html debes agregar esta instrucción javascript:

<body onload="window.print();window.close()">

Esta tag mágica va, en primer lugar, abrir una ventana al usuario con sus habituales opciones de configuración de impresora, y luego, al imprimir o cancelar, la página se cerrará y el usuario vuelve al paso uno (donde está el botón de impresión), mientras que su página se inicia a imprimir.

¡Ya está! Lo único que realmente tienes que pensar bien es como crear una página que se ve bien en papel. Una vez que tienes todas las reglas de estilo correcto, sólo tienes que aplicar estas reglas CSS a cualquier otra página que deseas imprimir. Es una buena práctica hacerlo, aunque no para alentar la impresión de modo demasiado, como todos sabemos, nuestro planeta sufre de consumo irreflexivo. Dicho esto, a veces una página impresa puede ahorrar toda la energía que gastaría durante la lectura en un ordenador!

 


Añadir nuevo comentario