Senin, 30 November 2015

Cara Menambahkan Fans Page Facebook di Blog

Suatu hari Fenny pernah mengirimkan pesan ke salah seorang teman yang juga sering berbagi tutorial blogging. Pasalnya, Fenny ingin menambahkan fans page di blog. Fenny sudah mengikuti cara membuat fanspage facebook di blog sesuai petunjuk di halaman resmi facebook. Namun yang ada malah hanya muncul teks nama fanspage saja. Grrrrrhhhhh....


Sebagaimana diketahui bahwa facebook membuat kode script yang bisa digunakan untuk memasang fanspage facebook di blog yang cukup di copy-paste. Lengkap dengan cara menambahkan fan page di blog. Berikut cara berdasarkan petunjuk resmi dari halaman facebook.




Dulu, cukup dengan copy kode yang berasal dari kotak iframe. Tapi hasilnya hanya muncul teks nama fanspge. Rupanya untuk cara memasang fan page di blog terbaru versi facebook harus menambahkan script "pemanggil" yang harus di copy-paste ke script html template facebook. Bagi Fenny mudah saja menambahkan ke script hmtl. Masalahnya kemudian ada script yang ditolak blog. Tandanya ada peringatan teks warna merah di bawah tombol Simpan. Geregetan deh apalagi teman yang Fenny japri bilang bisa. Lalu dimana salah Fenny? *tarik-tarik baju Om Mark


Tak putus akal, Fenny browsing beberapa tutorial yang membagikan cara menambahkan fanpage di blog. Rata-rata memberikan tutorial sesuai petunjuk halaman resmi facebook. Hingga pada akhirnya Fenny menemukan script yang dibuat oleh salah seorang blogger gaek *sedang Fenny cari ulang pembuat scriptnya*. Script ini cukup dipasang di widget blog dan hanya perlu diutak-atik sedikit supaya berfungsi dan sesuai dengan ukuran tempat penempatan fans page di blog. Dan inilah script yang sudah Fenny modifikasi supaya cara memasang fans page di blog lebih mudah berikut langkah-langkahnya:

  • Masuk ke dashboard blog, pilih Layout, klik Add a Gadget (bebas di sidebar kanan atau kiri), pilih HTML
  • Copy paste kode berikut ke kolom Keterangan

<style type="text/css">
.seocipsfbox { width:200px; background:#333; margin:0 auto; text-align:left; border-top:1px solid #454444; border-bottom:1px solid ‪#‎1e1e1e‬; }
</style>
<div class="seocipsfbox">
<div style="background:‪#‎efefef‬;border:1px solid #333;border-radius:1px;"><div class="fb-like-box" data-href="https://www.facebook.com/ibubelajarmasak" data-rel="nofollow" data-width="200" data-colorscheme="light" data-show-faces="true" data-header="false" data-stream="false" data-show-border="false"></div></div>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/sdk.js#xfbml=1&appId=483767385088491&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script async='async' src='http://platform.twitter.com/widgets.js' type='text/javascript'/></script>


  • Cari link https://www.facebook.com/ibubelajarmasak lalu ganti dengan link fanpage masing-masing. Klik Save
Cara ini sudah Fenny praktekkan untuk memasang fanpage di blog klien dan berhasil. Yeay, selamat mencoba.



9 komentar:

  1. Pingin..tp pusing..nunggu dibantuin suami aja deh:D

    BalasHapus
    Balasan
    1. Hhihihiiii ... lihat script2 ibu hamil sensi yaaa

      Hapus
  2. Kayaknya sih mudah ya, coba deh nanti aku praktekkan. Makasih ya Fen :)

    BalasHapus
    Balasan
    1. gampang koq mb klo pakai cara kedua ;)

      Hapus
  3. Huahahaha aku pun sempet rempong begitu, tapi setelah utak-atik nemu juga caranya. :D

    BalasHapus
  4. berhasil pakai versi facebook resmi Ka?

    BalasHapus
  5. mbak itu ukurannya udah fix sama sidebar? kl ga salah itu widthnya 200 ya?

    BalasHapus
    Balasan
    1. bisa dirubah-rubah sesuai ukuran sidebar mbak ;)

      Hapus
  6. aku blom berhasil pasang nih fen hihhiihi aku coba lagi aahh

    BalasHapus

Mohon maaf komentar dimoderasi untuk mengurangi SPAM. Terima kasih sudah berkunjung dan meninggalkan KESAN :)