西数超哥博客
运维经验教程分享

wordpress 网站多条件筛选功能制作(纯代码)

我们经常在网上看到一些网站,拥有多重筛选功能。例如一些房产网站上,就会经常使用多条件筛选功能,方便用户进行筛选房源。效果如下图:

自己做网站时,如何制作这样的多条件筛选功能呢?下面学做网站论坛就来介绍一下这种多条件筛选功能制作方法。

方法/步骤

  1. 创建自定义分类,增加多个筛选条件。复制下面的代码,你可以直接复制粘贴到functions.php文件中。
    
    
       
        
         //给post创建四个自定义分类法
         
    add_action (\ 'init\', \'ashu_post_type\');
    function ashu_post_type() {
      register_taxonomy(
        \'province\',
        \'post\',
        array(
          \'label\' => \'省\',
          \'rewrite\' => array( \'slug\' => \'province\' ),
          \'hierarchical\' => true
        )
      );
      register_taxonomy(
        \'city\',
        \'post\',
        array(
          \'label\' => \'市\',
          \'rewrite\' => array( \'slug\' => \'city\' ),
          \'hierarchical\' => true
        )
      );
      register_taxonomy(
        \'genre\',
        \'post\',
        array(
          \'label\' => \'类型\',
          \'rewrite\' => array( \'slug\' => \'genre\' ),
          \'hierarchical\' => true
        )
      );
      register_taxonomy(
        \'price\',
        \'post\',
        array(
          \'label\' => \'价格\',
          \'rewrite\' => array( \'slug\' => \'price\' ),
          \'hierarchical\' => true
        )
      );
    }
  2. 添加完以上代码后,应该在后台左侧菜单会多出四个自定义分类法:
  3. 在自己网站的主题文件夹下面建立一个page-sift.php文件,这个文件将作为筛选页面的模板文件。
  4. 添加重写规则,使得wordpress 网站多条件筛选功能页面也可以伪静态。将下列代码存放到 include/rewrite.php文件中:
    
    
       
        
         //获取筛选页面的Url
         
    function ashuwp_sift_link ( ) {
      return home_url ( ) . "/sift" ;
    }
    /*
    *添加query变量
    */

    function ashuwp_query_vars ( $public_query_vars ) {
        $public_query_vars [ ] = 'ashuwp_page' ;
        $public_query_vars [ ] = 'condition' ;
        return $public_query_vars ;
    }
    /*
    *sift页面的重写规则,三种url:
    *ashuwp.com/sift   ashuwp.com/sift/0_0_0_0/    ashuwp.com/sift/0_0_0_0/page/2
    */

    function ashuwp_rewrite_rules ( $wp_rewrite ) {
      $new_rules = array (
        'sift/?$' => 'index.php?ashuwp_page=sift' ,
        'sift/([^/]+)/?$' => 'index.php?ashuwp_page=sift&condition=' . $wp_rewrite -> preg_index ( 1 ) ,
        'sift/([^/]+)/page/?([0-9]{1,})/?$' => 'index.php?ashuwp_page=sift&condition=' . $wp_rewrite -> preg_index ( 1 ) . '&paged=' . $wp_rewrite -> preg_index ( 2 )
      ) ;
      $wp_rewrite -> rules = $new_rules + $wp_rewrite -> rules ;
    }
    /*
    *载入模板规则
    *用page-sift.php作为筛选页面的模板文件
    */

    function ashuwp_template_redirect ( ) {
      global $wp , $wp_query , $wp_rewrite ;
      if ( ! isset ( $wp_query -> query_vars [ 'ashuwp_page' ] ) )
        return ;
      $reditect_page =   $wp_query -> query_vars [ 'ashuwp_page' ] ;
      if ( $reditect_page == "sift" ) {
        include (get_template_directory ( ) . '/page-sift.php' ) ;
        die ( ) ;
      }
    }
    /*
    *更新重写规则
    *激活主题的时候
    */

    function ashuwp_flush_rewrite_rules ( ) {
      global $pagenow , $wp_rewrite ;
      if ( 'themes.php' == $pagenow && isset ( $_GET [ 'activated' ] ) )
        $wp_rewrite -> flush_rules ( ) ;
    }
    add_action ( 'load-themes.php' , 'ashuwp_flush_rewrite_rules' ) ;
    add_action ( 'generate_rewrite_rules' , 'ashuwp_rewrite_rules' ) ;
    add_action ( 'query_vars' , 'ashuwp_query_vars' ) ;
    add_action ( "template_redirect" , 'ashuwp_template_redirect' ) ;
  5. 将下面代码存放在步骤三新建的page-sift.php文件中;
    
    
       
        
         <!DOCTYPE html>
         
    <html lang="zh-CN">
    <head>
    <meta charset="UTF-8">
    <title>筛选页面教程 </title>
    <link rel='stylesheet' id='ashuwp-style-css'  href='<?php echo get_stylesheet_uri(); ?>' type='text/css' media='all' />
    </head>
    <body>
    <div id="site-page">
    <div id="header">
    <h1 id="logo">
      <a href="http://www.treework.cn">treework.cn </a>
    </h1>
    <h2 class="align-cenetr">阿树工作室--筛选页面教程 </h2>
    </div>
    <div class="container content">
    <?php
    //1.1 获取所有province分类,将id放入 $province_id数组
    $args = array(
      'taxonomy'=>'province',
      'orderby'=>'id',
      'hide_empty'=>0
    );
    $province_ob = get_categories( $args );
    $province_id = array();
    foreach($province_ob as $province){
      $province_id[] = $province->term_id;
    }
    //1.2 获取所有city分类,将id放入 $city_id数组
    $args = array(
      'taxonomy'=>'city',
      'orderby'=>'id',
      'hide_empty'=>0
    );
    $city_ob = get_categories( $args );
    $city_id = array();
    foreach($city_ob as $city){
      $city_id[] = $city->term_id;
    }
    //1.3 获取所有genre分类,将id放入 $genre_id数组
    $args = array(
      'taxonomy'=>'genre',
      'orderby'=>'id',
      'hide_empty'=>0
    );
    $genre_ob = get_categories( $args );
    $genre_id = array();
    foreach($genre_ob as $genre){
      $genre_id[] = $genre->term_id;
    }
    //1.4 获取所有price分类,将id放入 $price_id数组
    $args = array(
      'taxonomy'=>'price',
      'orderby'=>'id',
      'hide_empty'=>0
    );
    $price_ob = get_categories( $args );
    $price_id = array();
    foreach($price_ob as $price){
      $price_id[] = $price->term_id;
    }
    //2 参数处理
    //2.1 页码
    $wp_query->query_vars['paged'] > 1 ? $pagenum = $wp_query->query_vars['paged'] : $pagenum = 1;
    /*2.2 从url中获取参数 即url中 0_0_0_0
    *将获取到的四个参数放入 $cons 数组中
    */
    global $wp_query;
    if( isset($wp_query->query_vars['condition']) && $wp_query->query_vars['condition']!='' ){
      $condition = $wp_query->query_vars['condition'];
      $conditions = explode('_',$condition);
      $cons = array();
      if(isset($conditions[0])){
        $conditions[0] = (int)$conditions[0];
      }else{
        $conditions[0]=0;
      }
      if(isset($conditions[1])){
        $conditions[1] = (int)$conditions[1];
      }else{
        $conditions[1]=0;
      }
      if(isset($conditions[2])){
        $conditions[2] = (int)$conditions[2];
      }else{
        $conditions[2]=0;
      }
      if(isset($conditions[3])){
        $conditions[3] = (int)$conditions[3];
      }else{
        $conditions[3]=0;
      }
      //从url中获取到的各分类法分类ID是否真实存在
      if( in_array($conditions[0],$province_id) ){
        $cons[0]=$conditions[0];
      }else{
        $cons[0]=0;
      }
      if( in_array($conditions[1],$city_id) ){
        $cons[1]=$conditions[1];
      }else{
        $cons[1]=0;
      }
      if( in_array($conditions[2],$genre_id) ){
        $cons[2]=$conditions[2];
      }else{
        $cons[2]=0;
      }
      if( in_array($conditions[3],$price_id) ){
        $cons[3]=$conditions[3];
      }else{
        $cons[3]=0;
      }
      $sift_link = ashuwp_sift_link().'/'.$cons[0].'_'.$cons[1].'_'.$cons[2].'_'.$cons[3];
    }else{
      $cons = array(0,0,0,0);
      $sift_link = ashuwp_sift_link().'/0_0_0_0';
    }
    ?>
    <div class="sift_query">
    <div class="sift_cons">
    <div class="sift_li">
    <span>省: </span>
    <a <?php if($cons[0]==0){ echo 'class="current"'; } ?> href=" <?php echo ashuwp_sift_link(); ?>/0_ <?php echo $cons[1];?>_ <?php echo $cons[2];?>_ <?php echo $cons[3];?>/">不限 </a>
    <?php
    foreach( $province_ob as $province ){
    ?>
      <a href="<?php echo ashuwp_sift_link(); ?>/ <?php echo $province->term_id; ?>_ <?php echo $cons[1]; ?>_ <?php echo $cons[2]; ?>_ <?php echo $cons[3];?>" <?php if($cons[0] == $province->term_id){ echo 'class="current"'; } ?>> <?php echo $province->name; ?> </a>
    <?php } ?>
    </div>
    <div class="sift_li"><span>市: </span><a <?php if($cons[1] == 0){ echo 'class="current"'; } ?> href=" <?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0];?>_0_ <?php echo $cons[2]; ?>_ <?php echo $cons[3];?>/">不限 </a>
    <?php
    foreach( $city_ob as $city ){ ?>
        <a href="<?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0]; ?>_ <?php echo $city->term_id; ?>_ <?php echo $cons[2]; ?>_ <?php echo $cons[3];?>" <?php if($cons[1] == $city->term_id){ echo 'class="current"'; } ?>> <?php echo $city->name; ?> </a>
    <?php } ?>
    </div>
    <div class="sift_li"><span>类型: </span><a <?php if($cons[2] == 0){ echo 'class="current"'; } ?> href=" <?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0];?>_ <?php echo $cons[1]; ?>_0_ <?php echo $cons[3];?>/">不限 </a>
    <?php
    foreach( $genre_ob as $genre ){ ?>
        <a href="<?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0]; ?>_ <?php echo $cons[1]; ?>_ <?php echo $genre->term_id; ?>_ <?php echo $cons[3];?>" <?php if($cons[2] == $genre->term_id){ echo 'class="current"'; } ?>> <?php echo $genre->name; ?> </a>
    <?php } ?>
    </div>
    <div class="sift_li"><span>价格: </span><a <?php if($cons[3] == 0){ echo 'class="current"'; } ?> href=" <?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0];?>_ <?php echo $cons[1]; ?>_ <?php echo $cons[2]; ?>_0/">不限 </a>
    <?php
    foreach( $price_ob as $price ){ ?>
        <a href="<?php echo ashuwp_sift_link(); ?>/ <?php echo $cons[0]; ?>_ <?php echo $cons[1]; ?>_ <?php echo $cons[2]; ?>_ <?php echo $price->term_id; ?>" <?php if($cons[3] == $price->term_id){ echo 'class="current"'; } ?>> <?php echo $price->name; ?> </a>
    <?php } ?>
    </div>
    </div>
    <?php
    //代码来源:学做网站论坛https://www.xuewangzhan.com/ 将获取到的参数组合为query_posts的参数
    $tax_query = array(
        'relation'=> 'AND',
    );
    //province
    if( $cons[0] != 0 ){
        $tax_query[] = array(
            'taxonomy'=>'province',
            'field'=>'id',
            'terms'=>$cons[0]
        );
    }
    //city
    if( $cons[1] != 0 ){
        $tax_query[] = array(
            'taxonomy'=>'city',
            'field'=>'id',
            'terms'=>$cons[1]
        );
    }
    //genre
    if( $cons[2] != 0 ){
        $tax_query[] = array(
            'taxonomy'=>'genre',
            'field'=>'id',
            'terms'=>$cons[2]
        );
    }
    //price
    if( $cons[3] != 0 ){
        $tax_query[] = array(
            'taxonomy'=>'price',
            'field'=>'id',
            'terms'=>$cons[3]
        );
    }
    $args = array(
        'paged' => $pagenum,
        'tax_query'=> $tax_query
    );
    global $ashuwp_query;
    $ashuwp_query = new WP_Query( $args );
    ?>
    <div class="query_count">共找到 <?php echo $ashuwp_query->found_posts;?>个符合条件的内容 </div>
    </div>
    <?php
    if($ashuwp_query->have_posts()) : ?>
    <div id="post_list">
    <?php while($ashuwp_query->have_posts()) : $ashuwp_query->the_post(); ?>
    <div class="post">
      <a href="<?php the_permalink();?>"> <?php the_title();?></a>
    </div>
    <?php endwhile;?>
    </div>
    <?php endif; ?>
    <div id="ashuwp_page">
    <?php
    $pagination = paginate_links( array(
      'base' => $links.'/page/%#%',
      'format' => '/page/%#%',
      'prev_text' => '上一页',
      'next_text' => '下一页',
      'total' => $ashuwp_query->max_num_pages,
      'current' => $pagenum
    ) );
    if ( $pagination ) {
        echo $pagination;
    }
    ?>
    </div>
    </div>
    </div> <!--site-page-->
    <div id="footer">
    <div class="container">
    <p>网站底部 </p>
    </div>
    </div>
    </body>
    </html>
  6. 这样,wordpress 网站多条件筛选功能就制作好了。

示例下载

下载的文件为一个极简单的主题,效果预览步骤:

1.下面提供了拥有这种功能的简单的WORDPRESS 主题,下载主题并安装,并设置好伪静态

2.添加几篇文章到自定义分类法中

3.直接访问筛选页面的url,比如:URL/sift 或者URL/sift/0_1_1_0等等。

主题下载:https://pan.baidu.com/s/1a8_XxNy7B3HUA1ji84g_dA

www.ysidc.top 西数超哥博客,IT技术,idc资讯,基础运维,原创教程,web环境部署,WordPress教程,技术分享,LAMP,LNMP,wdcp,mysql,mssql,centos,discuz教程

赞(0) 打赏
声明:本站发布的内容(图片、视频和文字)以原创、转载和分享网络内容为主,若涉及侵权请及时告知,将会在第一时间删除。本站原创内容未经允许不得转载:西数超哥学习乐园 » wordpress 网站多条件筛选功能制作(纯代码)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