jQuery Print, ziyaretçinin web sayfanızın yalnızca belirli bir alanını yazdırmasına izin veren basit bir jQuery eklentisidir.
Özellikle navigasyon yönergeleri bulunan projelerde, yazdırılacak sayfanın yalın olabilmesi artık her zaman mümkün olamayabiliyor. Böyle durumlarda sayfanın sadece belirli bir bölümünün yazdırılması seçeneği önümüze çıkıyor. Bunun için kullandığım bir kütüphaneyi sizlerle paylaşmak istiyorum.
Nasıl kullanılır? (Örnek)
1. HTML öğenizin yazdırılabilir olmasını istediğiniz alana benzersiz bir ID belirtelim.
<div id="printable"> "Yazdırılabilir alan burasıdır." </div>
2. Belirtilen alanımızı yazdırmak için bir button oluşturalım.
<button class="print"> Yazdır </button>
3. jQuery kütüphanesini ve jQuery print eklentisini içeri aktaralım.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="jQuery.print.js"></script>
4. Yazdır butonunda yazdırmak istediğimiz alanı yazdıralım.
<script type='text/javascript'>
$(function() {
$("#printable").find('.print').on('click', function() {
$.print("#printable"); //Yazdırma işlemini burada tetikliyoruz.
});
});
</script>
5. Yapılandırma ayarları (İsteğe bağlı)
$(function() {
$("#printable").find('.print').on('click', function() {
$("#printable").print({
// Genel ayarlar
globalStyles : false,
// Geçerli URL bilgisini de yazdır
mediaPrint : false,
//Font
stylesheet : "http://fonts.googleapis.com/css?family=Inconsolata",
//Gizli iframe yazdır
iframe : false,
// Bu alanı yazdırmaz
noPrintSelector : ".avoid-this",
// Üste ekleme yapar
append : "Fatih Soysal<br/>",
// Alta ekleme yapar
prepend : "<br/>fatihsoysal.com",
// Manuel olarak form verilerini yükler
manuallyCopyFormValues: true,
// Yazdırma sonrası kodu yeniden yapılandırır.
deferred: $.Deferred(),
// timeout
timeout: 250,
// Başlık
title: null,
// document tip
doctype: '<!doctype html>'
});
});