Menambahkan Tombol Pin it Pinterest Pada Gambar

Gambar sepertinya sudah seperti suatu keharusan untuk setiap postingan artikel, karena gambar sangatlah berperan penting, selain sebagai alat untuk membuat tampilan blog lebih atraktif, gambar juga sangat berperan penting sebagai suatu alat untuk membuat para visitor merasa nyaman dan juga sebagai penjelas suatu topik yang ditulis.
Menambahkan Tombol Pin it Pinterest Pada Gambar
Menambahkan Tombol Pin it Pinterest
Sebelum saya masuk ke source codenya, saya akan menjelaskan terlebih dahulu apa itu pinteres ?, pasti banyak dari kawan-kawan yang bertanya-tanya apa sich Pin it (Pinterest), pinterest adalah Pin bisa berupa apa saja—hadiah, resep, atau bahkan penawaran. Pin itu seperti penanda buku kecil yang orang-orang tambahkan ke Pinterest dan selalu mengarah kembali ke situs asalnya (seperti milik Anda!), namun media pinterest ini baru-baru juga populer, mungkin kalau saya boleh menebak belum semua pengguna internet tau apa itu pinterest, nah pada artikel kali ini saya berharap bagi kalian pembaca sudah ada bayangan sedikit tentang apa itu pinterest. Oleh karena saya menganggap pin it itu penting, karena dengan adanya tombol pinterest ini pada setiap gambar yang saya upload berarti tidak menutup kemungkinan gambar-gambar itu masuk sebagai salah satu bagian yang mengisi wadah media pinteres itu sendiri, Oleh karena penting, bagi kamu yang berminat ingin menambahkan tombol pinteres seperti pada gambar diatas, kamu bisa mengikuti langkah-langkah berikut ini :

Note : Jangan lupa backup template kamu terlebih dahulu sebelum melakukan adegan ini, siyeeeee adegan wkwkwkwkwk.

Menambahkan Tombol Pin It

Langkah 1 : Login ke Blogger Dashboard => Pilih Template => Kemudian klik tombol Edit HTML


Langkah 2 : Masuk kearea code kemudian tekan tombol CTRL+F temukan code berikut ini
</body>
Setiap web/blogger pasti mempunyai tag </body>  ini, jadi hati-hati jangan sampai terhapus, karena kalau terhapus akan membuat tampilan blog kamu menjadi blank

Langkah 3 : diatas code </body> tambahkan script berikut ini :
<script>
//<![CDATA[
var custom_pinit_button = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtxM4m52welalIAg1AlQZIn7pVSWRZKUORFHmKfPCpj9AavxiEIoqugEpLUX0WOC09JZvd3tydOZCQMpc5UNx-p-IQadUWUkK9F91XBgumU_qEX4kq0Az-QB09p6wvmG2e7k2oCwdOHQsq/s1600/pinit-button.png";
var pinit_button_position = "center";
var pinit_button_before = "";
var pinit_button_after = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<script id='pinit-img-button' src='http://helplogger.googlecode.com/svn/trunk/pinterest-button1.js' type='text/javascript'>
// Visit helplogger.blogspot.com for more widgets and tricks.
</script>

Ubah posisi letak tombol pinterest

Pastikan script yang sudah kamu tambah betul semua, kemudian kamu bisa mengubah posisi tataletak dari tombol pinterest itu sendiri, karena tidak semua manusia sama kreativitas, seperti kata pepatah : Rambut boleh sama hitam tapi kreativitas tidak, oleh karena itu saya yakin pasti dari kalian ada yang ingin membuat tombol ini lebih tampil elegan dengan memposisikan tataletaknya.
var pinit_button_position = "center";
gantikan tulisan warna merah tersebut dengan salah satu code dibawah ini untuk merubah posisi letak tombol dengan code dibawah ini
topleft
topright
bottomleft
bottomright
Dan ubah tombol pin it! mouse hover sesuai keinginanmu, gantikan alamat url warna biru berikut dengan tombol yang kamu sudah tentukan
var custom_pinit_button = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtxM4m52welalIAg1AlQZIn7pVSWRZKUORFHmKfPCpj9AavxiEIoqugEpLUX0WOC09JZvd3tydOZCQMpc5UNx-p-IQadUWUkK9F91XBgumU_qEX4kq0Az-QB09p6wvmG2e7k2oCwdOHQsq/s1600/pinit-button.png";
Langkah 4 : Save Template kemudian jalankan template anda, sekarang arahkan kursor mouse pada gambar di blogger kamu maka akan muncul tombol Pint it! warna merah, tekan tombol tersebut dan akan diarahkan pada url www.Pinterest.com...

Bagi kamu yang ingin menghilangkan tombol pinterest pada gambar tertentu bisa menambahkan code dibawah ini pada url gambar halaman HTML postingan kamu
class="nopin"
perhatikan gambar dibawah

Menghilangkan tombol pinterest

itu saja dari saya, selamat mencoba dan salam hangat blogger

jangan lupa juga baca artikel : Cara Mengubah Label dan Menghapus.

Ditulis tanggal 26 Februari 2015

Bagikan Artikel Ini

Artikel Terkait

Previous
Next Post »

1 comments:

comments

Silahkan berkomentar sesuai dengan topik, setiap komentar akan direspons, dan mohon maaf sekali untuk komentar yang berbau P*RN*GRAFGI, *BAT, HACK, JUDI dan komentar yang mengandung link aktif tidak akan ditampilkan. Trimakasih atas pengertiannya.