標籤 : Facebook

部落格内Facebook Comment Box for TEXTCUBE
分類：
標籤： , , , ,

部落格内Facebook Comment Box for TEXTCUBE

不久前做了少少改变，在部落格放了facebook comment box。说起来还有点麻烦，因为要到Facebook Developer那先去create 一个 Apps先才可以。 1.去到 https://developers.facebook.com/apps create apps。2.任意为你新增的这个app取个名，至少7个字母，不能有号码（下图错了，因为6个字母而已）webhosting可以不用。填妥了就按continue好了。3. 填写Security Check。 对了，要申请这个apps，一定要用手机鉴定fb帐号先。手机和fb 连线后，记得选择“不要显示电话号码”的选项哦！4.简单的输入 一些基本资料 （我乱填的@@ )不过最重要的是，把那个 APP ID给抄下来！！！！！！================================================================接下来的步骤是输入代码的时刻了：1）去到部落格后台 ，选择 Edit Skin2）在Skin.Html 的部分，<html>过后先输入几样东西。  a)  JS SDK.  <div style="padding:10px; background-color:#FFDAED">  <div id="fb-root"></div><script>(function(d, s, id) {  var js, fjs = d.getElementsByTagName(s)[0];  if (d.getElementById(id)) return;  js = d.createElement(s); js.id = id;  js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=345573468812321";  fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script></div>b)在<head>过后输入以下META ：<meta property="og:type"                 content="article"><meta property="og:title"                 content=" :: "><meta property="og:image"                content="http://xxx.jpg换成你要显示的照片"><meta property="fb:app_id"               content="     你的APPID号码"> c)在 过后，输入以下代码。 <div class="fb-comments" data-href="你的网址/" data-num-posts="4" data-width="445"></div><p><a hfef= 'http://kimhaur.com/656'>GET Facebook comments box ?</a></p>Sample：<div class="fb-comments" data-href="http://ifublog.com" data-num-posts="4" data-width="445"></div><p><a href= 'http://kimhaur.com/656'>GET Facebook comments box ?</a></p>3.可以测试了  =）Blogspot版，可直接参考：http://www.allblogtools.com/tricks-and-hacks/exclusive-integrate-facebook-comments-box-for-blogger-in-very-easy-and-simple-steps-full-guide/
READ MORE
【教学】如何在部落格增加Facebook like的功能（3）–显示头像+For Textcube
分類：
標籤： , , , , ,

【教学】如何在部落格增加Facebook like的功能（3）–显示头像+For Textcube

在过去的两篇文章： 【教学】如何在部落格增加Facebook like的功能 【教学】如何在Blog增加Facebook like 功能（2 ） 提到了如何在Blog里增加Facebook Like的这项功能，很多网友也依据所教的方式去进行了，而且都没有问题，总算小有满足。可惜的是1）之前这个Like的功能稍微有点不够完整，就是无法显示出“like"的人到底有谁。[#M_ more.. | less.. | -----------------------------------------------如果目前你的部落本身并没有显示出图像的话，那就照着这个步骤去做哦（注：以下步骤是For已经有添加facebook like功能的Blogspot博客）1）打开Edit HTML界面2）勾选Expand widget3）用Ctrl + F，查找这段代码：<div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:27px;'/></div>4）把以上3）找出的代码全选，然后删除5）复制以下代码，然后粘贴在刚刚删除旧Facebook like的位置。<div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=true&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:67px;'/></div> 6）插入了我新给你们的这段代码后，应该就可以看见like你的人的头像了。By传说中最帅的电脑老师======================================注2：如果like的人并不在你的friend list里，则不会显示。_M#]2）然后呢，Blogspot更改模板后无法使用like的问题在(2)那篇已经解决了，剩下的另外一个问题就是Textcube用户的问题。如果照着第一篇，其实是很容易的，可是呢，很多人遇上了问题：A)Blog Services Provider （例如Ifublog/Antzblog这些BSP）可能没有在blog里安装FB的插件（Plugin)，而Blogger也没有权限使用Ftp自己去安装Plugin，所以我的方法等于是失效了。B)另外一种情形是，付费的Textcube Blogger（不是使用免费BSP的）完全没有Cpanel和FTP的使用经验，甚至连Password都不懂（从免费BSP里跳出来的blogger大多数就有这个问题><），所以也无法安装插件。因此现在针对Textcube无法安装插件的用户，再附上另一教程=)  各位，请笑纳～～～[#M_ more.. | less.. | (以Ifublog blogger为例子)1)Login进Textcube后台2）去到Skin（模板）->Edit Skin（编辑模板）3)在Skin.html的部分，使用Ctrl+F（查找功能）找寻以下字眼： <div class="article"> </div>4)在<div class="article"> </div>下面插入以下代码：<div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=http://ifublog.com&amp;layout=standard&amp;show_faces=true&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:67px;'></iframe></div>5）完成。注意事项：a)其实有些网站不需要http://也可以的，为安全起见先提醒，如果使用了中文里的：的话，那会造成问题哦！一定要用英文的:b)如果你是个人用户，直接写入你的网址；如果你是BSP用户，就写下你的BSP的网址名（不需要包括你的部落格网址，因为那已经包括在后面的代码了***大多数***）_M#]有任何疑问欢迎留言洽询，我会尽力解答。
READ MORE
[教学]如何在部落格增加Facebook like的功能
分類：
標籤： , , , ,

[教学]如何在部落格增加Facebook like的功能

此篇教学是for Textcube 系统及Blogspot系统使用。For Textcube: [#M_ more.. | less.. | 1.首先,你需要下载这个facebooklike的插件(plugin)。点击下载注：文件已经压缩，下载后请解压。（没有解压软件，请看这里)2.进入网站Cpanel的后台。(方法有几种，可以直接在IE登陆，也可以透过软件如Filezilla来进入。)3.进入到"你的网站名字.com"下的public_html,在进入plugins这个folder.4.在plugins的folder里，制造多新的一个Directory,命名为facebook_like,并将刚才下载了及解压了的文件尽数放完进去这个directory.（包括2个index文件，以及一个images 文件夹**内有三张png图）5.这个时候，可以登陆回部落格的后台了。去到plugin页面，就可以看到有了Facebook的插件了！这个时候，按一下启动它就行啦！_M#]=============================================================For Blogspot[#M_ more.. | less.. | 1.登陆后台，去到Design-->Edit HTML.2.把Expand Widgets Templates 打勾。3.用Ctrl + F （find)的功能，输入 <data:post.body/> 。4.在这下面paste入以下代码：<div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:27px;'/></div>5.save 你的Templates.6.去看看现在有没有出现？_M#]简单吧？=====================那你们也给个脸来留个言按个"Like"吧？by:传说中最帅的电脑老师
READ MORE