Google Friend Connect 申請、設定與放置於網頁之實戰手札

2008年12月5日星期五

Google Friend Connect 申請、設定與放置於網頁之實戰手札

什麼是Google Friend Connect呢？他又有什麼新鮮事呢？這個問題異塵行者已經在他的文章中，寫得很清楚了，而在這裡海芋所介紹的，是介紹如何申請一個Google Friend Connect，並放置在網頁上。

Step 1.
首先，先連到Google Friend Connect的首頁，並按下〔Set Up A New Site〕。

Step 2.
而首先，會出現導覽的視窗，按下〔Continue〕。

Step 3.
接著，設定你的網站名稱和網址。

Step 4.
上傳此兩個檔案，至指定的位置上。而Blogger的用戶無需設定，已自動上傳，其它部落客只能留口水囉！

Step 5.
接著，按下〔Test to Finalize Setup〕即可。

Step 6.
若測試通過，請按下〔Add Member Gadget〕，以讓讀者加入會員的捷徑及顯示會員的圖像。

Step 7.
設定此Gadget的大小。

Step 8.
設定完後，按下〔General Code〕即可產生程式碼，此時您就可以複製並貼在側邊欄囉！

Step 9.
接著，按下〔Social gadgets〕→〔Wall gadget〕，以建立一個留言版。

Step 10.
設定留言版的項目，而當改變之後，可以即時預覽。

Step 11.
同樣地，設定完後，按下〔General Code〕即可產生程式碼，此時您就可以複製並貼在側邊欄囉！

Step 12.
而其實留言版如果設為一定要登入才能留言，還蠻不方便的，所以我們需要給讀者一個登入的捷徑，按下〔Member gadgets〕→〔Add a Sign in Gadget〕。

Step 13.
設定此gadget的寬度及對齊方式。

Step 14.
同樣地，設定完後，按下〔General Code〕即可產生程式碼，此時您就可以複製並貼在側邊欄囉！而您可以像海芋一樣，貼在留言版上方，這樣讀者很容易地發現必須要登入，甚至留言了。

Step 15.
另外，也可以在〔Site Settings〕→〔Advanced〕，設定「Sign in」為「登入」，和〔Sing out〕為「登出」，這樣中文讀者會比較好理解。

好了，申請與放置的實戰，在此就告一段落，接下來，快樂使用吧！

延伸閱讀：

版權說明

本文章發佈於海芋小站，內容僅歡迎「部份」引用，引用時請註明出處及原文連結，謝謝。
若圖像無法顯示，可能因流量太大，敬請重新整理或透過留言與我回報，也歡迎「訂閱」本站文章喔，感恩!!

25 Comments:

Sango 提到...: 海芋兄～

我已經迫不及待加入你的群組啦...>////<; 十二月 05, 2008 6:28 下午
瓦特比提到...: 已加入...; 十二月 05, 2008 7:38 下午
海芋提到...: 謝啦，歡迎大家彼此來交流 :); 十二月 05, 2008 11:31 下午
甜咖啡提到...: 终于找到解答啦！
赞～; 十二月 06, 2008 12:53 下午
tw 提到...: 海芋兄我也寫了一篇 http://dejavu.tw/2008/12/05/google-friend-connect/ , 我也加入成為你Google Friend Connect的粉絲啦 ~; 十二月 06, 2008 6:16 下午
kisszhq 提到...: 刚刚加入,报道下~~哈; 十二月 06, 2008 8:31 下午
海芋提到...: 謝啦謝啦，大家一起來測試喔！; 十二月 06, 2008 11:17 下午
Tracy 提到...: 謝謝分享 ^_^; 十二月 07, 2008 3:16 上午
盗贼提到...: 不明白第4步，上传那两个文件有什么用，我有个站点，不是blogger，我不知道怎么上传，就把第4步空过去了，但是最后也成功添加了Google Friend Connect。; 十二月 10, 2008 5:10 下午
海芋提到...: blogger = blogspot = google的博客

