之前写了篇关于Wordpress划词显示分享按钮的文章,作用就是鼠标选中一些文字后会显示出分享按钮出来。因为这个是用jquery写的,所以它不单单在wordpress可以使用。在其他静态页面或者开源系统中等等都可以使用。今天主要对这个功能做了一个小的修改,之前的那个效果有朋友说没有指定范围,这样只要在网页上面都会显示出这个按钮出来感觉不是很美观,所以今儿就针对这个给大家说一下。大家有不了解的先看下之前那篇文章http://www.favortt.com/wordpress-share-button.html

在划词显示分享按钮的文章中提供了下载地址,在里面有一个selectshare.js文件。我们找到第二十四行,这段代码

 $('html,body').mouseup(function(e) {

//我们只需要把html,body修改一下就可以了。

比如磊子网站目前是让它选中文章标题或者文章内容的时候显示分享按钮,那么我们需要找到标题和内容所使用html标签,找到之后把上面的html,body换掉如下代码.

$('#content .posttitle,#content .entry-content').mouseup(function(e) {

//#content .posttitle 是文章标题使用的html标签

//#content .entry-content 是文章内容使用的html标签

//中间要用逗号分开

这样我们就把显示分享按钮的范围缩小到标题和内容上面了,大家可以根据自己的显示地方来修改,查找标签的方法磊子比较喜欢火狐浏览器firebug插件,之前写过这方面的教程,

http://www.favortt.com/wordpress-theme-firebug.html

大家有兴趣的可以看看。