WordPress 高亮显示关键词及欢迎提示
写这篇文章绝对是受了 Qiqiboy 的刺激,该小盆友说我的 WordPress 站内搜索没有用关键词高亮,而且还有图有真相的,巨受打击。好吧,我顶着明天两门考试可能挂彩的压力,今天就不复习了,全心投入到研究 WordPress 关键词搜索高亮显示的行列中,什么 PHP 啊、JQuery 啊、CSS 啊、正则啊、获取 Cookies 啊,反正能用的我都用上了,8 过神奇的是,折腾出来的不是 WordPress 自带的站内搜索的关键词高亮,而是来自 Google、百度等搜索引擎的关键词高亮显示,并且对访客显示欢迎提示词。
这样说是很难让人理解的,你可以先试试用百度或者 Google 搜索本站的关键词“万戈”,再通过搜索引擎的结果点击进入本站,就可以看到效果了,在右侧栏的位置可以看到一个可以随滚动条上下浮动的弹出层,显示“欢迎来自 *** 的朋友!推荐您 点击这里 订阅我的博客 o(∩_∩)o ”,这里的 *** 是可以显示通过哪个搜索引擎入口来访的,很亲切哟。
另外,用我的一些其他的关键词,如“WordPress 读者墙”之类的,通过搜索引擎点击进入本站,则会看到你搜索的关键词已经加粗高亮,这样也就强调了访客希望看到的重点内容,提高了访客的体验。
以下两张分别是搜索引擎的关键词高亮和来自搜索引擎的访客欢迎提示词的截图。
![]() 搜索高亮显示关键词 |
![]() 搜索访客显示欢迎提示词 |
好了,废话到此结束,下面是代码部分,首先要感谢一下 landing-sites 插件的作者,我就是在此研究成果上精简修改并折腾出了非插件版本的、更适合中国本土搜索引擎、再加上我无敌美化的代码~
一、首页是 PHP 的函数部分,老规矩,把以下代码复制到 WordPress 主题目的 functions.php 中:
$search_engines = array (
'google.com' => 'q',
'google.com.hk' => 'q',
'baidu.com' => 'wd',
'search.yahoo.com' => 'p',
'cn.search.yahoo.com' => 'p',
'cn.bing.com' => 'q',
'search.lycos.com' => 'query',
'youdao.com' => 'q',
'search.aol.com' => 'query',
'ask.com' => 'q',
'hotbot.com' => 'query',
'overture.com' => 'Keywords',
'search.netscape.com' => 'query',
'search.looksmart.com' => 'qt',
'search.earthlink.net' => 'q',
'search.viewpoint.com' => 'k',
'mamma.com' => 'query'
);
$delim = FALSE;
if (isset($search_engines[$ref])) {
$delim = $search_engines[$ref];
}
return $delim;
}
function ls_get_terms($d) {
$terms = null;
$query_array = array();
$query_terms = null;
$query = explode($d.'=', $_SERVER['HTTP_REFERER']);
$query = explode('&', $query[1]);
$query = urldecode($query[0]);
$query = str_replace("'", '', $query);
$query = str_replace('"', '', $query);
$query_array = preg_split('/[\s,\+\.]+/',$query);
$query_terms = implode(' ', $query_array);
$terms = htmlspecialchars(urldecode($query_terms));
if (!seems_utf8($terms)){
$terms=iconv("GBK", "UTF-8", $terms);
}
return $terms;
}
function ls_get_refer() {
if (!isset($_SERVER['HTTP_REFERER']) || ($_SERVER['HTTP_REFERER'] == '')) return FALSE;
$referer_info = parse_url($_SERVER['HTTP_REFERER']);
$referer = $referer_info['host'];
if (substr($referer, 0, 4) == 'www.')
$referer = substr($referer, 4);
return $referer;
}
function ls_getinfo($what) {
$referer = ls_get_refer();
if (!$referer) return FALSE;
$delimiter = ls_get_delim($referer);
if ($delimiter)
{
$terms = ls_get_terms($delimiter);
if ($what == 'isref') {
return ($terms != ''?true:false);
}
if ($what == 'referrer') {
$parsed = parse_url($_SERVER['HTTP_REFERER']);
echo '<a href="http://'.$parsed['host'].'">'.$parsed['host'].'</a>';
}
if ($what == 'terms') { echo $terms; }
}
}
function ls_terms_filter($content){
$referer = ls_get_refer();
$output = '';
$delimiter = ls_get_delim($referer);
if($delimiter)
{
$terms = ls_get_terms($delimiter);
$terms= array_unique(preg_split("/[\s,]+/", $terms));
$contentarr = preg_split("/(<.*>)/U", $content, -1, PREG_SPLIT_DELIM_CAPTURE);
$stop = count($contentarr);
for ($i = 0; $i < $stop; $i++) {
$content = $contentarr[$i];
if ((strlen($content) > 0) && ('<' != $content{0})) {
foreach ($terms as $term) {
if (strlen($term)>1)
$content=eregi_replace("($term)","<b style='background:#ffff00;'>\\1</b>", $content);
}
}
$output .= $content;
}
return $output;
} else{
return $content;
}
}
add_filter('the_content', 'ls_terms_filter');
add_filter('comment_text', 'ls_terms_filter');
function ls_set_header() {
if (ls_getinfo('isref')) header('Vary: Referer', FALSE);
}
add_action('init', 'ls_set_header');
可以看到在搜索引擎的数组中,我加入了 google.com.hk、百度、有道、必应等适合中国网民的搜索引擎,当然你也可以按照这样的格式再添加几个。
二、是 HTML 和调用以上函数的部分,可以放在任何地方,个人建议放在 footer.php 中,最后用样式定一下位嘛就可以了:
<div id='hellobaby'>欢迎来自 <?php ls_getinfo('referrer'); ?> 的朋友!<br />推荐您 <b><a href='http://feed.wange.im' target='_blank'>点击这里</a></b> 订阅我的博客 o(∩_∩)o
<div class="closebox"><a href="javascript:void(0)" onclick="$('#hellobaby').slideUp('slow');$('.closebox').css('display','none');" title="关闭">×</a></div>
</div>
<?php endif; ?>
三、最后是样式部分,这个各位可以发挥各自所长,下面我就提供一下我的样式表,仅供参考:
background:#000000;
border:1px solid #B3B3B3;
color:#FFFFFF;
font-size:14px;
opacity:0.7;
filter:alpha(opacity=70);
padding:10px;
position:absolute;
right:0;
top:250px;
}
写到这里,功能上已经实现了,剩下的就是美化工作,最后的最后,你也可以像我这样,给旁边的欢迎提示词用 JQuery 加一个滑动效果,那就更炫了,不过因为篇幅有限,我这里就不多介绍了。
最后的最后的最后,还要感谢 http://www.chinawp.com/2009/10/106/ 此文,给了我很大的帮助,本文的灵感就来源于此。
-
Wordpress 站内搜索高亮显示关键词2010年07月18日 -
万戈牌 WordPress 搜索自动匹配提示标签关键词2012年04月7日 -
给 WordPress 添加语音搜索功能2011年12月4日 -
万戈牌 Fuck IE6 非插件版2011年05月13日


Pingback: 转自万戈博客:WordPress 向来自其他域的访客致欢迎词 « 软件开发者博客
灰常有用! 哈哈
Pingback: STEC issues rosy 2011 outlook | Full Moon Party Thailand
Pingback: 转自万戈博客:WordPress 向来自其他域的访客致欢迎词 | CoreJava程序员天堂
这个我试试
Pingback: 【转】WordPress 向来自其他域的访客致欢迎词 | 海蓝博客
Pingback: 在页面上提示搜索引擎和关健字 | upall 's blog
呵呵,非常感谢啊
额,提示框不会向下滑动
向下滑动的需要另外加一个jquery的效果,不在本文讨论范围内
大仙,将position的'absolute'改为'fixed'也可以实现,效率要高一些。
欢迎回访 ^_^
敬仰中 几天没来看 折腾出来这么多新功能
继续折腾吧
续折腾吧
折腾吧
腾吧
吧……
标准肥音呀,哈哈
欢迎提示词如何用 JQuery 加一个滑动效果?
提示被侧边栏广告盖住了,怎样让他现在在上面那层
对层的前后控制可以用z-index
还有个问题就是首页出不来这个欢迎提示,只有内容页有
那你肯定没有放在全局,看看是不是被嵌套在if(is_single())或者if(!is_home())之类的判断句里了
什么事都难不倒你,解决,谢了
哈哈,是借鉴,借鉴
加亮了不好看
但是够醒目啊
前来膜拜老万
你可以的, 加入那么多搜索引擎列表,有点舍我其谁的感觉,似乎向搜索榜宣告 我就不信 你们找不到 我的关键词
哈哈,就是这个意思
这个也不影响页面速度啊
代码,好长,好长,好长啊!
万哥好生勤奋的折腾博客!~
折腾是博客的生命力啊
万戈,我觉得你像是一位科学家
不懂
强大的站长队伍..
凡是跟网站技术,网站SEO,有关的必火
还没见过一个火火生活博客.
其实简单一点也很好的 啊
那么有人气。。。。。厉害高手
WM6.1,Ucweb6.7下出现的错误代码,具体自己检查下吧,说不定就是你这个效果造成的……
看到一长串代码~我晕了
原插件里的更多更长呢,我已经精简啦
原来要进入结果页面才能看到了,我还以为在搜索里面都能看到呢,差点被忽悠了
站内搜索也可以有,但是对中文支持不太好,我还在改进中
现在不玩技术流了。
我也不太玩,只是瞎折腾,还是以生活为主
咳咳..你的折腾挺偏题的吧,呵呵
发现搜索万戈,第二位是万戈免洗用品网
最讨厌这个啥啥免洗的,早晚淹没它
看看我什么时候搞个万戈seo,帮你把它给淹没,然后让你买下我的站,嘿嘿。这样第一第二都是你的了..
好热闹哦,来挤挤,学习学习!
这个很不错哦!
这个让我联想到做链接站
我说怎么从google过来右边有个东西在飘啊飘啊的,原来是这样~~
。。。哈哈,这是我新折腾上去的,炫吧?
学习了!
我好像见过一个WordPress的插件可以实现这个功能
是啊,我就是从这个插件里提取出来的
万戈不是人...
是牛字头的人 介于牛A与牛C之间的人物
别,我还是人比较好
折腾得不错 学习学习
晕 你也写了 呵呵
嘿,一人一篇,而且方法各不相同,留作参考
我刚刚还在忘了是什么人的人那里看到了实例....css效果都是一样的orz运用的太速度了
ps再求一段随机显示访客欢迎词的代码..我知道你这里肯定有 我好懒啊啊啊
随机显示欢迎词,就是加一个随机数组,你可以看看这篇:
http://wange.im/random-ads-with-array-in-wordpress.html
原理是一样的
我恨,我超恨GG Reader,更新太慢了
不是gg reader更新慢,是我的twitter有同步更新,哈哈
才在qiqiboy上看到的,我嵌入了自定义GG搜索,貌似不需要这么折腾
我没有用gg自定义的搜索,感觉搜索出来的内容太多了。。。
会把归档页什么也搜出来
被世博摆布中.....过来挤一挤~~
哈哈,期待你早日来世博呀~
万戈其实加这么多函数进去,跟插件差不多了,而且你不想用的时候还不能像插件那样直接忽视掉,无疑增加了工作量
已经从插件那里精简了很多,再也简不下去了
插件能删除的地方也就几个hook函数而已,这样跟安装了插件没啥区别
怎么看到这个文章突然没心情了....
被长串的代码吓到了?
路过路过..搜索已经被我卸掉了..
那只兔子怎么变成肥猪流了?
以前用过一个插件,就有关键字高亮,还有订阅提示
应该就是我说的插件吧,我只是把插件内容提取出来,并且优化了一下下,弄成了非插件
恩,我就用你文章里的代码了
我qiqiboy那里看到那篇文章我就想到wange不会放过这次出文的机会!
啊哈,还是你了解我呀
老万现在挺不无聊的。。
天气很好呀。。
今天连下两场暴雨,心情沉重
天气凉爽啊,难道天天热死了才好呀。。
不啊,我看今天香港也是下了場暴雨,爽得很
終於都下雨了~不用那麼悶熱啊
哇塞,楼上太速度了,google reader刚更新到这边的楼都满了~~~
哈哈,前排都不是gg reader来的啦
想不到Google Reader也更新慢了啊。%……
打了激素的小万,很无敌啊!
还留了半支,明天再打!
在google測試成功~
我無可救藥地愛上了萬戈……………的折騰。
在侧边栏没有显示“的折腾”。
赶紧截图证明,发给你大老婆一份
已经发给她了,被她无视了
我再一次杯具
看了截图,表示蛋定
跟大老婆握手!! 還是大老婆明白我
这个是要 Google 搜索的吗?
主流的搜索引擎都可以的
我从自己的博客到你的博客,怎么没有欢迎提示啊?
呃。。。这是没有的,只有来自搜索引擎的才有
我用百度试了一下也没有啊?可能是我原来就在线了的原因?
有啊,刷新一下你的浏览器缓存试试
昨天在qiqi那里看了 你又被例子了
这两天我被截图的比较多呀,哈哈
大家都喜欢拿你当例子,都还是反例
悲剧帝重现江湖
我新发的博文到现在都沙发空缺怎么没有人抢呢。
我去也!!!
歡迎代碼我拿走了
今天刚在那边看过
流年小盆友这两天没有刷屏呀/
呀,昨天万戈这里抽风;今天这是完全没精神、没动力呢
这次要是挂了,我代表广大读者向你表示慰问。
这代码有用。
早用过了,不过方法不一样
看到高亮的效果了,回去更新了一下博客,
看到了?如何如何呀?
和你的图片一样啊。
代碼好長~~好長~~~~~~喔
只可惜站内搜索没有高亮
站内高亮我正在研究
嘿嘿,站内搜索高亮也搞定啦,求测试
貌似测试失败嘿,没有高亮啊
并且那个放大镜竟然就是个摆设,得点“Go”
暂时只支持英文,中文的正则还没有写好
好像还没有站内搜索哦。。
已经完美实现站内搜索关键词的高亮功能,支持中英文,欢迎测试
朗格里格朗
嗡嘛呢叭咪吽
這是什麼方言
? 小的看不懂
就是朗格里格朗升级版啊
这个我找了很久了。。不行。我得整上
哈哈,整上后我来验收效果
整上去了。。快严守效果去。。快去快
去!
哈哈,已经验收通过啦,还有个站内搜索的功能哟
哇 这个功能很不错 过几天有时间我也折腾上去~
恩恩,可以增加访客黏度,不错的哟
好牛叉的万老爷
不牛叉,只是建立在前辈的基础上
啊哈哈。。你看,我一激励你,你立马就出成果了。。。
另外,你的方法在我这里不太适用,我还在研究新的站内搜索高亮关键词的方法,嘿嘿
http://philna.com/2009/09/highlight-keywords/ 你可以看一下这篇文章,希望对你有用。。。
哈哈,省去我不少折腾了,谢谢啊
试了,怎么没显示欢迎来自“百度的朋友”?我看到了一个“万戈免洗用品网”你又开了一个网站啊?
。。。
那绝对和我没有半毛钱关系
难道他的名字里也有一个“成字”?还是他看到你的博客发展迅猛,想占点光?你的这篇博文会主他的IP有小幅度上升。
我靠,老佛爷 不是我批评你,我考试之前30分钟 还是在上网 哈哈,考试期间 还是上网着的,哈哈哈!
唉,小苏子,太小看你老佛爷了,爷我是在考试的时候都上着网呢
明显是查答案在!
哈哈,聪明呀小苏子,这年代传纸条已经OUT了,老佛爷也是与时俱进,玩高科技的
那总得有答案查,你比不上咱啦 咱都是事先把答案放到博客里面 哈哈哈哈哈!
文章比较长,慢慢看哈,嘿嘿
干嘛在那个边边角角上弄这么小的一个框?还黑乎乎的,不显眼啊
黑乎乎还不显眼呀。。。。
那个位置出现得太出人意料啦,不上不下的。不如把New的正文部分都糊住,只留个题目~
这个太邪恶了,影响童鞋们抢沙发的积极性
前排,去Google试一下
看来你是完全有实力沙发的, 是让着我们呢,看完文章了还前排,在万戈的博客不错了。
怎么就我一个人?
别人都怎么了?
是你来的太早了
今天我没有刷啊,只是来的巧。
。。。昨天现在抢沙发的都说是巧合
真的是巧合啊,昨天來到的前一秒沒新文、再刷一次就有了,我不搶誰搶……
w
你是想和那个啥MM一争高下是吧
没有啊?我当过水王了,也想坐一回沙发帝。
确实想
我不介意啊

)
反正我已經退出SF黨了,就是閒得蛋痛時去木木家搶個SF娛樂而已~
(該不是又是我誤會以為是在說我吧
蛋痛?
我雖然沒JJ可是終日都在蛋痛的……
(獵奇了
MM怎么又说到JJ了?
没有你就没意思了。
不,你搶SF比我更瘋狂,我不好意思滅了你對SF的熱情……
没有人抢哪来的热情?单为了抢沙发的话,有好多博客可以抢的。何必到万戈这个这么难抢的地方来抢。
之前是因為要跟萬戈和看倌們混個熟露個臉才瘋狂搶SF嘛~
既然事成了倒不如灌灌水更好= =+
木木家好抢,不过还有我呢
你是想说没有JJ的MM吧?
你掌握不了重點啊
這是什麼意思……
小闇MM好像有点生气了。
沒有啊
八戒,你师傅喊你回家啦。
快回家修煉修煉去~