Drucken Button auf einer Website.
Ich würde gerne einen Drucken Button in eine Website einbinden um eine Visitenkarte zu drucken diese ist eine png Datei. Hätte jemand vielleicht eine Idee wie dier Script lauten könnte?
2 Antworten
Folgende Beispiel Webseite bietet bei aktiviertem JavaScript einen "Drucken" Button, ansonsten einen Druck-Hinweis. Wird die Seite gedruckt, wird NICHT der Inhalt, sondern NUR ein Visitenkarten-Bild gedruckt ... weiter nichts! Das Visitenkartenbild ist aber beim normalen Betrachten der Webseite unsichtbar! Das funktioniert in allen gängigen Browsern auch völlig ohne JavaScript oder irgendwelche Bloat-Bibliotheken. Einzig und allein der Button zum Ausführen der Druckaktion benötigt JavaScript. Aber wenn man z.B. die Seite über das Browsermenü druckt, gibt es auch hier keine Probleme:
<html>
<head>
<title>Lorem</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- Folgenden CSS-Code ans Ende(!) von HEAD -->
<style type="text/css">
#vcard {
display:none;
visibility:hidden;
}
@media print {
* {
display:none;
visibility:hidden;
}
html, body, #vcard {
display:block;
visibility:visible;
}
#vcard {
display:inline-block;
margin: 0 auto;
}
}
</style>
</head>
<body>
<h1>Lorem 2 ...</h1>
<p>... ipsum dolor sit amet ...</p>
<!-- Button-Code irgendwo in die Seite, egal wo -->
<noscript>Bitte drücken Sie Strg+P um die Visitenkarte zu drucken.</noscript>
<script type="text/javascript">
document.write('<img src="drucken.png" onclick="window.print();" />');
</script>
<p>Foo, bar, baz, qux, ...</p>
<!-- Visitenkarten Bild ans Ende(!) von BODY -->
<img src="visitenkarte.png" id="vcard" />
</body>
</html>
Du könntest bei druck auf den Knopf ein neues Fenster öffnen, mit dem Inhalt (Der Visitenkarte) diese Ausdrucken und die Seite dann schließen lasse.
Hier mal ein Pseudocode aus dem Internet. Den musst du natürlich deiner Website anpassen und soll dir an dieser Stelle nur einen denkanstoß geben.
https://www.tutorials.de/threads/fenster-oeffnen-inhalt-drucken-fenster-schliessen.162771/
Mit PHP kenne ich mich leider noch überhaupt nicht aus... aber deine Idee finde ich gut...