WordPress网站如何显示用户搜索历史记录

有些网站会显示用户在网站的搜索记录,搜索了哪些词等等。我们在自己做网站时,也可以在自己的网站上添加显示用户搜索历史记录功能。通常用户在网站上的行为会被记录到 Cookies 里,所以通过 Cookies 就可以显示用户搜索历史记录。

第一步:将用户搜索记录写入 Cookie

  1. /**
  2. * 通过Cookie记录用户搜A 0 t ] v索记录
  3. */
  4. function wpkj_set_recently_s= G ~ { e bearches(6 A $ b){
  5. //仅在前端搜索页面s 7 R执行
  6. if ( is_sp * @ 3 F Eearch() && !is_admin() ) {
  7. $search_term| 2 K @ S 9 j = get_search_query();
  8. if( $E t w z 7 n psearch_term ) $search_term = trim&| t v K )#40; $search_term );
  9. //如果搜索字段不存在或为空,不继续
  10. if(J Q * & D | 1 d Z !$search_term || $search_term === ) return;
  11. //检查并设置搜索G q Q _ F , |历史数组
  12. $recently_sear( 3 , 1 T B @ =ches = array();
  13. if(isset($_COOKJ I k * n Q @IE[‘wpkj_recently_searches’])) {
  14. $recentf Y * n r R * [ ely_sear u &rches = explode(| ) ^ m n 4 / i \,’, $_COOKIE[‘wpkj_recently_searches’], 20&N \ H u \ . E ? H#41;I – m Q 8 d i ( b;
  15. }
  16. if(!in_array&U ; s 4 @#40; $search_term, $recently_searches&#1 ` / 9 $ A J41;){
  17. $recently_searches[&#9, V m t l o3; = $search_term;
  18. }
  19. //设置cookie为30天
  20. setcookie(‘w6 # v 5pkj_recently_searches’, implode(‘,’, $recently_searches), current_time(‘timestamp’) + (86400*30), "/");
  21. }
  22. }
  23. add_action( ‘wp’, ‘wpkj_set_recently_searches’, 20 );

在上面i x q Q 3 N w f代码中,我们封装了一个 wpkj_set_recently_searches 函数,然后将该函数挂载到 wp 钩子中执行。

第二步:获取并输出用户的搜索记录

  1. /**
  2. * 获取用户最近搜索记录
  3. */
  4. function wpkj_get_recently_searches( $limit = 10, $title = false &#) C y J o 1 e g 441;{
  5. $recently_searches = array();
  6. if(isset($_COOKIE[‘wpkj_receL G i = O 5 b 5ntly_searches’])) &#123. @ a =;
  7. $recently_searches = expl! ] 2ode(‘,’, $_COOKIE[‘wpkj_recently_searches’]);
  8. //将搜索记录倒序
  9. $recently_searches = array_rev1 ^ C ; uerse($recently_searches);
  10. if( !empty($recently_searches) ) {
  11. $HTML = ‘<d7 } 8 % = ]iv class="recB ^ \ . aently-searches">’;@ b Q =
  12. if($ T D \ \ $title ) $html .= ‘<h2 class="searches-title reE 5 c w P Tcently-searches-tiI ? Ntle&quo, R Zt;>’. htmlspecialcharg } s y # . y ls($title) .‘</h2>’;
  13. $html .= ‘<ul classk J : v j n p &="recently-searches-ul">’;
  14. $home_url_slash = ge2 ; ^ w o . rt_option(‘home’&#E : % \ n O H p e41; . g k J/’{ ` [ v T R g ) t;
  15. $i = 1;
  16. foreach( $recen, s V R n 2 7 gtly_searche5 $ ` ! % u M \ Cs as $result ) &I I G#123;
  17. $html .= ‘<li class="search-item"><a href=&q] T : \ d Q U Uuot;’.` V r 1 / | ) i @ $home_| L vurl_slash . x \ L?s=’ . $result . ‘">’. htmlspecial} B – q 3 \ P k hchars($result) .‘</a></li>’;
  18. $i++;
  19. }
  20. $html .= ‘&l& v W [ ^t;/ul>’;
  21. $html .= ‘<div class="recently-searches-del&/ H Iquot;>’.__( ‘ClG % I v # = hear search history’, THEME_SLUG &#7 % % [ C41;.‘</div>’;
  22. $html .= ‘</div>’;
  23. return $html;
  24. }
  25. }
  26. &#1250 ^ r F ~ T X;

wpkj_get_recently_searches 函数有两个参数,第一个为调用的个数,第二个为标题l J b ^ 3。然后我们可以在需要输出搜索记录的z K [ q # D ,地方# N 9 6 \ y *,使用下面的代码即可:

  1. if(function_exists(‘wp+ 1 0 @ C V = Vkj_get_A L Z m l j P ? erecently_searches’&#4n u w1;) {
  2. echo wpkj_get_recently_seq k ^ K ? L zarches( 10, ‘搜索历史’);
  3. }

第三步:添加清空当前用户搜索历史功能。这里通过 js 方式实现:

  1. //添加一个js函数用于删除cookie
  2. function delCookH # A 5 Y ) N niP 8 n Q ? q Ze(name) {
  3. var exp = new Date();
  4. exp.setTime(exp.getTime() 1);
  5. var cval = getCookie(name);
  6. if (cval != null) document.cookie = name + "& = G / 6 H $ e #=" + cval + &quot: ) z ^;;expires=" + exp.toGMTString();
  7. }
  8. jQuery(documq M h N 5 Q 1 ~ent).readf T W O o Hy(function($) {
  9. $&#6 e 0 W40;".recently-0 j S M \ Psearches-del&\ K f y _ ^ Jquot;).on("click", function() {
  10. //删除cookie
  11. delCookie("wpkj_recently_searches"&K Y : b u w $#41;;
  12. //隐去搜索历史部分的内容
  13. $(~ ; G".recently-searches").fadeOut();
  14. }&#41W Z ( +;;
  15. });

你可以将上面的 js 代码添加到一个 js 文件中,比如命名为 recently-searches.js,然后可以通过下面的代码引入:

  1. //引入搜索历史js
  2. function wpkj_recently_searches_scrip; \ Z Q N @ * ots() {
  3. wp_enqueue_script( ‘recently_? F ! \ {searches’, get^ n # 6 g M w_template_directory_uri() . ‘/assets/js/recently-seaD d e mrches.js’,R ; r array( ‘jquez S Xry’ ), , true );
  4. &#1254 f 6 T 2;
  5. addo 7 L # u_action( ‘wp_enqueue_scripts’, ‘wpkj_rece1 w { ` / _ntly_searches_scripts’ );

请注意下5 q h 2 Y f js 文件的路径,上面的代码表示我将 recently-searches.js 放在了当前主题的 /assets/js 目录下,你需要根据自己的实际修改这个路径。

这样,我们就\ H D s 2 v 3 ~ p在自己的网站上添加了显示用户搜索历史记录功能了。

给TA打赏
共{{data.count}}人
人已打赏
WordPress教程

WordPress后台开发,无插件增加一键复制文章页面功能

2022-4-15 13:54:56

WordPress教程

检查 WordPress 数据库中是否存在标签

2022-5-7 13:52:30

下载说明

  • 1、微码盒所提供的压缩包若无特别说明,解压密码均为weimahe.com
  • 2、下载后文件若为压缩包格式,请安装7Z软件或者其它压缩软件进行解压;
  • 3、文件比较大的时候,建议使用下载工具进行下载,浏览器下载有时候会自动中断,导致下载错误;
  • 4、资源可能会由于内容问题被和谐,导致下载链接不可用,遇到此问题,请到文章页面进行反馈,以便微码盒及时进行更新;
  • 5、其他下载问题请自行搜索教程,这里不一一讲解。

站长声明

本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有;若为付费资源,请在下载后24小时之内自觉删除;若作商业用途,请到原网站购买;由于未及时购买和付费发生的侵权行为,与本站无关。本站发布的内容若侵犯到您的权益,请联系本站删除,我们将及时处理!
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索