Crea una página fácil de imprimir con Gutenberg.css

Los diseñadores web a menudo se olvidan de impresión Porque parece mucho menos necesario hoy en día. Y esto puede ser cierto para sitios digitales como BuzzFeed.

Sin embargo, en sitios web informativos Todavía es una buena práctica ofrecer una hoja de estilo de impresión personalizada. Afortunadamente, no necesitas diseñar el tuyo porque Gutenberg está aquí para ayudar.

Nombrada en honor al inventor de la imprenta Johannes Gutenberg, esta biblioteca CSS es un recurso independiente para imprimir diseños de página.

Tu solo añade el gutenberg.css expediente en su cabeza de documento, y ya está todo listo.

Cada vez que un visitante vaya a imprimir su página debería automáticamente estilo basado en la configuración de impresión. Esto se puede configurar utilizando el media = "imprimir" Atributo HTML.

Echa un vistazo a esta guía si quieres aprender un poco más sobre imprimir hojas de estilo y como funcionan.

Lo bueno de Gutenberg es que viene con clases extra y estilos también.

Adéntrate en la carpeta de temas y encontrarás tres temas impresos alternativos: libro, moderno, y viejo estilo. Puedes hacer cualquiera de estos defecto Añadiéndolos en la parte superior de la predeterminada gutenberg.css expediente.

Tambien tu puedes estilo de la página de manera diferente para imprimir mediante la adición de clases específicas de CSS. Por ejemplo el .sin impresión clase hará ocultar completamente un elemento en el estilo de impresión.

Otro ejemplo es el adición de URL de enlace junto al texto. Gutenberg agrega esta función para facilitar que las personas encuentren las URL de su página. Pero puedes agregar el .sin reformateo clase en el elemento de anclaje a ocultar la URL.

Todo esto está cubierto en el repositorio de GitHub y es muy sencillo. Puedes tener a Gutenberg Instalado en menos de 5 minutos. y todo tu sitio será fácil de imprimir.

Esto es de lejos, una de las bibliotecas más simples y geniales para implementar para un mejor rendimiento del sitio. Puede agregar algunas KB adicionales, pero la experiencia general se mejorará drásticamente.

Si el contenido de su sitio alguna vez sea impreso por cualquier razon Entonces Gutenberg.css es un recurso indispensable..