Keberadaan pasilitas Print This Page pada suatu Blog atau Website suatu keharusan bagi beberapa website Tools SEO Analisys seperti http://www.seocentro.com/ atau https://toolbox.seositecheckup.com , karena kalau tidak ada sarana Print This Page mengurangi score dan dianggap tidak bagus, dan kurang sempurna dinilai tidak Optimal.
Sebenarnya keberadaan Print This Page kalau ditelaah dan dipikir pikir ada baikknya juga, karena dengan adanya menu ini, memudahkan para pengunjung untuk nge print halaman suatu blog dan halaman Blog atau website bisa dilihat dengan mode Print.
Fitur print this page yang akan saya share berikut ini mungkin berbeda dengan yang ada di tempat lain, kaena pemasangannya dengan menggunakan Print.CSS. Bagi anda yang ingin memasang print this page dengan CSS berikut saya beri dua Cara Mudah Membuat Print This Page dengan Print.css di Blog silahkan pilih salah satu saja :
Catatan Penting :Selalu biasakan bakeup Template anda sebelum merubah Edit HTML, untuk berjaga jaga kalau terjadi error karena salah menempatkan code yang di modifikasi dan selalu Klik Pra Tinjau sebelum save hasil modofikasi
1. Cara Pertama Memasang Print This Page dengan CSS di Blog
1. Login keakun Blogger
2. Pilih Template » Klik Edit HTML
3. kemudian anda cari kode </head>
4. selanjutnya anda terapkan kode dibawah ini diatas </head>
<style type="text/css" media="print">
#header-wrapper,#header,.header, #sidebar-wrapper,.sidebar, #footer-wrapper,#footer,.date-header,.comment-link,.comment-footer,#comments,#blog-pager,.feed-links, #backlinks-container, #navbar-iframe,.dontprint {display: none;}
.post,#content-wrapper,#main-wrapper,#main{width:100%}</style>
5. Langkah berikutnya cari code <data:post.body/>
dalam beberapa template Blog ada dua atau tiga code <data:post.body/>
Selanjutnya copas code dibawah ini tepat dibawahnya code <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<span style='background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjISyqHPick_xmlP8yc0YiSjN5_PSYs4gpo9qXPFB8kQhZcX-_LnFRTbD_WMzM14EfsAab85wC8qSIpH-w90OzVJzBM8pq33m_tY4fa874IUphpxc25O0qSIruvm4MX_aCAYSPEqToRlqs/s1600/print-this.png) left no-repeat; padding-left: 25px;display:inline;'><a href='javascript:window.print()' rel="nofollow" >Print this post</a></span>
</b:if>
Catatan : Kalau anda ingin Logo Print berada di atas postingan letakkan code diatas diatasnya code <data:post.body/>
Kalau ingin dibawah postingan letakkan seperti instruksi No 5 diatas
2. Cara Kedua Memasang Print This Page dengan CSS di Blog
1. Login keakun Blogger
2. Pilih Template » Klik Edit HTML
3. kemudian anda cari kode ]]></b:skin>
4. selanjutnya anda copas kode dibawah ini diatas code ]]></b:skin>
.button-print{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhms3hzzoMjJjqTNOSX6-6S0QeGx5uwmcFfj8UrAT6xIa5IF3VCvwnVnCe5l5lKDcZ815MgwiMJ7hNxX6n02XonPBpOhOXOujQI0YJAYOcbA3ZrTuZkVPGR7s8yHI0jLQk0UYeDa5pZ8iQ/s1600/printerIcon.jpg);background-repeat:no-repeat;}
.button-print{font-size:10px;display:block;float:left;padding:4px 21px;}
5. Selanjutnya anda cari kode <data:post.body/>
6. kemudian anda copas kode dibawah ini :
<a class='dte_top-line-button button-print' data-icon='' href='javascript:window.print();' id='button-print'>Cetak</a>
 |
| contoh print page |
Catatan :
Jika anda ingin menerapkan diatas postingan terpkan kode diatasnya
Jika anda ingin memasang dibawah postingan anda terapkan dibawahnya
Demikian Cara Mudah Membuat Print This Page dengan Print.css di Blog semoga bermanfaat, pesan dari anda sangat saya hargai
|
|
