Creați o pagină Print Friendly cu Gutenberg.css

Deseori, designerii web uită imprimare pentru că se pare că este mai puțin necesară în zilele noastre. Și acest lucru poate fi valabil și pentru site-urile digitale precum BuzzFeed.

Cu toate acestea, pe site-uri web de informare este încă o bună practică de a oferi o foaie de stil tipărite personalizată. Din fericire, nu aveți nevoie să creați propria dvs. deoarece Gutenberg este aici pentru a vă ajuta.

Numit după inventatorul presei Johannes Gutenberg, această bibliotecă CSS este o resursă autonomă tipăriți paginile.

Doar tu adaugă gutenberg.css fişier în capul dvs. de document și sunteți toți pregătiți.

Ori de câte ori un vizitator merge pentru a imprima pagina dvs. ar trebui în mod automat restyle pe baza setării de imprimare. Acest lucru poate fi setat folosind media = "imprimare" Atributul HTML.

Consultați acest ghid dacă doriți să învățați ceva mai mult stiluri de imprimare și cum funcționează.

Chestia frumoasă despre Gutenberg este asta vine cu clase suplimentare și stiluri de asemenea.

Dig în folderul teme și veți găsi trei teme de imprimare alternative: carte, modern, și stil vechi. Puteți face oricare dintre acestea Mod implicit prin adăugarea lor pe partea de sus a implicit gutenberg.css fişier.

De asemenea, puteți stilul paginii în mod diferit pentru imprimare prin adăugarea de clase specifice CSS. De exemplu, .nu-print clasa va ascunde complet un element în stilul de imprimare.

Un alt exemplu este adăugarea URL-urilor de link-uri lângă text. Gutenberg adaugă această caracteristică pentru a facilita identificarea de către utilizatori a adreselor URL din pagina dvs. Dar puteți adăuga .no-Reformata clasa pe elementul de ancorare la ascundeți adresa URL.

Toate aceste lucruri sunt acoperite de replica GitHub și este foarte simplă. Poți avea Gutenberg instalat în mai puțin de 5 minute iar întregul site va fi prietenos pentru imprimare.

Aceasta este de departe una dintre cele mai simple și mai binite biblioteci de implementat pentru o performanță mai bună a site-ului. Poate adăuga câteva KB suplimentare, însă experiența generală va fi îmbunătățită drastic.

Dacă conținutul site-ului dvs. ar putea fi vreodată imprimate din orice motiv Gutenberg.css este o resursă indispensabilă.