Cara Merubah Tampilan Widget Follower Blogger

Cara Merubah Tampilan Widget Follower Blogger

Cara Merubah Tampilan Widget Follower Blogger

Widget Follower Blogger ini sangat berguna untuk perkembangan blog, selain sebagai sarana silaturahmi kita sebagai sesama blogger. Dengan memasang Widget Follower Blogger ini, maka pengunjung dapat mengikuti postingan terbaru dari blog yang diikutinya, yang akan ditampilkan pada dasbor blogger masing-masing. Dilihat dari fungsinya tentu kita disarankan untuk memasang Widget Follower Blogger ini, tentu dengan tampilan yang berbeda agar dapat menarik minat pengunjung untuk menjadi follower.

Cara Merubah Tampilan Widget Follower Blogger ini merupakan salah satu solusinya, karena dapat merubah tampilan standar yang ditampilkan oleh Google Friend Connect. Kita dapat menyesuaikan dengan tampilan template blog secara keseluruhan agar terlihat menyatu dalam hal warna maupun ukurannya.

Sebelum merubah tampilan Widget Follower Blogger ini kita harus membuat Widget Follower Blogger standar yang nantinya akan diambil id widget dan site-nya. Bagi Sobat yang sudah memasangnya, lewati langkah ini.

Cara Memasang Widget Follower Blogger

  • Pertama login dulu ke blogger
  • Kemudian pilih menu Tata Letak
  • Setelah itu klik Tambahkan Gadget
  • Pilih Gadget Lainnya
  • Klik tanda plus (+) pada Gadget Pengikut
Cara Merubah Tampilan Widget Follower Blogger

  • Terakhir klik Simpan

Cara Mengetahui id dan site Widget Follower Blogger

  • Buka homepage blog Sobat
  • Kemudian klik kanan Mause dan pilih Lihat Kode Sumber Laman
  • Jika sudah terbuka tekan Ctrl + F pada keyboard untuk membuka searchbox
  • Masukkan kata renderMembersGadget pada searchbox
  • Lihat kode id widget dan site di bawahnya
  • Copy kode tersebut dan save di tempat yang aman
Cara Merubah Tampilan Widget Follower Blogger

Cara Merubah Tampilan Widget Follower Blogger

  • Kembali ke dasbor blogger
  • Kemudian pilih menu Tata Letak
  • Setelah itu klik Tambahkan Gadget
  • Pilih HTML/JavaScript
  • Copy dan paste-kan kode berikut ke dalam konten yang tersedia
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<div id=" div-xrjy5mjjgft2" style="width: 300px; border:1px solid #ff4800;"></div>
<script type="text/javascript">
    var skin = {};
    skin['FACE_SIZE'] = '32';
    skin['HEIGHT'] = "260";
    skin['TITLE'] = "Pengikut";
    skin['BORDER_COLOR'] = "transparent";
    skin['ENDCAP_BG_COLOR'] = "transparent";
    skin['ENDCAP_TEXT_COLOR'] = "#444444";
    skin['ENDCAP_LINK_COLOR'] = "#3778cd";
    skin['ALTERNATE_BG_COLOR'] = "transparent";   
    skin['CONTENT_BG_COLOR'] = "transparent";
    skin['CONTENT_LINK_COLOR'] = "#3778cd";
    skin['CONTENT_TEXT_COLOR'] = "#444444";
    skin['CONTENT_SECONDARY_LINK_COLOR'] = "#3778cd";
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#666666";
    skin['CONTENT_HEADLINE_COLOR'] = "#000000";
    skin['FONT_FACE'] = "normal normal 13px Arial, Tahoma, Helvetica, FreeSans";
    google.friendconnect.container.setParentUrl("/");
    google.friendconnect.container["renderMembersGadget"](
    {id: " div-xrjy5mjjgft2",
     height: 260,    
     site: " 02226515773088356508",    
     locale: 'in' },
     skin);
</script>
  • Ganti kode yang ditandai merah dengan id dan site widget yang tadi Sobat telah simpan
  • Terakhir Simpan dan lihat hasilnya
  • Jangan lupa hapus Widget Follower Blogger standar yang telah kita buat
Untuk memodifikasi atau merubah warna maupun ukuran silahkan dirubah sesuai selera Sobat pada kode-kode yang ditandai warna merah, kecuali pada id dan site widget-nya.

Demikianlah Cara Merubah Tampilan Widget Follower Blogger standar agar terlihat menarik dan dapat disesuaikan dengan warna dan ukuran template Sobat. Semoga bermanfaat.

Artikel terkait:

Bagikan: