10 Juli 2012

Memasang Tombol Simpan Artikel dalam Bentuk PDF di Bawah Postingan


Sore ini saya mau share ilmu baru yang insya Allah cukup menarik. Anda mungkin pernah berkunjung ke sebuah situs professional, membaca salah satu artikelnya yang menarik, dan tepat di bawah artikel itu terdapat tombol yang bisa kita klik jika kita ingin menyimpan artikel itu dalam format PDF. Sehingga, jika kita ingin membacanya lagi, tak perlu koneksi internet. Tinggal cari file PDF yang telah kita simpan, and read it!
 
Saat saya tanya ke Kyai Google, sebagai tempat bertanya segala sesuatu di dunia maya, ada beberapa blog yang membuat tutorialnya. Hanya saja, menurut saya terlalu ribet. Ada yang harus ke situs pihak ketika, terus kita copas URL artikel yang kita baca dan ingin kita simpan, baru bisa kita  download sebagai dokumen PDF. Ada pula, yang hampir mirip dengan tutorial yang akan pembaca dapatkan disini, namun hasilnya tak professional. Ada iklan, dan masih berantakan.

Berbeda dengan semua itu, tutorial yang akan saya berikan insyaAllah memudahkan pengunjung blog kita untuk menyimpan artikel yang diinginkan dengan beberapa klik saja. Uniknya, konten PDF yang kita simpan jauh lebih keren dari yang lain karena bisa kita atur sendiri, memuat gambar atau tidak, bahkan kita dengan mudah bisa mendelete bagian artikel yang tidak kita inginkan. Yang penting juga, layanan ini tidak ada sedikitpun iklan, termasuk link penyedia layanan ini. Apalagi ukurannya lebih kecil, hanya berkisar sekitar 50 kb saja. Jauh lebih kecil dibanding yang lain, yang bisa sampe 500 kb. Asyik kan? Mau nyoba? lets go!

Pertama, silahkan buka situs penyedia layanan ini, printfriendly, gak pake daftar.

Kedua, pilih bar “Website Button” di bagian atas kanan situs. Bisa juga mengklik gambar bertuliskan “get your button” di tengah halaman.

Ketiga, silahkan anda klik sesuai type blog masing-masing. Setelah dipilih type blog, dan menentukan style yang kita mau, (untuk type blogger) maka akan timbul tombol “install on Blogger”. Klik tombol tersebut, dan silahkan ikuti langkah-langkah selanjutnya hingga selesai.

Jika anda kesulitan dengan cara tersebut, kita bisa memasang scriptnya secara manual. 

Caranya, klik link “add code directly to template” tepat di bawah tombol “install on Blogger” tadi. Ikuti petunjuk yang timbul setelah anda mengkliknya hingga selesai. 

Namun, jika anda ingin mengikuti cara saya, tentu saja boleh. Tapi ingat, harus berani nanggung resiko sendiri jika ada kesalahan dan merusak template blog anda. Karena ini hanya eksperimen saya saja, yang –kebetulan— berhasil. Bukti bahwa saya berhasil, bisa dilihat langsung di bawah postingan ini, bahkan bisa langsung nyoba nyimpan artikel ini. Silahkan!
Sebenarnya hampir sama dengan yang ditunjukan oleh situs printfriendly, hanya sedikit berbeda dalam menempatkan kode saja. Jika dari situs itu kita disuruh mem-paste kode setelah kode <div class='post-footer'>, maka saya meletakannya setelah kode <p><data:post.body/></p>. Baru kemudian save template. Apa hasilnya beda? Saya juga gak tahu!

Bagi yang males buka situs http://www.printfriendly.com berikut saya berikan kode yang bisa anda copy dan langsung paste di template blog. 
------------

<b:if cond='data:blog.pageType == &quot;index&quot;'><a class='printfriendly' expr:href='data:post.url + &quot;?pfstyle=wp&quot;' style='margin-right:1em; color:#6D9F00; text-decoration:none;' title='Klik disini untuk Menyimpan Artikel ini dalam Bentuk PDF'><img alt='Print Friendly and PDF' src='http://cdn.printfriendly.com/pf-button-both.gif' style='border:none;'/></a><b:else/><b:if cond='data:blog.pageType == &quot;archive&quot;'><a class='printfriendly' expr:href='data:post.url + &quot;?pfstyle=wp&quot;' style=' margin-right:1em; color:#6D9F00; text-decoration:none;' title='Klik disini untuk Menyimpan Artikel ini dalam Bentuk PDF'><img alt='Print Friendly and PDF' src='http://cdn.printfriendly.com/pf-button-both.gif' style='border:none;'/></a><b:else/><script src='http://cdn.printfriendly.com/printfriendly.js' type='text/javascript'/><a class='printfriendly' href='http://www.printfriendly.com' onclick='window.print(); return false;' style=' color:#6D9F00; text-decoration:none;' title='Klik disini untuk Menyimpan Artikel ini dalam Bentuk PDF'><img alt='Print Friendly and PDF' src='http://cdn.printfriendly.com/pf-button-both.gif' style='border:none;'/></a></b:if></b:if>

------------


Cara masangnya:
  1. Copy kode diatas, kemudian buka template blog anda
  2. Pilih edit HTML, dan beri centang “Expand Widget Templates”
  3. Kemudian cari kode <div class='post-footer'> (menurut situs printfriendly) atau kode <p><data:post.body/></p> jika mengikuti saya.
  4. Paste tepat di bawah kode tersebut.
WARNING: untuk menghindari hal-hal yang tidak diinginkan, maka saya menyarankan untuk mengikuti petunjuk yang diberikan oleh printfriendly saja. Dan yang tak kalah penting adalah backup template sebelum anda meng-editnya. 

Demikian tutorialnya, semoga bermanfaat!                

Print Friendly and PDF

Ditulis Oleh : Muhammad Tohir // 02.28
Kategori:

0 komentar :

Posting Komentar

Ikhwah fillah, mohon dalam memberikan komentar menyertakan nama dan alamat blog (jika ada). Jazakumullah khairan katsir

 
Semua materi di Blog Catatan Seorang Hamba sangat dianjurkan untuk dicopy, dan disebarkan demi kemaslahatan ummat. Dan sangat disarankan untuk mencantumkan link ke Blog Catatan Seorang Hamba ini sebagai sumber. Untuk pembaca yang ingin melakukan kontak bisa menghubungi di HP: 082256352680.
Jazakumullah khairan katsir.