Als Webdesigner, Entwickler oder Websitebesitzer ist es selten, dass Sie die Seiten Ihrer Website drucken müssen. Wenn jedoch die Notwendigkeit besteht und Sie Ihre Webseiten an einen Drucker senden müssen, möchten Sie sicher sein, dass sie auf dem Papier genauso gut aussehen wie auf dem Bildschirm.
Wenn Ihre Website nicht druckfertig ist, sehen Ihre Seiten nicht nur auf dem Papier durcheinander aus, sondern werden möglicherweise auch als Druck von geringer Qualität auf Papier wiedergegeben. Das ist natürlich nicht das, was Sie oder Ihre Webbesucher sehen wollen. Denken Sie daran, dass nicht alle Webbesucher Webinhalte online lesen.
In diesem Beitrag besprechen wir, wie man eine WordPress-Website druckfertig macht, damit jede gedruckte Seite auf dem Papier gestochen scharf und ordentlich erscheint. Erstens, was braucht man für eine druckfertige Website?
Warum Ihre WordPress-Website druckfertig machen?
Sie könnten sich zu Recht fragen, warum Sie Ihre Website druckfertig machen müssen, wenn man bedenkt, dass die Mehrheit der Internetnutzer digitale Geräte zum Surfen im Internet verwendet. Die Wahrheit ist, dass Sie keine Annahmen darüber treffen sollten, wie die Leute Ihre Website-Inhalte lesen. Tatsache ist, dass die Mehrheit der Website-Besucher Inhalte direkt online liest, aber es ist gut, auf die wenigen einzugehen, die Ihre Webseiten ausdrucken. Und wenn man bedenkt, dass es nicht viel Arbeit ist, eine Website druckfertig zu machen, gibt es wenig Gründe, dies nicht zu tun.
Im Allgemeinen sollten Sie alle Möglichkeiten berücksichtigen, auf die auf Ihre Inhalte zugegriffen werden kann, einschließlich Druck. Im Wesentlichen möchten Sie auf alles vorbereitet sein, wofür Ihre Webbesucher Ihre Inhalte verwenden möchten. Wenn ein Leser beispielsweise einen Beitrag findet, der für seine Arbeit relevant ist, und diesen als Referenzpunkt in einer Präsentation verwenden möchte, möchte er ihn ausdrucken. Sie wissen einfach nie, wer Ihre Website besucht und wie sie den Inhalt verwenden. Wie kann Ihr WordPress-Blog mit gestochen scharfer Klarheit sowohl auf digitalen Bildschirmen als auch auf Papier rendern?
Druckfertige WordPress-Plugins
Wie bei WordPress-Fixes zu erwarten, gibt es immer ein Plugin zur Rettung. Das Schreiben Ihres eigenen CSS für den Druck ist mächtig, erfordert jedoch ein wenig Planung, ganz zu schweigen von den zusätzlichen Stunden beim Testen und Beheben von auftretenden Problemen. Wenn Sie sich also beim Schreiben von CSS nicht die Hände schmutzig machen wollen, greifen Sie einfach zu einem Plugin, um die Arbeit zu erledigen. Es gibt verschiedene Plugins, die Sie je nach Komplexität des Layouts Ihres Blogs verwenden können. Hier sind ein paar Tipps, die Sie in Betracht ziehen sollten:
Einfaches WordPress-Plugin zum Teilen in sozialen Netzwerken
Easy Social Share, eines der beliebtesten Plugins von CodeCanyon, ist vollgepackt mit großartigen Funktionen, die es Ihren Lesern leicht machen, Ihren Blog zu teilen. Das Plugin bietet nicht nur Unterstützung für mehr als 20 große soziale Netzwerke, sondern auch eine nützliche Druckoption, die Sie zu jedem Beitrag oder jeder Seite hinzufügen können. Und da die Schaltfläche Drucken in allen Social-Sharing-Schaltflächen enthalten ist, ist dies eine schnelle und nahtlose Möglichkeit, Ihrer Website eine Druckoption hinzuzufügen.
Druckfreundliches und PDF-Button-freies WordPress-Plugin
Print Friendly und PDF Button erstellt Druckversionen Ihrer Webseiten mit einem Klick auf eine Schaltfläche. Anschließend können Sie die Seiten als PDF speichern oder auf Papier ausdrucken. Es unterstützt mehr als 20 Sprachen und passt die Sprache automatisch an die Spracheinstellungen des Benutzers an. Das Plugin bietet eine Reihe weiterer Funktionen und das Beste ist, dass Sie es kostenlos (mit Werbung) verwenden können. Wenn Sie die werbefreie Version wünschen, müssen Sie ein Abonnement erwerben.
WP Print Kostenloses WordPress-Plugin
Dies ist ein weiteres großartiges kleines Plugin, das Ihren WordPress-Blog ohne Probleme druckfertig macht. Es hat nicht so viele Funktionen wie das vorherige Plugin, aber es verfügt über einen respektablen Satz von Einstellungen zum Steuern der zu druckenden Seitenelemente. Auf der Webseite wird eine einzelne Druckschaltfläche angezeigt, mit der Benutzer eine druckfertige Version jeder gewünschten Seite erstellen können.
Benutzerdefiniertes CSS für den Druck
Wenn Sie mit der Codierung vertraut sind, ist CSS ein guter Ausgangspunkt, wenn Sie Ihren WordPress-Blog druckfertig machen möchten. Um Ihre Website druckfertig zu machen, müssen Sie im Wesentlichen einige CSS-Stile schreiben, um Elemente auszublenden oder anzuzeigen, damit sie auf dem Papier klar sind. Wenn Ihr Thema nicht druckfertig ist oder Sie benutzerdefinierte Druckstile hinzufügen möchten, erstellen Sie zuerst ein untergeordnetes Thema, damit Sie Ihr benutzerdefiniertes CSS hinzufügen oder Ihr bevorzugtes benutzerdefiniertes CSS-Plugin installieren und aktivieren können.
Jetzt müssen Sie nur noch Ihre benutzerdefinierten Druckstile (CSS) hinzufügen, um Ihre Webseiten druckfertig zu machen, und das ist auch einfach. Machen Sie einfach eine Deklaration und schreiben Sie dann Ihre Stile wie folgt in diese Deklaration:
@media print { /* your print styles */ }
Die Deklaration ist eine Medienabfrage, die die angegebenen Stile verwendet, um das Aussehen Ihrer Webseiten beim Drucken zu steuern.
Bei der zweiten Methode fügen Sie alle Ihre Druckstile in eine separate CSS-Datei ein. Dies ist eine sauberere und organisiertere Art und Weise, Dinge zu erledigen, und ist besonders praktisch, wenn Sie Wartungsaufgaben für Ihren Blog durchführen. Erstellen Sie einfach eine neue CSS-Datei, schreiben Sie Ihre Stile (vergessen Sie nicht, mit dem zu beginnen @media print -Deklaration und laden Sie dann Ihre benutzerdefinierte Druck-CSS-Datei in Ihr Design. Was Sie in Ihre Stildatei einfügen, liegt ganz bei Ihnen, aber im Grunde nehmen Sie alles auf, was in der Druckversion Ihres Blogs erscheinen soll.
Hier sind einige allgemeine Richtlinien für das Styling für den Druck:
- Es gibt einige Teile, die Sie in Ihrer Druckversion nicht sehen möchten, z. B. die Seitenleiste. In diesem Fall, wenn Sie
display: none
Um diese Teile auszublenden, ordnen Sie die verbleibenden Blöcke neu an, damit Ihre Seiten beim Drucken nicht durcheinander aussehen. - Verwenden Sie Punkte für Schriftgrößen anstelle von Em- oder Pixelmaßen, die für digitale Bildschirme am besten geeignet sind. Drucker hingegen funktionieren am besten mit Punkten.
- Die Druckversion Ihres Blogs sollte die volle Breite verwenden. Auf digitalen Geräten ist es gut, die Breitengrößen zu begrenzen, aber auf Papier sieht dies nicht gut aus.
- Entfernen Sie Inhalte im Kommentarbereich, insbesondere wenn Ihr Blog ein sehr aktiver Blog ist.
- Navigations- und Fußzeileninhalt entfernen (einfach verwenden
display: none
auf diesen Elementen). In den meisten Fällen ist der Textinhalt auf Ihren Seiten in Druckversionen das Einzige, was zählt, daher sollte es Ihr Hauptaugenmerk beim Schreiben Ihres Druck-CSS sein. - Ergänzend zum vorherigen Punkt sollten Sie auch erwägen, alle Bilder auszublenden, es sei denn, sie sind für das Verständnis des jeweiligen Textinhalts unbedingt erforderlich. Natürlich sollten alle anderen interaktiven Medienelemente standardmäßig ausgeblendet werden, da sie auf dem Papier nur unübersichtlich sind. Links sollten ebenfalls entfernt werden, da sie auf dem Papier bedeutungslos sind.
WordPress.org hat ein schönes Beispiel für ein Druck-Stylesheet, das Sie beim Schreiben Ihres als Referenz verwenden können. Sehen Sie es Hier.
Einpacken
Eine Website druckfertig zu machen, ist etwas, woran viele Leute nicht denken, wenn sie ihre Websites erstellen. Es ist jedoch wichtig, von Anfang an sowohl für Web als auch für Print zu designen. Wenn Sie dies jedoch nicht getan haben und sich jetzt in einer Klemme fühlen, ist es ziemlich einfach zu beheben. Da es so einfach ist, die Druckstile in Ihr Theme zu implementieren, sollten die meisten Leute – sogar WordPress-Neulinge – diese Änderungen selbst vornehmen können, insbesondere wenn Sie eines der oben empfohlenen Plugins verwenden.
Planen Sie also, Ihren Blog druckfertig zu machen? Wenn Sie diese Maßnahmen bereits ergriffen haben, wie ist es gelaufen? Ich würde gerne alle Ihre Erfahrungen in den Kommentaren unten hören.