Imprimir entradas en Blogger

Existen sencillas formas de incluir un botón para imprimir una página web, pero lamentablemente al incluir el botón también incluímos la página entera, es decir, cabecera, sidebar, u otro contenido irrelevante se imprime.

En el siguiente tutorial enseñaré a añadir un botón para imprimir sus entradas y a su vez que se imprima sólo el contenido de ésta.

El tutorial:

Paso 1: Añadiendo el botón para imprimir:

En "Diseño | Edición HTML" marcaremos la opción "Expandir plantillas de artilugios". Buscaremos el siguiente código:

<div class='post-footer-line post-footer-line-1'>

Debajo de este pegaremos el siguiente:

<a href='javascript:window.print()' id='imprimir' title='Imprimir Entrada'>Imprimir entrada</a>

Puedes usar una imagen como botón reemplazando "Imprimir entrada" por el siguiente código:

<img src='URL IMAGEN'/>

 Previsualiza los cambios y si son efectivos puedes guardar tu plantilla.

Paso 2: Editando el estilo al imprimir:

Haremos uso ahora de CSS para personalizar la hoja al imprimir mediante el siguiente código:

<style media='print' type='text/css'>
ATRIBUTOS
</style>

En él añadiremos todo lo que deseemos eliminar, para ello deberás establecer el valor "display:none". Veamos un ejemplo:

<style media='print' type='text/css'>
#header-wrapper {display:none;} /*Oculto la cabecera*/
#sidebar-wrapper {display:none;} /*Oculto la sidebar*/
#footer-wrapper {display:none;} /*Oculto el pié de página*/
.post {width:700px;} /*Aumento el ancho de la entrada*/
</style>

Este código deberás pegarlo antes de </head>.

Importante:

• Para ocultar algún otro objeto tienes que conocer el ID o clase del objeto en cuestión.
• Puedes ir previsualizando el resultado eliminando el código media='print', así podrás comprobar desde vista previa cómo se verá al imprimir pero no olvides volver a añadirlo ya que de lo contrario el blog se verá al igual que en la previsualización.