效果图、如果看不清楚,可以看部落格的右手边,有一个 Like Ma'blog 的东东,就是那个了。
1. 设计 → 修改 HTML
2. 寻找代码 <head>
3. 在 <head> 后面添加代码:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
4. 设计 → 页面元素 → 添加小工具 → HTML/JavaScript
5. 添加以下代码:
代码有点乱,因为我将全部的代码放入一个小工具里面,避免你们开太多的小工具 ;)<script type="text/javascript">/*<![CDATA[*/jQuery(document).ready(function() {jQuery(".w2bslikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});/*]]>*/</script><style type="text/css">.fblikebox{background: url("图片 url") no-repeat scroll left center transparent;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position: fixed;right: -250px;top: 20%;}.fblikebox div{border: none;position: relative;display: block;}</style><div class="fblikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=专页 url&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div></div>
6. 保存,即可。
小解释
红色代码:Like Ma'blog Here 的图片 url *可改
紫色代码:小工具离顶部多远(% 越大,小工具离顶部越远) *可改
蓝色代码:专页 url *必改
如何取得专页网址
1. 登入你的面子书专页
2. 拷贝网址:
3. 拷贝蓝色 highlight 起来的网址,取代蓝色代码,即可。
Categories: Bii の語法筆記, Facebook 教程, 關於小工具
有Blogskin的吗?:)
ReplyDelete暂时还没有研究到哦 :) 我研究到了,会更新这篇教学的 ^^
Delete可是我加了 like my page 就按 不到 back to top 了 . 有什么代码的问题吗 ? 还是有新的教程 ? :) 很喜欢你的教程和素材 . 加油加油 !
ReplyDelete那是因为你的 Like My Page 的 hover 范围太大了。跟 Back to top 叠在一起了。所以你可以试试把内个 Back to top 移去左边 :)
Delete- replied by Bii.
harlo:)为什么不成功呢?
ReplyDelete有图片可是他没有移出来/\
可能你忘了添加某些代码。
Delete所以请你把之前的添加的代码删掉,再重新添加过试试看 :)
-replied by Bii.
请问你有 like me blog 类是图片嘛?
ReplyDelete抱歉,没有发布过.. :)
Delete-replied by Bii.
怎样得到专业? ><
ReplyDelete