Cara Membuat Share Post ke Social Bookmark Menggunakan Share Pack

Banyak cara untuk mempercantik tampilan blog teman-teman dengan sedikit menambahkan aksesori di dalamnya, salah satu nya adalah dengan menambahkan Share Post ke Social Bookmark Menggunakan Share Pack.

Share Pack ini berfungsi sebagai widget yang digunakan untuk memudahkan pengunjung membagi artikel teman-teman ke jejaring sosial, seperti Facebook, Twitter, Technorati, dan lain sebagainya. Teman-teman bisa melihat contoh dari widget ini pada blog saya ini atau bisa langsung melihat,

Lihat pict 1

Jika sudah tidak sabar lagi untuk membuatnya, teman-teman silahkan mengikuti langkah-langkah di bawah ini.

1. Login ke Blogger, lalu seperti biasa, klik Tata Letak >> Edit HTML,
2. Untuk mencegah hal-hal yang tidak diinginkan, backup dulu template blog teman-teman. Klik Download Template Lengkap,
3. Kalau sudah, klik checkbox Expand Template WIdget,
4. Lalu cari kode berikut, ]]></b:skin>
5. Copy kode berikut persis berada di atasnya,

.share, img.share{ border: 5px outset; border-color:#FFFFFF #000000 #000000 #FFFFFF;} .share:hover, a:hover .share{ border: 5px inset; border-color: #585858 #A4A4A4 #A4A4A4 #585858; }

6. Lanjutkan dengan mencari kode berikut ini, <p><data:post.body/></p>

7. Lalu taruh kode ini persis berada di bawahnya,

<b:if cond='data:blog.pageType == &quot;item&quot;'> <b>Share This Post to Others:</b><br/><br/> <div align='center'> <a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to Facebook'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5WF5kjnszSsK8D-R0tQGywzsT2bOA6J77tF4_2wrYZ_T12HYDm3giA4gsk_G_-ElTGRM0-Jfk1jmvwzxy6DkEqlfuAAOtsFELNLr_5U_-_-mqpmIft4S2rOXMIOpBbGBq8JRiKthJItM/s320/facebook.png'/></a> <a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to Twitter'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh159GhEws5md2-E2Y42WMx6bv0s7pIYkxayctTvXAqhGr-Ft5eCUQIKkU6dUnpBiYtUFeH1jhmLiDDxBQnmIeNPB0zvqCTYLGgos-203NkEUNVGcEZ4vC7cDJ0WQ22v_wjJ-aOwCJiWk8/s320/twitter.png'/></a> <a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to Digg'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsq4dwVWMCg2NNvensDfIdZgf5SsVIQJCAQye-EY1gsk-SWIljBrpqC-eul56oE-oEXWc-YywkUMs1yaOCGzdeNgzAaQ6NxEsp_9koMntcInhrq5wWv9Pw_97_LGpNnLwhGdgwV5kORZ4/s320/digg.png'/></a> <a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to Del.icio.us'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzEqhNLpFeJulRXUEel0p94CCV8bDNwYEkuXlGkBzbPnGkdncQq0HxcKttPTnV62q6ESTlZcYPy-GHFcGnl1PmtQGaNBgAmdqZjrmsnROyb-LnoJSf8mM2ASKYbAYNfNke5B3bY08SZFg/s320/delicious.png'/></a> <a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to StumbleUpon'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx5psk-XLWC73IR-V2jffehi6KvxNcfV4ZshJRwCE9AGsRTWFoI0laPxd8Q19ZJpYek0aaS4wrGMek6K3pgUTTU8KtW6INp641nCaj7zSjrgeaeABeNkZhhucqKsQqxzR2CjmBTwGX8yM/s320/stumbleupon.png'/></a> <a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share to Technorati'><img class='share' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpV05VfURP614hk4YWERhXVAzJ-5UJWQnUEV0f-fQr-2Wn5Lq8-u6YJ-4or7rqcGsEDSVuzYMnGb_Qrz4VzfQMOXpDrYIn1LbetQvRomURTC5EcRNScN0uUm43qAACcVtwZqZWQTetw_Q/s320/technorati.png'/></a> </div> </b:if>

8. Simpan dan untuk melihat hasilnya klik View Blog.

9. Sebagai contoh hasil dari Share Post ini saya mencoba share ke Facebook saya sendiri,

Lihat pict 2

Note: Icon-icon yang saya pakai sebagai contoh dan saya gunakan ini saya ambil dari di sini. Jika teman-teman semua mempunyai koleksi icon menarik lainnya, silakan ganti alamat yang berwarna hijau untuk ikon Facebook, biru muda untuk ikon Twitter, merah untuk ikon Digg, biru tua untuk ikon Delicious, kuning untuk ikon Stumbleupon, dan jingga untuk ikon Technorati dengan alamat ikon masing-masing.

Selamat mencoba Membuat Share Post ke Social Bookmark Menggunakan Share Pack !