Home / Blogger Corner / Memodifikasi Google Friend Connect dengan Flash

Memodifikasi Google Friend Connect dengan Flash

Seakan tidak henti – hentinya berbgi tutorial sobat, hehe Mungkin sobat sudah banyak yang tau apa itu Google Friend Connect yang ada di Blogspot, bagi kebanyakan Blogger pasti memasang widget tersebut di blognya sendiri. tetapi yang biasa kita lihat google friend connect di blog masih dengan gaya yang standart dan mungkin yang sudah di modifikasi hanya warna dan tempat penaruhannya saja.

Untuk itu aku memiliki sedikit Tutorial nih, Tutorial apa? Tutorial membuat Google Friend connect menggunakan flash dengan gaya seperti berputar – putar, mungkin sobat pernah melihat plugin wordpress seperti WP- Cumullus yang di desain oleh Roy Tanck , mirip seperti itu tetapi di sini kita akan membuat Google Friend Connect dengan gaya seperti WP- Cumullus.

Demo

var skin = {};
skin[‘ALTERNATE_BG_COLOR’] = ‘#ffffff’;
skin[‘BG_COLOR’] = ‘#ffffff’;
skin[‘CONTENT_TEXT_COLOR’] = ‘#000000’;
skin[‘CONTENT_SECONDARY_TEXT_COLOR’] = ‘#0000ff’;
google.friendconnect.container.setParentUrl(‘/’ /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderOpenSocialGadget(
{ id: ‘div-7791692969327865583′,
url:’http://www.eaglewebapp.com/ewa/gfc/cloud/cloud.xml’,
site:’12447471798063206408′,
‘prefs’:{
‘cloudWidth’:’300′,’cloudHeight’:’300′,’maxDisplay’:’10’,’xAxis’:’1′,’yAxis’:’1′}
}, skin);

Pastinya keren kan memiliki Google Friend Connect yang berbeda dengan yang biasanya, jika sobat ingin mencobanya ikuti saja langkah – langkahnya di bawah ini :

Pertama
1. Login ke Blogger
2. Rancangan ยป Element Halaman
3. Tambah Gadget kemudian ยป HTML/ Javascrift
4. Masukan kode di bawah ini :

<script type=”text/javascript” src=”http://www.google.com/friendconnect/script/friendconnect.js”></script>
<div id=”div-7791692969327865583″ style=”width:350px;”></div>
<script type=”text/javascript”>
var skin = {};
skin[‘ALTERNATE_BG_COLOR’] = ‘#ffffff’;
skin[‘BG_COLOR’] = ‘#ffffff‘;
skin[‘CONTENT_TEXT_COLOR’] = ‘#000000‘;
skin[‘CONTENT_SECONDARY_TEXT_COLOR’] = ‘#0000ff‘;
google.friendconnect.container.setParentUrl(‘/’ /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderOpenSocialGadget(
{ id: ‘div-7791692969327865583’,
url:’http://www.eaglewebapp.com/ewa/gfc/cloud/cloud.xml’,
site:’ID Google Friend Connect Sobat‘,
‘prefs’:{
‘cloudWidth’:’350‘,’cloudHeight’:’250‘,’maxDisplay’:’10‘,’xAxis’:’1′,’yAxis’:’1′}
}, skin);
</script>

*Keterangan

Pada ID Google Friend Connect Sobat silahkan sobat pergi ke http://www.google.com/friendconnect Kemudian Login Pilih Blog yang akan di ambil IDnya lalu Copykan ID Google Friend Connect Sobat yang ada di URL sobat. Lihat contoh di bawah.

 Kemudian Ganti ID Google Friend Connect Sobat dengan ID yang sobat Copy di URL Sobat tadi.
Untuk Kode yang berwana merah lainnya bisa sobat edit sendiri, cukup mudah mengeditnya.hehe



Tahap Akhir
5. Kemudian jika langkah di atas sudah selesai di ikuti, kemudian klik SIMPAN

Alhamdulillah pembuatan “Memodifikasi Google Friend Connect dengan Flash” Sudah selesai, untuk itu silahkan Sobat coba sendiri, karena orang suka mencoba dia pasti akan cepat mengerti. Selamat Mencoba.

About admin

Check Also

Membuat Background Header Berganti Otomatis

Pada kali ini aku akan sedikit berbagi trik mempercantik atau bisa juga trik untuk memodifikasi …

5 comments

  1. mantab-mantab nih tutornya ^_^

  2. @cangkal:
    makasih bang lah…

    ohh iih ma'af jua nah, nama pian ada di postingan ulun. hhee

  3. terima kasih trik google connectnya akan saya praktekkan.., moga2 ini berguna untuk saya ๐Ÿ™‚ terima kasih ๐Ÿ™‚

    jgn ragu untuk berkunjung dan comment di http://bisnisstylemagazine.blogspot.com

    (kalau agan comment, berkomen di t4 agan belum comment aja) jangan lupa jalan2 yah gan ๐Ÿ™‚ terima kasih ๐Ÿ™‚

  4. nha ini dia gan, mantabs.. thanks for sharing

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *