Cum să adăugați un buton de imprimare pe pagina dvs. Web

Știi, ceva de genul adăugării unui buton de tipărire pe o pagină web este destul de simplu, nu? De fapt, de ce trebuie chiar să adăugăm orice buton de tipărire sau link către pagină, când totul trebuie să faceți este să faceți clic pe “Fişier” și “Imprimare… ” din meniul browserului?

În cele din urmă, diferiți oameni doresc caracteristica de imprimare pe pagina lor web din diferite motive. Poate doriți să adăugați comoditate. Când cititorul poate doar să facă clic pe un buton pentru a obține o imprimare - salvează câteva clicuri, iar fiecare clic se numără. Alți oameni doresc să personalizeze textul imprimat - cu alte cuvinte, ascund anumite elemente ale paginii din imprimat. În alte situații, oamenii preferă să creeze o versiune a site-ului web, care să poată fi imprimată cu atenție personalizată.

Pentru fiecare dintre aceste situații, există soluții diferite. Întotdeauna am încercat să oferim soluții inovatoare de imprimare aici la MUO, cum ar fi articolul lui Justin despre imprimarea pe jumătate de pagini Salvarea hârtiei prin formatarea și imprimarea fișierelor cu instrumentul de impunere Govert [Windows] Salvarea hârtiei prin formatarea și imprimarea fișierelor cu impunerea guvernatorului Instrumentul [Windows] Hârtia costă bani. Salvați ambele prin imprimarea fișierelor PDF pe jumătate de pagini. Indiferent dacă doriți o broșură sau o copie alăturată, un instrument gratuit pentru Windows nu numai că face acest lucru posibil, dar și simplu. Încetați să deranjați ... Citește mai mult și articolul lui Karl despre PrintWhatYouLike PrintWhatYouLike - Salvați hârtie și cerneală la imprimarea paginilor web PrintWhatYouLike - Salvați hârtie și cerneală la imprimarea paginilor web Citiți mai multe. În acest articol voi oferi patru modalități prin care puteți integra un buton de imprimare sau o legătură în site-ul dvs. - de la abordarea foarte simplă a HTML și Javascript, la abordarea CSS mai personalizabilă.

Integrarea tipăririi pe site-ul dvs.

Când vă uitați la o pagină Web, este destul de ușor să vedeți de ce ați putea personaliza imprimarea. O pagină web tipică are anunțuri, bannere, linkuri de anunțuri, bare laterale și secțiuni de subsol care nu fac altceva decât să mănânce spațiu de pagină și să consume hârtie.

Dacă aveți un site destul de simplu sau nu vă pasă cu adevărat dacă toate graficele și formatele de imprimare sunt sau nu, atunci tot ce trebuie să faceți este să adăugați un simplu buton la pagina dvs. web și să utilizați “imprimare()” metoda javascript pentru a trimite pagina web la imprimantă.

Plasarea acestui cod în site-ul dvs. într-o locație care este rapidă și ușor de cititorii dvs. de a utiliza arata ceva de genul asta.

Toți cititorii trebuie să facă clic pe buton, iar pagina va fi trimisă direct la imprimantă fără nici o formă de formatare a paginii. Dacă pagina depășește lățimea imprimabilă a imprimantei, este posibil să reușiți să imprimați mult mai multe pagini decât este de fapt necesar.

Unii oameni nu-i plac foarte mult apariția unui buton de formular, deci ca o alternativă puteți folosi pur și simplu o legătură cu javascript-ul încorporat pentru a face același lucru.

 Imprimă această pagină 

Puteți vedea cum, în multe cazuri, un text simplu arată mult mai curat decât un buton, dar pe care îl folosiți într-adevăr coboară, ceea ce arată mai bine în zona paginii web unde doriți să furnizați caracteristica de imprimare.

După cum puteți vedea din exemplul de imprimare de mai sus, formatarea multor anunțuri și bannere nu se potrivesc perfect ecranului browserului atunci când pur și simplu utilizați comanda de imprimare. Acest lucru devine mult mai evident pentru site-urile mai complexe. O altă metodă pe care o utilizează utilizatorii este să blocheze întreaga secțiune a site-ului utilizând CSS și să aloce anumite secțiuni ale paginii pentru imprimare. Faceți acest lucru conectând mai întâi fișierul CSS în secțiunea antet.

Apoi, va trebui să creați fișierul CSS real și să-l salvați în același director ca și pagina dvs. Web. Fișierul CSS ar trebui să aloce toate secțiunile paginii care nu ar trebui să fie imprimate și apoi să facă și elementele paginii pe care le atribuiți să le imprimați ca vizibile.

 DIV # header, DIV # newflash, DIV # banner display: none; corp visibility: hidden; .print vizibilitate: vizibil; 

Acum, că fișierul dvs. CSS este configurat, tot ce trebuie să faceți este să treceți prin pagina dvs. și să etichetați fiecare secțiune cu “imprimare” clasă.

  Această linie va fi imprimată. Această linie nu va.  

Acum puteți vedea în imprimat unde numai secțiunile paginii marcate cu “imprimare” clasa se imprimă pe pagină și toate celelalte secțiuni nu sunt. Singura dificultate cu această abordare este că trebuie să vă asigurați că ați oprit afișajul pentru toate secțiunile DIV pe care nu doriți imprimate. După cum puteți vedea mai jos, nu am adăugat “div” secțiunea pentru anunțul Google, astfel încât să fie încă imprimată.

Poate dura ceva timp pentru a construi fișierul CSS și pentru a stabili clasele corect. Dacă într-adevăr nu vreți să vă deranjezi să faceți acest lucru pe fiecare pagină, atunci puteți opta pentru o ultimă abordare. Aceasta este tehnica mea preferată pentru furnizarea de versiuni perfect imprimate ale paginii web. Tot ce trebuie să faceți este să creați o versiune formatată în format PDF a conținutului paginii web, să o salvați pe gazda dvs. web și apoi să conectați fișierul în antetul paginii.

Asta e tot ce trebuie sa faci! Aveți posibilitatea să încorporați butonul de imprimare pe site-ul dvs., la fel ca în exemplele de mai sus, dar în loc de fișierul CSS încărcat pentru metoda de imprimare, fișierul PDF, DOC sau alt fișier este trimis la imprimantă. După cum vedeți mai jos, aceasta generează cea mai curată versiune imprimabilă a paginii dvs. și puteți personaliza destul de mult pentru a arăta exact cum doriți.

După cum puteți vedea, există o mulțime de opțiuni de alegere atunci când doriți să plasați un buton de imprimare sau un link pe pagina dvs. Web. Oricare dintre aceste opțiuni funcționează bine, însă alegerea potrivită se reduce la cât de complexă este pagina web și ce conținut doriți să oferiți cititorilor dvs. atunci când aleg să imprime pagina dvs. web.

Ați încercat oricare dintre aceste tehnici pentru a adăuga un buton de imprimare pe o pagină web? Ce tehnică vă place cel mai bine? Aveți alte soluții? Împărtășiți-vă perspectiva în secțiunea de comentarii de mai jos.

Credit de imagine: Sundeip Arora

Explorați mai multe despre: Imprimare, Dezvoltare Web, Instrumente pentru webmasteri.