Tentang Ilmu Komputer, Android, Panduan Blogging dan Tips di Internet.

Cara Memasang Widget Pengikut Blog dengan Mode HTML

Widget pengikut Blog adalah widget yang menampilkan daftar pengguna yang mengikuti Blog sobat, dengan disertai Join This Site Button. Menurut saya widget ini sangat bermanfaat karena setiap kita update posting, maka posting tersebut akan tampil pada halaman dashboard pengikut Blog kita. Jadi kemungkinan setiap kita membuat posting baru akan langsung mendapat pembaca.

Cara Memasang Widget Pengikut Blog dengan Mode HTML

Dengan cara pemasangan biasa, terasa sangat mudah. Karena widget ini telah disediakan Blogspot. Yaitu dengan cara masuk ke bagian Tata Letak>> Tambahkan Gadget>> Gadget Lainya>> Pengikut>> Simpan.

Namun karena adanya keperluan lain, pembuatan widget ini dengan mode HTML pun diperlukan. Saya memerlukan cara mode HTML karena akan menggabungkan widget ini dengan widget lainya. Mungkin sobat juga memerlukan cara membuat widget ini dengan mode HTML, silakan simak lebih lanjut.
Cara ini gampang-gampang susah sob, namun yang saya tahu syaratnya sobat harus memakai Browser Mozila Firefox. Silakan sobat yang mau mencobanya, saya sarankan menyimak sambil mempraktikan.

Cara Memasang Widget Pengikut Blog dengan Mode HTML

  • Login ke akun Blogger sobat.
  • Pasang dulu widget ini dengan cara biasa. Masuk Tata Letak>> Tambahkan gadget>> Gadget Lainya>> Pengikut>> Beri judul contohnya "Pengikut">> Simpan.
  • Masuk ke halaman Blog sobat.
  • Klik kanan pada halaman Blog sobat>> Pilih Lihat Kode Sumber Laman/ View Page Source.
  • Dengan menggunakan tombol ctrl+F, cari judul widget yang telah sobat tentukan sebelumnya. Saya contohkan judulnya "pengikut". Akan ada beberapa hasil pencarian dari keyword "pengikut". Dengan menekan tombol Enter beberapa kali, pilihlah hasil pencarian kata "pengikut" yang disekitarnya terdapat kode-kode seperti berikut.
Cara Memasang Widget Pengikut Blog dengan Mode HTML
  • Nah, kode ini adalah kode sumber Widget Pengikut Blog. Copy kode tersebut dimulai dari <div id="div-xxxxxx"></div> sampai </script>. Jangan sampai salah, perhatikan contoh gambar diatas.
  • Masuk kembali ke bagian Tata Letak pada Blog sobat.
  • Klik Tambahkan gadget di posisi yang sobat inginkan.
  • Kini sobat pilih mode HTML/Javascript.
  • Masukan kode berikut.
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->

  • Lalu di bawahnya, baru sobat pastekan kode yang telah sobat copy dari kode sumber Widget Pengikut Blog. Hingga kurang lebih hasilnya seperti berikut
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->

<div id="div-nxssmc65mxz8" style="width: 100%; "></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'] = "#000000";
    skin['ENDCAP_LINK_COLOR'] = "#000000";
    skin['ALTERNATE_BG_COLOR'] = "transparent";
  
    skin['CONTENT_BG_COLOR'] = "transparent";
    skin['CONTENT_LINK_COLOR'] = "#000000";
    skin['CONTENT_TEXT_COLOR'] = "#000000";
    skin['CONTENT_SECONDARY_LINK_COLOR'] = "#FFFFFF";
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#000000";
    skin['CONTENT_HEADLINE_COLOR'] = "#000000";
    skin['FONT_FACE'] = "Arial";
    google.friendconnect.container.setParentUrl("/");
    google.friendconnect.container["renderMembersGadget"](
    {id: "div-nxssmc65mxz8",
     height: 260,
   


     site: "02029121691705341830",   

     locale: 'in' },
     skin);
  </script>


Perhatian: 
Sobat jangan menggunakan kode diatas, karena itu adalah kode sumber Widget Pengikut Blog milik saya. Gunakanlah kode sumber Widget Pengikut Blog milik sobat yang sebelumnya telah sobat copy-paste.
  • Kode yang berwarna biru adalah kode-kode warna yang bisa sobat modifikasi.
  • Kode yang berwarna merah adalah kode-kode ukuran yang bisa sobat modifikasi juga.
  • Klik Simpan, selasai.
Begitulah Cara Memasang Widget Pengikut Blog dengan Mode HTML. Oh ya, saya pernah mengatakan dengan memasang widget mode HTML, maka manfaatnya adalah widget tersebut dapat digabungkan dengan widget lain yang tentunya widget mode HTML juga. Berikut contohnya.

Artikel terkait : Cara Memasang Widget Pengikut Blog dengan Mode HTML

Artikel Blog Regi Brader Lainnya :

21 komentar:

  1. gan,, cara tahu kode widget milik saya gimana??

    ReplyDelete
  2. thx om tapi masi bingung hhe
    tapi saya coba
    http://jajangbaberwahyudin.blogspot.com

    ReplyDelete
  3. Makasih Maz Atas Infonya, saya sekarang jadi Pengikut blog maz, maklum newbie, kunjungi blog saya juga maz http://www.meliapropolisjogja.com/ , TNKYUUUU

    ReplyDelete
  4. thanks gan...mantap,,
    http://sdiindonesia.blogspot.com/

    ReplyDelete
  5. terimakasih sobat atas petunjuknya.jangan lupa follow back Blog Legenda Tauhid

    ReplyDelete
  6. http://www.beudmachine08.com/
    Monggo mampir kblog saya ya gan..tks

    ReplyDelete
  7. info yang sangat bagus gan,,,
    mampir untuk download film kesini gan,,, http://www.rasyha.com/

    ReplyDelete
  8. gan kenapa punya saya jadi ada 2 widgetnya??
    kalo yg ori dihapus, yang baru malah jadi blank

    ReplyDelete
  9. thanks infonya.. follow jg blog saya ya. gorgeous-coll.blogspot.com

    ReplyDelete
  10. Mantap gan, terima kasih banyak.
    mampir di kesini : artkel pendidikan

    ReplyDelete
  11. sangant bermanfaat gan, tapi apakah masih work untuk sekarang???

    ReplyDelete
  12. Blog Saya Jadi Bisa Thx
    www.naufal-fitra.xyz

    ReplyDelete
  13. keren bro informasi nya
    bagi yg pengn cari mobil baru/second/iklan pembuatan website hub
    www.mobillaris.com

    ReplyDelete
  14. Gan saya mau tanya,,,
    foto yang terakhir itu cara buat buat pengikut twitter, Google+ ama fb gimana ga gan,,,
    soory gan masih awam soal kayak gini,,
    mohon penceerahannya,,

    ReplyDelete
    Replies
    1. Oh itu, saya lupa lagi gan udah lama. Itu dulu lagi berkreasi dengan kode CSS

      Delete
  15. gampang juga ya, terimakasih gan informasinya
    http://www.kangalip.com/

    ReplyDelete
  16. Sangat Bermanfaat dan berguna untuk blogger baru seperti saya.
    Terima Kasih gan.
    http://iza-net.blogspot.com/

    ReplyDelete

Copyright © 2013-2016 Blog Regi Brader - All Right Reserved