对於一般的博客，像新浪，就没办法用了; 十二月 10, 2008 5:17 下午
好點子提到...: 拜讀大作,有使用相關功能..不過留言板看起來怪怪的/.
沒有看到任何頭像...

還有..好像愈設寬度是不是都要改,..塞不下已套用的樣式?

至於,站主的頭像要顯示,是不是要先設定?在哪設定呢?

可否賜教,感恩~
http://good-ideal.blogspot.com/; 十二月 23, 2008 1:13 下午
海芋提到...: 1.沒有頭像，是因為沒有任何成員加入你的社群中，或者是因為沒有任何留言，所以不會有頭像。站主要先加入自己網站的社群。

2.側邊欄建議改成300px以上。

3.若社群成員一多，站主的頭像會顯示到比較後面的頁數，不會一直顯示在首頁。; 十二月 23, 2008 5:47 下午
Aican 提到...: 嗨，我偷偷引用了您的文章囉，應該不介意吧！ ^^
謝囉！; 十二月 24, 2008 11:05 上午
海芋提到...: ok，這樣的引用方式沒問題 ^^; 十二月 24, 2008 1:20 下午
凸太郎提到...: 感謝我也加入了; 一月 09, 2009 3:14 上午
成小山提到...: 不好意思，我解決了，只是yam好像一直無法加入～
苦惱阿！哈; 二月 06, 2009 4:01 上午
rabbit52068 提到...: 海芋您好
我是使用blogger
但是我在friend connect new site第三步的認證上
一直無法通過..
請問blogger那邊需要設定嗎; 三月 12, 2009 4:33 下午
海芋提到...: blogger不需要設定，你的問題我也沒遇過; 三月 12, 2009 10:57 下午
Jason 提到...: 海芋大大您好!

我是小學生,
在看了您詳細的說明後,
很高興已設定成功,
謝謝您的大方分享.^^

↑↑ 樓的情形我也遇過,
(認證上一直無法通過).

後來我想~
原因是不是我將我的 blogger 設定 "鎖" 住 (限自己閱讀).

結果把設定"解開" 就莫名其妙 Ok 了!\(^v^)/; 三月 25, 2009 5:11 下午
我叫哄你玩儿提到...: 我哭啦，为什么我是blogspot的却总也不成功呢？
楼主救命阿; 三月 31, 2009 9:27 下午
Mulberry 提到...: 據說因為Google正在整合Google Friend Connect和追蹤者功能，所以目前Blogger沒辦法申請GFC（先前申請成功的不算），只能被迫使用GFC＋追蹤者的整合版，（我也是不幸的受害者之一，嗚～）。

目前可以在後台安裝的外掛祇有追蹤者這個外掛而已，至於GFC的留言版等等好用的工具，只好透過抓取其他網站的html程式碼，替換上自己的id與網址號碼，最後再在自己的後台新增小工具，貼上改造後的html碼，詳細做法可參考這一篇文章。雖然很麻煩，總算是安裝成功了。; 四月 02, 2009 8:39 下午
海芋提到...: 恩，很棒，很詳細的一篇文！ ^^; 四月 02, 2009 8:50 下午
Powen 提到...: 寫得很棒的文章
可以讓我推荐給JUJU小姐嗎?
http://jkljkl987654321.blogspot.com/
因為小弟我懶得寫Google Friend Connect的教學囉

歡迎大家加小弟為朋友哦!
http://impowen.blogspot.com/; 五月 17, 2009 2:14 上午
海芋提到...: 可啊; 五月 18, 2009 1:45 下午
匿名提到...: 網頁錯誤詳細資料

使用者代理程式: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; GTB6; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) ; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; InfoPath.2; .NET CLR 3.0.30729)
時間戳記: Sun, 29 Nov 2009 13:58:03 UTC

訊息: 語法錯誤
行: 126
字元: 226
程式碼: 0
URI: http://www.google.com/friendconnect/script/friendconnect.js

請問海芋兄這該如何處理，請多多指教了 ><"; 十一月 29, 2009 10:56 下午