台湾区申请 FACEBOOK登入按钮教学

2011-11-18 版本

登入FaceBook

1.进入 http://developers.facebook.com/docs/

2.点击上方的"应用程式"

3.点击右上方的"建立新的应用程式"

第一次会要求用手机或是信用卡进行认证
认证完以后会跳出一个视窗,
要求你输入"应用程式显示名称"(必填)
以及"应用程式名称空间"(可稍后更新)

输入完名称以后点击"继续"
然后输入安全验证码

4.成功后会进入
应用程式 >> "你输入的应用程式显示名称">> 基本

你会看到最重要的App ID: 123456789012345

然后在往下, 会看到
"请选择你的应用程式如何跟 Facebook 结合"

然后会看到有很多APP可供选择
我们这次的目标为网站, 所以把网站打勾
打勾以后会出现"网站位址（URL）"

输入网站的网址
输入完后点击最下面的"储存"

5.
然后进入
http://developers.facebook.com/docs/reference/plugins/login/
选择你要的登入按钮样式 基本上就是宽度+要不要换行给你挑而已
选好后点击"Get Code "

会出现新视窗"你的 Login Button 外挂元件程式码"
有三种格式可以选择"HTML5" "XFBML" "IFRAME"

我们选择HTML5
显示的程式码有上下两段
上方是Javascript的部分, 复制贴到网页上的任一个地方
然后把APP_ID改成刚刚申请的ID
我刚刚的范例ID是123456789012345
注意别人的ID是没办法使用的喔~
因为没有申请对应的网址

下段就是HTML的部分, 因为很简短, 就贴出来
<div class="fb-login-button"
data-show-faces="true" data-width="100"
data-max-rows="1"></div>

把此段贴在想要在网页上放按钮的位置
就大功告成了!