Membuat Facebook Share Tanpa Script

Facebook share merupakan salah satu cara paling manjur untuk meningkatkan visitor ke blog, oleh karenanya kita perlu memasang fasilitas facebook share di blog kita. Namun terkadang tutorial yang diberikan biasanya menggunakan script, memang lebih praktis namun sisi lainya tentunya semakin banyak script yang menempel bisa menurunkan kecepatan blog. Karena itu saya ingin membagi sedikit ilmu bagaimana membuat facebook share tanpa script.

Sebenarnya fasilitas dari blogger sendiri sudah ada untuk facebook share, dan lengkap lagi dengan twitter serta google plus. Hanya saja letaknya yang terlalu bawah membuat pembaca sulit untuk mengetahui kalau itu adalah fasilitas untuk share. Oleh karena itu kita perlu membuatnya di atas, lebih baik di bawah judul supaya jelas. Pertanyaan selanjutnya bentuknya akan seperti apa facebook share ini? ok lah, bentuknya ga jauh dari gambar di bawah ini  :

Script Untuk Facebook share

Ada dua script harus kita masukkan, yang pertama letakan script ini di atas ]]></b:skin>

.fbshare-noscript{height:18px; overflow:hidden; height:18px; padding:2px; Border-bottom:1px solid #E5E5E5; Border-top:1px solid #E5E5E5}
.category1{padding-left:10px; margin-left:5px; font-size:11px}
.category1 a{color:#ef9237}
.subs{padding-left:20px; background:url("http://4.bp.blogspot.com/-DbVHpvqZN8g/TwcqFF6V7XI/AAAAAAAAEbA/NfYvOXxEk7M/s000/tweet.png") no-repeat scroll left; margin-left:20px; font-size:12px}
.subs a{color:#86c3e7}
.subs1{padding-left:20px; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjv4imiDV2rqUI0HlJVka1mKpLTbMGjI908rrNmBNX59XicLedB583nHPuD9lpXdBnlgjBZqBe79BR8L5SRIL39olxY4ovMHJDUx9hfjex99E2v33A8sl6dtvt9GWZVssaWGn7r9thDZQc/s1600/fb.png") no-repeat scroll left; margin-left:20px; font-size:12px}
.subs1 a{color:#3b5998}
.subs2{padding-left:20px; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-gFU8kyUhqcl-HD4zjWPCXDjeGEnFdIcsk6IVWr1nYm8G-69lCoKj5jyOTSY0DrzxDOtCh5_FpCfL-AJuc0L9PNyQOlTBFUNq6xwolzQgLU7l-ZKdoIsE0ZVzdMZWK_MPyFYymGlyB5nU/s1600/mail.pngmargin-left:20px") no-repeat scroll left; margin-left:20px; font-size:12px}
.subs2 a{color:#BA0101}

Selanjutnya, script yang berikutnya di taruh di atas data:post.body yaitu :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='fbshare-noscript'>
<span class='category1'>
Share Article :
      </span>

<span class='subs'>
<a expr:href='&quot;http://twitter.com/home?status=Reading &quot; + data:post.title + &quot; &quot; + data:post.url' target='_blank' title='Post this article on Twitter'>Tweet Share</a>
</span>

<span class='subs1'>
<a expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'>FB Share</a></span>

<span class='subs2'>
<a expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'>Email Share</a>
</span>

</div>
</b:if>

Cara memasukannya seperti biasa kedika anda memodifikasi template, yaitu melalui edit HTML. Bagi yang masih awam bisa masuk ke :
1. Buka acount blogger
2. Pilih bagian
3. Masuk ke Template, edit HTML
4. Centang Expand Widget Templates
5. Tempatkan kedua kode di atas pada tempatnya
6. Save dan lihat hasilnya.

Pertanyaan selanjutnya bagaimana kalau kita menemukan post.body lebih dari satu. Saran saya masukkan ke yang kedua, atau anda bisa mencobanya terlebih dahulu sehingga pas untuk di lihat. Dan jangan lupa untuk menyimpan template anda terlebih dahulu unuk menjaga jaga kalau kalau ada terjadi kesalahan.

Dari scrip di atas anda bisa memodifikasi lebarnya dengan mengubah angka yang berakhiran px,  atau mengubah  beberapa sesuaian warna yang di awali kode #. Semoga bermanfaat dan selamat ngutak atik facebook skcriptnya