Cara Menyimpan Google Friend Connect Di Halaman Statis

Google Friend Connect atau widget Follower untuk Blogspot yakni salah satu cara untuk mendapat pembaca langganan blog sesama Blogger. Mungkin ini yakni salah satu cara gampang untuk blogwalking alasannya setiap ada update terbaru dari blog yang kita follow, maka akan ada pemberitahuan post gres di dashboard blog kita.

Iseng-isng aku intip instruksi Google Friend Connect, ternyata sudah berbeda dari instruksi terdahulu. Namun bagi aku ini tetap saja memberatkan loading blog, apalagi memakai js Google+ yang tidak di-asynchronous.

Kemudian aku mencari cara untuk menyimpannya di halaman statis. Hanya tombol Follow Blog yang aku tampilkan dengan link mengarah ke halaman statis yang berisi Google Friend Connect.

Pertama aku meng-copy semua instruksi Google Friend Connect dari page source ke halaman statis dan ternyata Google Friend Connect dapat muncul juga. Namun dikala widget Google Friend Connect di sidebar dihapus, yang di simpan di halaman statis pun tidak muncul (error).

Akhirnya aku mencoba cara lain dan jadinya berhasil hehehe...

Saya mengambil iframe dari Google Friend Connect dan menyimpannya di halaman statis. Meskipun widget Google Friend Connect di sidebar di hapus, iframe-nya masih tetap muncul di halaman statis.

Silahkan dapat Anda coba DI SINI.

Bagi yang ingin mencobanya silahkan ikuti langkah-langkahnya di bawah ini.

1. Tambahkan Dulu Widget Followers Di Sidebar
Silahkan tambahkan dulu widget Followers di sidebar. Di Tata Letak tambahkan gadget gres kemudian klik More Gadget, kemudian scroll ke bawah dan tambahkan widget Followers.

Kemudian sesuaikan warna-warna goresan pena dan link biar sesuai dengan tema blog kita. Sebagai panduan dapat lihat gambar di bawah ini.


2. Ambil Iframe Google Friend Connect
Setelah widget Followers muncul di sidebar, silahkan klik kanan pada widgetnya kemudian inspect element. Lalu cari kode <div id="followers-iframe-container"> dengan CTRL + F di kotak inspect element. Setelah ketemu, silahkan klik instruksi tersebut kemudian CTRL + C (copy).

3. Buat Halaman Statis Untuk Widget Followes
Silahkan buat halaman statis untuk Followers kemudian paste atau CTRL + V instruksi yang tadi di-copy di langkah ke-2 di atas di halaman tersebut dalam mode HTML.

Selesai, sekarang Google Friend Connect sudah tampil di halaman statis. Selanjutnya tinggal hapus lagi widget Followers di sidebar.

Praktis bukan?

Agar pengunjung dapat menemukan halaman Followers tersebut, silahkan buat sebuah tombol Followers dengan link halaman Followers atau simpan link di sajian blog.

Update:
Ternyata sekarang bulan Agustus 2016, instruksi widget Follower Blogger sudah berubah lagi, jadi silahkan gunakan instruksi di bawah ini untuk menampilkan Follower Blogger di halaman statis.

 <script type='text/javascript'>
        //<![CDATA[
        document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://apis.google.com/js/plusone.js\"></scr" + "ipt>");
        //]]>
        </script>
 <div id="followers-iframe-container"></div>
 <script type="text/javascript">
     window.followersIframe = null;
     function followersIframeOpen(url) {
       gapi.load("gapi.iframes", function() {
         if (gapi.iframes && gapi.iframes.getContext) {
           window.followersIframe = gapi.iframes.getContext().openChild({
             url: url,
             where: document.getElementById("followers-iframe-container"),
             messageHandlersFilter: gapi.iframes.CROSS_ORIGIN_IFRAMES_FILTER,
             messageHandlers: {
               '_ready': function(obj) {
                 window.followersIframe.getIframeEl().height = obj.height;
               },
               'reset': function() {
                 window.followersIframe.close();
                 followersIframeOpen("https://www.blogger.com/followers.g?blogID\x3d2583045784323695327\x26colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaBjY2NjY2NiIGMjI4OGJiKgZmZmZmZmYyBjAwMDAwMDoGNjY2NjY2QgYyMjg4YmJKBjk5OTk5OVIGMjI4OGJiWgt0cmFuc3BhcmVudA%3D%3D\x26pageSize\x3d108\x26origin\x3dhttp://www.kompiajaib.com/");
               },
               'open': function(url) {
                 window.followersIframe.close();
                 followersIframeOpen(url);
               },
               'blogger-ping': function() {
               }
             }
           });
         }
       });
     }
     followersIframeOpen("https://www.blogger.com/followers.g?blogID\x3d2583045784323695327\x26colors\x3dCgt0cmFuc3BhcmVudBILdHJhbnNwYXJlbnQaBjY2NjY2NiIGMjI4OGJiKgZmZmZmZmYyBjAwMDAwMDoGNjY2NjY2QgYyMjg4YmJKBjk5OTk5OVIGMjI4OGJiWgt0cmFuc3BhcmVudA%3D%3D\x26pageSize\x3d108\x26origin\x3dhttp://www.kompiajaib.com/");
   </script> 

Ganti instruksi 2583045784323695327 dengan ID blog Anda, 108 yakni mengatur jumlah follower yang ditampilkan, http://www.kompiajaib.com/ ganti dengan URL blog Anda.

Selamat mencoba.


Sumber https://www.kompiajaib.com/

Share this post