Memasang Social Fanspage Facebook GooglePlus Dan Twitter Dalam Satu Widget Di Blog

Cara Memasang Social Fanspage Facebook GooglePlus Dan Twitter Dalam Satu Widget Di Blog - Selamat pagi sohib bejo cius, dikesempatan kali ini bejo cius akan membagikan cara memasang beberapa social fanspage kedalam satu widget. Dengan memasang semua social fanspage yang anda miliki seperti Fanspage Facebook, Google+ dan Twetter menjadi satu widget maka tampilan blog akan lebih dinamis dan tentunya tidak banyak memakan tempat dan dapat mempermudah pengunjung yang ingin mengikuti blog anda sesuai dengan media social yang mereka gunakan.

Jejaring sosial adalah salah satu media sosial yang paling umum digunakan oleh masyarakat di seluruh dunia. Jadi sangat cocok untuk mempromokan blog/web anda agar banyak mendatangkan pengunjung. Dan salah satu caranya adlah dengan memasang widget follower pada blog/web anda. Dan untuk tampilan widget social follower-nya seperti gambar dibawah ini.

Cara memasang widget Facebook Goole+ dan Twitter di Blog

• Tentunya anda harus sudah memiliki ke tiga Fanspage tersebut
• Jika sudah silahkan anda masuk ke Blogger
• Lalu pilih menu "Tata Letak - Tambahkan Widget/Gadget - lalu pilih HTML/JavaScript"

• Maka akan tampil halaman "Konfigurasi HTML/JavaScript" seperti gambar dibawah ini.

• Silahkan isi "Judul" sesuai dengan selera anda dan isi "Konten" dengan kode di bawah ini.

<style type="text/css" scoped="">
.bejociusglebox { width:280px; background:#333; margin:0 auto; padding:10px 0 10px 20px; border-bottom:1px solid #1e1e1e; }
.bejociusgle1,.bejociusgle2 { margin-top:5px; }
.people { float:left; margin-top:3px; font-weight:bold; color:#fff; }
.googlewidget { margin-left:120px; }
.bejociusfbox { width:260px; background:#333; padding:10px 20px; margin:0 auto; text-align:left; border-top:1px solid #454444; border-bottom:1px solid #1e1e1e; }
.twitter-box { width:260px; background:#333; padding:10px 20px; margin:0 auto; text-align:left; border-top:1px solid #454444; }
.bejociusfb,.bejociustw { font-weight:bold; margin-bottom:5px; color:#fff; }
</style>
<div class="bejociusglebox">
<div class="bejociusgle1">
    <span class="people">Bejo Cius on</span><div class="googlewidget"><div class="g-follow" data-annotation="bubble" data-height="24" data-href="//plus.google.com/u/0/106449177394953369307" data-rel="author"></div></div>
</div>
<div class="bejociusgle2">
    <span class="people">Patih Gerah Polo on</span><div class="googlewidget"><div class="g-follow" data-annotation="bubble" data-height="24" data-href="//plus.google.com/u/0/102560593910261536703" data-rel="publisher"></div></div>
</div>
</div>
<div class="bejociusfbox">
    <div class="bejociusfb">Bejo Cius on Facebook</div>
<div style="background:#efefef;border:1px solid #ccc;border-radius:3px;padding:5px;"><div class="fb-like-box" data-href="https://www.facebook.com/bejocius" data-rel="nofollow" data-width="232" data-colorscheme="light" data-show-faces="true" data-header="false" data-stream="false" data-show-border="false"></div></div>
    </div>
<div class="twitter-box">
    <div class="bejociustw">bejo cius on Twitter</div>
<a href="https://twitter.com/bejocius" rel="nofollow" class="twitter-follow-button" data-show-count="true" data-lang="en">Follow @bejocius</a>
    </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=769772066467683&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>

Penjelasan kode di atas :

1. Pada kode yang saya beri warna "Biru", silahkan anda ganti dengan nama Fanspage/Media Social anda.
2. Dan pada kode yang saya beri warna "Merah" silahkan anda masukkan alamat URL Fanspage/Media Social anda.

• Jika sudah silahkan anda klik "Simpan/Save". Dan silahkan anda lihat hasilnya :) 

Demikanlah Cara Memasang Social Fanspage Facebook GooglePlus Dan Twitter Dalam Satu Widget Di Blog. Semoga artikel yang saya bagikan ini dapat bermanfaat dan menambah wavasan tentang ilmu blogging kita.  Jika masih ada yang bingung ataupun belum jelas silahkan jangan sungkan-sungkan untuk bertanya. Happy Blogging :)

Share :

Tweet

✚

Related Post