优化Wordpress的用户体验-为你的站点增加回到顶部功能

Oct

| Category 星辰魅 @ 2009/10/31 18:17 Posted by vmey

网上有很多的关于http://wordpress.org.cn/优化的文章,相信各位WP的老鸟早已经看的不耐烦了,既然优化做的很好了,那么我们就要多花一些时间和心思在WP的用户体验上。
好了,下面开始介绍这款插件
这个插件我在玩BB的时候用到的,具体谁写的记不清了,个人感觉很不错。
当你在某年某月某一天写下了一篇很长很长的文章的时候,忍痛之下（你就给发表了,你也不想一想,让你的站丝儿看完这么长一片文章是一件多么痛苦的事啊,好不容易看完了,啊，虽然文章很长，但还不错,可是站丝突然一想,看了半天，可还没看叫啥子名字,就用Mouse拖着右面的Scroll。N秒过去了。终于看到标题了.无形之中,你的站丝儿被雷到了,好粗心的站长.这么长的文章竟然不在底部加回到顶部的锚点）。
说道这里.问题出现了.是否我们在发表每一篇文章的时候都要加锚点呢.那也太麻烦了.下面的这个小插件就派上用场了（其实不算是插件,个人习惯这么叫而已）。
Jsmenu插件：在网站右边或者左边添加导航及上下滚屏功能.功能类似锚点。
具体使用方法：
1.修改以下JS文件

lastScrollY=0; function heartBeat(){ var diffY; if (document.documentElement && document.documentElement.scrollTop) diffY = document.documentElement.scrollTop; else if (document.body) diffY = document.body.scrollTop else {/*Netscape stuff*/} percent=.1*(diffY-lastScrollY); if(percent>0)percent=Math.ceil(percent); else percent=Math.floor(percent); document.getElementById("full").style.top=parseInt(document.getElementById("full").style.top)+percent+"px"; lastScrollY=lastScrollY+percent; } suspendcode="<div id=\"full\" style='left:30px; top:280px; position:absolute;'><table width='20' border='0' cellpadding='0' cellspacing='0'><tr><td align='center'><a href='javascript:window.scroll(0,0)' onfocus='blur()'><img border='0' src='http://yourdomainname/filesname/icon_top.gif' alt='Back to Top' /></a></td></tr><tr><td align='center'><a href='javascript:window.scroll(0,99999)' onfocus='blur()'><img border='0' src='http://yourdomainname/filesname/icon_bottom.gif' alt='Back to Bottom' /></a></td></tr></table></div>" document.write(suspendcode); window.setInterval("heartBeat()",1);

注释：
代码中的的”style=’left:30px; top:280px; position:absolute”可以根据自己的需要修改.
把src=’http://yourdomainname/filesname/替换成你的网站URL和文件夹名.
你也可以自己添加除上下滚屏以外的导航功能.方法很简单,在上面代码的CSS部分追加类似的代码:

2.更新你的header.php文件
用FTP软件将header.php下载到本地,在适当位置添加以下代码:

然后以UTF-8编码形式上传到服务器（原文件应先做好备份）
PS:里面的icon_top.gif可以直接用我站上的,如果要扩展,可以用PS很据你网站的背景照着样子做一下,很简单的
刷新下你的浏览器,看看效果是不是很酷很方便呢,这样就省去了每发表一篇文章都要添加回到顶部代码的烦恼了.
这种方法还有很多扩展功能特性,这就需要你DIY啦O(∩_∩)O~
我刚刚接触WP，可以说还是一个菜鸟,WP着实Let Me喜欢的不得了.经历了PJ的升级的烦恼,又领教了Boblog模板的单调.WP让我领略了PJ的精美和BB的速度(似乎有些矛盾^_^）。总之，还很好用啦！
第一次写这样的文章感觉很有挑战性也很新奇,哈哈,因为除了PLC和单片机以外没学过各种编程。
有写的不对的地方还请各位大侠多多指教。