Komunikasi Praktis

Blog tentang komunikasi media jurnalistik, menulis, public speaking, pembawa acara mc, siaran radio, presentasi, humas pr, public relations, blogging, podcast

  • HOME
  • Jurnalistik
  • Media
  • Humas
  • Speaking
  • Blogging
    • Templates
    • Tips SEO
    • AdSense
    • Posting
  • Komunikasi
  • About
  • Kontak
  • Sitemap
  • Disclaimer
  • Iklan
Home Media Sosial Cara Pasang Facebook Like Box Responsive di Blog

Cara Pasang Facebook Like Box Responsive di Blog

Romeltea Komunikasi Praktis Romeltea
February 4, 2015
Romeltea Follow @romel_tea
Romeltea

Baca Juga

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

Thanks for reading Cara Pasang Facebook Like Box Responsive di Blog | Tags: Blogging Komunikasi Blog Media Sosial

Next Article
« Prev Post
Previous Article
Next Post »

Related Posts

Your Comments

15 komentar on Cara Pasang Facebook Like Box Responsive di Blog

  1. I Gede Suta KastawanMay 28, 2015

    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. BATIC MediaMay 28, 2015

      Dicoba aja :)

      Delete
      Replies
        Reply
    2. I Gede Suta KastawanMay 29, 2015

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

      Delete
      Replies
        Reply
    3. Reply
  2. I Gede Suta KastawanMay 30, 2015

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

    ReplyDelete
    Replies
    1. AdminMay 31, 2015

      Atur tingginya.....

      Delete
      Replies
        Reply
    2. I Gede Suta KastawanMay 31, 2015

      Terima kasih..

      Delete
      Replies
        Reply
    3. Reply
  3. UnknownAugust 27, 2015

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

    ReplyDelete
    Replies
    1. Sukri SudinJune 13, 2016

      Ubah ke 100 persen aja, di kode templatenya.

      Delete
      Replies
        Reply
    2. Reply
  4. UnknownOctober 09, 2015

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

    ReplyDelete
    Replies
      Reply
  5. Pembuat PatungAugust 31, 2016

    makasih gan cara pasang fb like responsifnya berhasil bermanfaat

    ReplyDelete
    Replies
      Reply
  6. usmanSeptember 21, 2016

    makasih infonya bermanfaat banget nih buat blogger newbie kek saya

    ReplyDelete
    Replies
      Reply
  7. My name sabiqApril 21, 2017

    siippp...thanks infonya

    ReplyDelete
    Replies
      Reply
  8. Rumput & KerikilMay 07, 2018

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

    ReplyDelete
    Replies
      Reply
  9. BJuly 07, 2019

    Langsung praktek, untuk 2019 apa masih work?

    ReplyDelete
    Replies
      Reply
  10. SatriaJuly 28, 2020

    Saya copot lagi karena jadi berat loading blog.

    ReplyDelete
    Replies
      Reply
Add comment
Load more...

Subscribe to: Post Comments (Atom)

Recent Posts

Popular Posts

  • Contoh Naskah Pembukaan oleh Pembawa Acara (MC)
  • Cara Menjadi Pembawa Acara (MC) yang Baik
  • Karya Tulis Ilmiah: Pengertian, Karakteristik, dan Jenis-Jenis
  • Contoh Naskah MC (Pemandu Acara) untuk Acara Agustusan
  • Teknik Debat dan Cara Berdebat yang Baik
  • Daftar Kata Baku – Tidak Baku Bahasa Indonesia
  • Pengertian Literasi Secara Bahasa dan Istilah
  • Jurnalisme Kuning Jadi Trend Situs Berita
  • Arti dan Asal-Usul Teks Lorem Ipsum Dolor Sit Amet
  • WhatsApp Makin Menggerus Budaya Menulis

Join us on Facebook

Komunikasi Praktis

Info Bola & MotoGP

Recommended Yeuh!

Hosting Unlimited Indonesia

Categories

Bahasa Bahasa Jurnalistik Bisnis Online Blogging Desain Blog Google Adsense Humas Internet Jurnalistik Jurnalistik Online Komunikasi Media Media Online Pers Presentasi Public Speaking Radio Teknik MC Template Blog Tips SEO

About

Komunikasi Praktis adalah blog tentang keterampilan komunikasi: jurnalistik, media massa, kepenulisan, public speaking, mc, siaran radio, presentasi, humas, public relations, blogging, podcasting, dll.

Web Partners

  • Romeltea Online
  • Romeltea Media
  • Contoh Blog
  • Bandung Aktual
  • Risalah Islam

Newsletter

Berlangganan artikel terbaru dari blog ini langsung via email.

Copyright © Komunikasi Praktis. All rights reserved