Blogger Sayfalarına Yazdırma Butonu Ekleme

Blogger Sayfalarına Yazdırma Butonu Ekleme - Blog  yayınlarının çoğu bilgi ve öğretici yazılar olduğundan, blog okuyucuları genellikle bu yazıları yazdırmak (çıktı almak) isterler. Tüm tarayıcılarda mutlaka bir 'yazdır' seçeneği mümkün, ancak bu blog sayfasında bulunan ilgisiz alanlarıda (kener çubuğu, yorumlar vs.) kapsamakta ve fazladan kağıt, mürekkep ve zaman harcamaktadır.

CSS ve basit javaScript kombinasyonu kullanarak her bir blog sayfasından yalnızca blog yazısını almak için, basit ve kullanışlı yöntem sayesinde blogunuza bir yazdırma butonu ekleyebilirsiniz.

Bu yazımızda iki basit adımda yazdırma işlevselliğini Blogger sayfalarınıza nasıl ekleyeceğinizi anlatacağım.

Blogger Yazdırma Butonu Nasıl Eklenir?

Blog yazılarının hızlı, kolay ve düzenli bir şekilde yazdırılması (çıktı alınması) için, aşağıdaki adımları takip edin.

1- Blogger hesabınıza giriş yapın ve blogunuzun kumanda panelinin sol tarafında bulunan menüden Tema > HTML'i Düzenle yolunu takip ederek blogunuzun şablon editör sayfasını açın. CTRL+F yardımıyla </head> kodunu bulun ve aşağıdaki CSS kodlarını </head> kodunun bir satır üzerine ekleyin.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style media='print' type='text/css'>
.print-btn {position: absolute;right: 0;top: 10px;font-size: 20px;}
a.print-btn {color: #666!important;}
@media screen and (max-width:480px){.print-btn{display:none}}
</style>
</b:if>

2- Aşağıdaki javaScript kombinasyonlu HTML kodunu örnek kodda olduğu gibi <data:post.body/> kodunun altına blogunuzun görünümüne uygun olacak şekilde ekleyin ve şablonu kaydedin.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a class='print-btn' href='javascript:print(document)' target='_blank' title='Bu sayfayı yazdır'><i class='fa fa-print'/></a>
</b:if>

Örnek kod ekleme

<b:includable id='post' var='post'>
<article class='post hentry'.....
.....
.....
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<div style='clear:both;'/>
</b:if>
.....
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a class='print-btn' href='javascript:print(document)' target='_blank' title='Bu sayfayı yazdır'><i class='fa fa-print'/></a>
</b:if>
.....
.....
</article>
</b:includable>

Blogger Yazdırma Butonunun Faydaları

Bilgi veya öğretici blog yazılarını, okuyucuların yazdırabilmesi (çıktı alması) ve okuyabilmeleri için büyük fayda sağlar. Aynı şekilde blogcular da kendi blog yazılarını istedikleri zaman hızlı bir şekilde yazdırabilir. Böylece blog yazılarınızın çevrimdışı  bile okunmasını sağlamış olursunuz. Blogunuzun tanıtmını da yapmış olacaksınız ve blogunuzdan haberdar olan yeni okuyucular mutlaka blogunuzu ziyaret edecektir.

Bu yazımızda blog sayfalarına yazdırma butonu ekleme ile ilgili bilgiler paylaştık. Bu konu ile ilgili görüş ve sorularınız için yorum bırakabilirsiniz.