VERSIÓN IMPRESA DE LA WEB

peugeot · 25 Dic 2008, 19:14 · Solicitar retirada

Holas,

Deseo que, por favor, me indiquen cómo puedo hacer la versión impresa de una página de la web. Es decir, que se pueda imprimir solo el texto, sin imágenes, barra de navegación, cabecera ni pie de página.

Mucho agradeceré sus respuestas valiosas respuestas. :D

KenLego · 25 Dic 2008, 20:01 · Solicitar retirada

Para imprimir una pagina simplemente la das la funcion que viene en Javascript a un enlace:

[url="javascript:window.print()"]Imprimir esta página[/url]

Y si queres que en la impresion no se muestre un texto, entre <head>y</head> escribis esto:

<script>
function window.onbeforeprint(){
noImprimir.style.visibility = 'hidden';
noImprimir.style.position = 'absolute';
}
function window.onafterprint(){
noImprimir.style.visibility = 'visible';
noImprimir.style.position = 'relative';
}</script>

Y despues en el texto que no queres imprimir le agregas una ID con el nombre de "noImprimir", por ejemplo:

<p id="noImprimir">Texto no imprimible</p>

peugeot · 26 Dic 2008, 00:02 · Solicitar retirada

HOLA KENLEGO,

ya que hoy es 25, antetodo FELICIDADES y muchas gracias por responderme.

Probé con la primera línea de código:

Imprimir esta página

pero, no me salió. Los otros 2 códigos van juntos, verdaad? Pero esos son para no imprimir texto, o sea puras letras???

Lo que yo no quiero es que el navegante imprima la cabecera, menu lateral, fotos, pie de pagina, tú sabes, por el ahorro de tinta, pero que sí imprima el texto que está en el contenido. Trabajo con el html-kit.

Mil gracias, espero respuesta, cambio y fuera. :D

peugeot · 26 Dic 2008, 21:17 · Solicitar retirada

Hola kenlego,

buscando, aprendí la manera de cómo hacer la versión impresa con css, lo cual es mejor ya que se pone menos código en el html (que mientras menos código tenga, mejor). Y si te fijas en el código fuente de CCTW, verás que también tiene su versión impresa con css.

Me sirvió la primera línea de códigoi que me mandaste, nuevamente, te estoy muy agradecida y si alguien quiere hacer una versión impresa con css, comuníquense con peugeot.

saludos, :D :D :D

KenLego · 26 Dic 2008, 23:24 · Solicitar retirada

Hola, disculpa que no te pude responder, estuve un dia sin tocar la pc asi que no te pude responder :? Que bueno que lo hayas logrado, me dices el truco? :lol:

peugeot · 27 Dic 2008, 19:29 · Solicitar retirada

Por supuesto compañero que para eso estamos. Se trata de... 3 pequeños pasos:

1. Creas una nueva hoja de estilos.css y la enlazas con la hoja html tal y como lo hiciste con la primera (si llevaste el PASO A PASO TE PASO). Los códigos te quedarían asi en html:

<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
<link rel="stylesheet" href="estilos-print.css" type="text/css" media="print">

2. En la hoja de estilos-print.css, haces las modificaciones, por ejm. si no quieres que aparezca la cabecera (porque tienes allí tremenda fotaza), pondrás el sgte. código:

#cabecera{visibility:hidden; display:none}

o el pie de página o menu:
menu {visibility:hidden; display:none}

Yo recomiendo, si me permites:
poner todos los backgrounds en ffffff y letras en black. La impresora no lee dos columnas por lo que es preferible, eliminar los menús laterales.

Para el resultado de los cambios, no es necesario imprimir, basta con ir a Archivo en el extremo superior izquierdo y allí, clic en VISTA PREVIA DE IMPRESIÓN ya seas que estés en internet o html-kit.

Ahhh, no olvidar aumentar el tamaño de las letras y modificar el width del contenido (yo, de 800px, lo cambié a 700px).

Creo que no me olvido de nada más, eso es todo compañero, cualquier cosa, estamos por casa, cambio y fuera. :D