Configurar pagina para imprimir

cmlm19 · #1 (**permalink**) 05/04/2006, 15:50

Saludos a tod@s

Se me ha presentado esta situación: necesito imprimir una de mis paginas desde un boton "IMPRIMIR"! el detalle es que necesito que NO se imprima el encabezado ni el pie de pagina! y debe hacerlo sin instalar ningun componente adicional.

Una opcion es configurando la pagina desde codigo javascript! y la otra que se me ocurre es que se mande a mostrar la ventana de configuracion de pagina del navegador (IE) para que el usuario haga la configuracion manualmente! ESTA ULTIMA ES LA MENOS COMODA PARA EL USUARIO

Por favor si a alguien sabe o se le ocurre una manera de hacer esto se lo agradezco de antemano!

Saludos

KarlanKas · #2 (**permalink**) 06/04/2006, 02:56

Hay una forma mucho más sencilla que es por medio de CSS. Consiste en hacer una hoja de estilo para la impresora en la que puedes poner que no imprima una cosa u otra o cambiando el tipo de las letras o que no imprima las imágenes... lo que queiras...

la forma sería poniendo:

<link rel="stylesheet" type="text/css" href="impresora.css" media="print" />

y creando el archivo impresora.css con el estilo para imprimir.

cmlm19 · #3 (**permalink**) 06/04/2006, 09:45

Gracias por la idea compañero!
De verdad nunca me imaginé que se pudiera hacer con CSS! aunque no tengo idea de como se hace

pero voy a buscar por alli a ver que encuentro y solucionar este pequeño rollo

Gracias nuevamente!

Saludos!

AnDrEa MM · #4 (**permalink**) 07/04/2006, 04:09

¿Podrías profundizar un poco en esta forma de imprimir...?

Cita:

en la que puedes poner que no imprima una cosa u otra

NO entiendo cómo se puede especificar desde un .css qué partes de una página imprimir... Si yo tengo una página con una tabla q tiene 3 celdas, una superior en la q va el título de la página, una izquierda en la q va un menú y una central q es donde va el contenido de la página, ¿puedo especificar de alguna manera q quiero imprimir sólo esa parte última de la página?

¿Se podría hacer lo siguiente:? Generar, sin q sea mostrada al usuario, una página html con el contenido q deseo imprimir (sería el q está en la celda central de mi página inicial...), y q esa página sea la q se imprima? Igual me estoy liando y os estoy liando demasiado, pero no encuentro la manera para poder imprimir sólo lo q deseo.

Muchas gracias

KarlanKas · #5 (**permalink**) 07/04/2006, 05:10

Vamos al foro de CSS donde seguro que te orientan!

JavierB · #6 (**permalink**) 07/04/2006, 05:21

Hola a todos.

En la FAQ-178 de JavaScript puse un código para imprimir parte de la página.

Saludos,

AnDrEa MM · #7 (**permalink**) 08/04/2006, 04:02

Funciona perfecto!
Dejo un consejillo q a mí me dió un error al principio: Todo el código debe estar entre etiquetas <div>, si no es así, lo q quede fuera también será imprimido.
Muchas gracias por compartir esos códigos tan útiles JavierB!!!

cmlm19 · #8 (**permalink**) 08/04/2006, 05:59

Es cierto! esta bueno el ejemplo!
Pero mi duda inicial aun persiste

la cuestion es que aun se sigue imprimiendo el encabezado y el pie de pagina!

edudw · #9 (**permalink**) 08/04/2006, 13:44

Hola.

Te recomiendo hacer una pagina nueva y una hoja de esilos nueva para la impresion.

Jesusguevarautomotri · #10 (**permalink**) 08/04/2006, 15:05

No entendi muy bien ejemplo. aparece esto, donde se supone que esta lo oculto? Hago clic en donde dice "imprime 1" por ejemplo y me abre la ventana de imprimir pefecto, hubiese sido bueno que colocaras el texto a ocultar.

Artículo primero
Imprime 1
Artículo segundo
Imprime 2
Articulo tercero
Imprime 3

AnDrEa MM · #11 (**permalink**) 09/04/2006, 05:10

Hola Jesus!
Prueba el código, si no tienes impresora, imprime el resultado en un PDF para q puedas probar el código.
Te explico el resultado para el ejemplo q puso JavierB en la FAQ:
Si pulsas "Imprimer 1", te imprime la frase "Artículo primero", q es lo q se encuentra en el div 'uno', q es a lo q hacer referencia el enlace pulsado. "Artículo segundo", "Artículo tercero" y los enlaces no son imprimidos. Y ocurre lo mismo si pinchas en "Imprime 2" --> se imprime sólo la frase "Artículo segundo", y lo mismo ocurre con el tercer enlace. Te recomiendo q lo pruebes. Yo al mirar el código no terminaba de entenderlo...

pero pruébalo y verás como entiendes todo mejor.

Un saludo, AnDrEa

***********

Por cierto, no sé si he contestado a tu pregunta... jeje.
El texto q se oculta es lo q esté entre etiquetas <div> q no sea la llamada en el enlace pulsado. Es decir, al pinchar en:

Código HTML:

<a href="#" onclick="impre('uno');return false">Imprime 1</a>

Se imprime sólo lo q está entre las etiquetas
<div id='uno'> contenido_q_se_imprime </div>
Lo q está ente otras etiquetas
<div id='distinto_de_uno'> contenido_q_no_se_imprime </div>
no se imprime. El contenido q no esté entre etiquetas <div></div> también se imprime!!.

No sé si he sabido explicarlo o he liado las cosas... Pruébalo!! jeje, es como mejor lo vas a entender.

Jesusguevarautomotri · #12 (**permalink**) 09/04/2006, 10:59

Ahhh, ahora si entiendo, gracias amigo.

Jorolo · #13 (**permalink**) 09/04/2006, 13:15

Hola a todos.

No entiendo por qué os complicáis tanto la vida.

Tampoco entiendo que hace aquí tanto código javascript. Si este es el foro de CSS.

Con CSS puede hacerse de multiples maneras, por ejemplo:

Código HTML:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">

<head>
<meta http-equiv="Content-Type" content="text/xml; charset=UTF-8" />
<title>Prueba de impresión con CSS</title>
<style type='text/css' media='screen'> 
p { border: dashed red 1px; }
</style> 
<style type='text/css' media='print'> 
.noimprimir { display: none } 
</style> </head>

<body>
<!-- Prueba el código en cuatro fases:
1º- visualiza la página en la ventana del navegador.
2º- visualiza la página usando la vista preliminar (a la impresion)
3º- Los desconfiados pueden, si quieren, impimir la página
4º- Comentanos los resultados. -->

<p>Parrafo 1: En la ventana del navegador deben verse dos parrafos</p>
<p class='noimprimir'>Parrafo 2: Pero solo debe inprimirse uno, el primero</p>

</body> </html>

Algadir · #14 (**permalink**) 14/06/2006, 09:36

Hola buenas:

Pues a ver si podeis ayudarme porque lo intento por activa y por pasivo y no consigo lo que quiero. A ver, rediseñando la web estoy usando capas y CSS, para empezar, no hay tablas ni nada. Lo que intento es que se imprima la ficha de un libro. Para ello uso una capa llamada "ficha" y dentro diversas capas que contienen datos del libro, una llamada "portada", otra llamada "datos" (título, autor, isbn...) y otra llamada "sinopsis". En la capa "portada" inserto la portada del libro y debajo están las opciones que permiten imprimir y comprar el libro. Hasta ahí creo que está claro. La cuestión es que yo lo tengo así montado:

Vínculos a las css:

...
<link rel="stylesheet" type="text/css" href="../../../../css/estilo.css" media="screen">
<link rel="stylesheet" type="text/css" href="../../../../css/impresora.css" media="print">
...

La hoja impresora.css tiene de momento este código:

div, a {
display: none;
}

.ver {
display: block;
}

.nover {
display: none;
}

y luego el código dentro de la capa ficha uso la llamada a la función impre como en el código que explicó JavierB:

...
<script>
function impre(num) {
document.getElementById(num).className="ver";
print();
document.getElementById(num).className="nover";
}
</script>
<br><a href="#" class="boton" onclick="impre('ficha'); return false">Imprimir</a>
...

Pues bien, montado así como explico no me imprime nada. Sale el cuadro de diálogo de imprimir, le doy a imprimir, parece que va a imprimir pero la impresora no hace nada, vamos que hace como que no hay nada que imprimir. ¿En qué puede fallar?. Espero que podais ayudarme porque ando desesperadito con ganas de conseguir que me salga.

Un saludo y gracias de antemano.