Cara Pasang Facebook Like Box Responsive di Blog

Cara Pasang Facebook Like Box Responsive
Cara Membuat, Menampilkan, atau Memasang Facebook Like Box Responsive.

Fanspage harus kita pasang di website/blog agar mendapatkan liker yang sebanyak-banyaknya, juga memudahkan pengunjung berinteraksi via Facebook dengan admin.

Yang belum punya Fanspage, silakan membuatnya di Facebook Like Box.

Sebelumnya sudah di-share Cara Memasang Facebook Like Box SEO Friendly di Blog.

Berikut ini Cara memasang Facebook Like Box Responsif sehingga tampilannya mobile friendly di blog blogspot.

1. Template > Edit HTML
2. Copy & Paste kode berikut ini di atas kode ]]<b:/skin>

.fb-wrap {width:50%;margin: 0 auto;}
.fb-like-box, .fb-like-box span, .fb-like-box span iframe[style] { width: 100% !important; }

3. Save Template!
4. Klik "Layout" > Add a Gadget > pilih HTML/Javascript
5. Copy & Paste kode berikut ini di kolom "Content"

<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/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-wrap">
  <h1>Responsive Facebook Like Box</h1>
<div class="fb-like-box" data-href="https://www.facebook.com/pagekomunikasipraktis" data-width="992" data-show-faces="true" data-show-border="false" data-colorscheme="light" data-stream="false" data-header="false"></div>
</div>

6. Ganti Url/alamat Fanspage yang warna merah dengan kepunyaan url fanspage Anda.

7. Save!

Kini Fanspage Facebook Like Box Responsive sudah terpasang di blog Anda. (www.komunikasipraktis.com).*

Sumber

15 Comments

  1. Makasih Gan, tampilan FB like box seperti ini yang saya cari dan sudah saya terapkan. Btw apa kode yang kedua bisa diletakkan diatas atau dibawah kode body trus yang pertama diletakkan di HTML/Javascript?? karena sangat memengaruhi loading blog.

    ReplyDelete
    Replies
    1. Iya Gan..akan saya coba saja. Btw mohon izin untuk dishare artikelnya, tentunya dengan menyertakan sumber. Terima kasih..

      Delete
  2. Pertanyaan terakhir Gan, bagaimana caranya agar daftar foto yang tampil cuma 2 baris seperti punya juragan? Terimakasih sebelumnya.

    ReplyDelete
  3. ngerubah ukurannya gmn gan ..... (newbie)

    ReplyDelete
    Replies
    1. Ubah ke 100 persen aja, di kode templatenya.

      Delete
  4. facebook suda ganti bentuk tampilannya ya..
    apa bisa totorial ini diterapkan?

    ReplyDelete
  5. makasih gan cara pasang fb like responsifnya berhasil bermanfaat

    ReplyDelete
  6. makasih infonya bermanfaat banget nih buat blogger newbie kek saya

    ReplyDelete
  7. Work gan, ane kasi reward 1 klik,
    Mohon koreksinya www.emosianisme.net

    ReplyDelete
  8. Langsung praktek, untuk 2019 apa masih work?

    ReplyDelete
  9. Saya copot lagi karena jadi berat loading blog.

    ReplyDelete
Previous Post Next Post