Cara Memasang Google Social Bar Di Website/blog

[ Hits : 1395 ] [ Print ] [ Demo ]


Google Social Bar merupakan gadget yang bisa disimpan diatas atau dibawah posisi website. Dengan gadget ini pengunjung website dapat terhubung ke website melalui account yang dimilikinya dan memberikan komentar dengan mudah.

Beberapa account yang dapat dihubungkan saat artikel ditulis adalah account Google, Twitter, Yahoo, Aim, Netlog dan Open ID.

Google Friendconnect Account

 

Berikut beberapa langkah mudah memasang Google Social Bar :

1. Buka websitenya di google.com/friendconnect

2. Daftarkan alamat website jika belum terdaftar

3. Pilih Menu Gadget disebelah kiri lalu klik Social Bar disebelah kanan.

4. Isi formnya lalu dapatkan kodenya.

 

Google Social Bar Register

 

Salah satu yang terpenting  dalam mengisi form adalah menentukan posisi bar (Social Bar Position) top atau bottom.



Berikut script lengkapnya :

1- <!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">
2- <html>
3- <head>
4- <title>Title here!</title>
5- </head>
6- <body>
7- <!-- Include the Google Friend Connect javascript library. -->
8- <script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
9- <!-- Define the div tag where the gadget will be inserted. -->
10- <div id="div-6302859115500929493"></div>
11- <!-- Render the gadget into a div. -->
12- <script type="text/javascript">
13- var skin = {};
14- skin['BORDER_COLOR'] = '#cccccc';
15- skin['ENDCAP_BG_COLOR'] = '#e0ecff';
16- skin['ENDCAP_TEXT_COLOR'] = '#333333';
17- skin['ENDCAP_LINK_COLOR'] = '#0000cc';
18- skin['ALTERNATE_BG_COLOR'] = '#ffffff';
19- skin['CONTENT_BG_COLOR'] = '#ffffff';
20- skin['CONTENT_LINK_COLOR'] = '#0000cc';
21- skin['CONTENT_TEXT_COLOR'] = '#333333';
22- skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
23- skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
24- skin['CONTENT_HEADLINE_COLOR'] = '#333333';
25- skin['POSITION'] = 'bottom';
26- skin['DEFAULT_COMMENT_TEXT'] = '- add your comment here -';
27- skin['HEADER_TEXT'] = 'Comments';
28- google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
29- google.friendconnect.container.renderSocialBar(
30- { id: 'div-6302859115500929493',
31- site: '06392407501516936607',
32- 'view-params':{"scope":"SITE","features":"video,comment","showWall":"true"}
33- },
34- skin);
35- </script>
36- </body>
37- </html>
38-

Baca Juga :