Gino's Blog!: 在Blogger文章加上Facebook留言功能

前兩天在不來恩的重灌狂人部落格上看到一篇"在部落格嵌入Facebook留言板，借3.5億個會員讓流量破表！（Facebook Connect）"，就想說在這裡也來加上試試，結果發現Blogger沒法用那個方法來達成，於是在Google大神的幫助下找到了一篇"How to add Facebook connect to Blogger"，讓我的Blogger也能用facebook connect了。
如果你也是用Blogger的，可以試試看以下的方式:

Step 1:
連到http://www.facebook.com/developers/createapp.php
當然要先登入Facebook~~~

Step 2:
在應用程式名稱的地方輸入你的應用程式名稱，我是用部落格的名稱~~~

當然要同意Facebook 使用條款不然就別玩了，按下"建立應用程式"按鈕。
Step 3:
API 金鑰等相關資訊給記錄下來~~~

Step 4:
按下左邊"聯外通"的功能

在"聯外通網址"欄外輸入你的部落格網址，然後按"儲存"~~~

Step 5:
接下來就要去Blogger後台修改你的版面了~~~
修改以前請先做好備份，同時你要知道是在改甚麼，改掛了我可是不負責的喔，下面的這些修改是我實際做過的，但是每個人的Blogger範本不太一樣，你可得稍微注意一下。
連到Blogger後台去修改HTML，在範本一開始的地方會看到跟下面的碼一樣的地方



<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' >

在後面加上紅字的部分如下，



<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'>

Step 6:
在<body>之後，</head>之前加上
<script src='http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php' type='text/javascript'/>
Step 7:
在</body>之前加上

<script type='text/javascript'>

FB.init("貼上你的API金鑰");

</script>

先按下"儲存範本"把剛剛的修改給存起來。

Step 8:
接下來就能在你的Blogger中加上Facebook connect的各項功能了~~~
先來把Facebook留言板放到本文後面，像這樣:

一樣要修改HTML，然後勾選"展開小裝置範本"
找到<data:post.body/>，在它後面加上

<center>

<fb:comments width='620'/>

</center>

大功告成!

4 則留言:

Randy 提到...: 感謝你，幫助很大; 週二 1月 26, 02:36:00 下午 2010
Randy 提到...: 請問我要怎麼知道有人使用facebook留言板留言？; 週二 1月 26, 02:41:00 下午 2010
Gino 提到...: 我正在研究中，本文中所提的只是一個入門的方式，所以每個POST裏的COMMENTS BOX都會不同~~~，還在STUDY; 週二 1月 26, 02:44:00 下午 2010
Maizi 提到...: 我沒辦法建立應用程式,您寫的連結也點不進去唷(網頁顯示為錯誤連結; 週二 11月 13, 10:10:00 下午 2012

張貼留言

2010/01/24

在Blogger文章加上Facebook留言功能

4 則留言: