学做网站培训课程介绍

当前位置：

wordpress 网站多条件筛选功能制作（纯代码）

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

网站多条件筛选功能

自己做网站时，如何制作这样的多条件筛选功能呢？下面学做网站论坛就来介绍一下这种多条件筛选功能制作方法。（如果觉得代码太麻烦，可以直接安装WordPress中文多条件多重搜索筛选插件senior-choose来实现本功能）

方法/步骤

  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. 添加完以上代码后，应该在后台左侧菜单会多出四个自定义分类法：wordpress 网站多条件筛选功能制作（纯代码）
  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.net/ 将获取到的参数组合为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

《“wordpress 网站多条件筛选功能制作（纯代码）”》 有 3 条评论

  1. 学习建网站学员 双说道：
    2019年2月23日 上午10:02

    我的网址/sift/0_31_0_0 打开是404，是因为什么？望指教

    回复
  2. 学习建网站学员 小白说道：
    2020年11月6日 下午9:58

    这个代码有测试成功的吗？一直报错

    回复
    • 学做网站论坛讲师 学做网站讲师说道：
      2020年11月7日 下午7:31

      多条件筛选功能，请参考这个教程：https://www.xuewangzhan.com/wenti/28730.html

      回复

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 漂亮的wordpress淘客模板 图文教程 (111446 次浏览)
    今天再次给大家分享一款自己仿的一个wordpress淘客模板。这个模板是我自己在别人模板的基础上进行二次开发，自己比较喜欢。注意：此模板不支持IE6,
  • 用什么建网站？Wordpress建网站好不好 (110909 次浏览)
    用什么建网站？Wordpress建网站好不好？这些问题经常被新手问上问起。可以这样说，wordpress程序可以建各种类型的网站，它的功能强大之处令人称赞，
  • 自己做网站需要什么条件 (112476 次浏览)
    问：大家好！我对建设网站一窍不通；特别近想自己建设网站，请问一下需要哪些条件？听说要什么郁闷还要空间，请问这两者之间是什么关系？我要怎么
  • 网站制作三要素是哪三个必要条件 (17575 次浏览)
    在建站课程中我们经常讲网站制作三要素，那你知道网站制作三要素到底是包括哪三个要素吗？
  • wordpress 网站多条件筛选功能制作（纯代码） 图文教程附件下载 (116836 次浏览)
    我们经常在网上看到一些网站，拥有多重筛选功能。例如一些房产网站上，就会经常使用多条件筛选功能，方便用户进行筛选房源。效果如下图：自己
  • Wordpress如何做网站的多重筛选、多条件搜索功能 图文教程 (122147 次浏览)
    在前面的建站教程中，我们讲了如何制作Wordpress搜索功能，可以实现单一内容的搜索。但在实际网站建设过程中，往往需要多重筛选、多条件搜索功能。如
  • Wordpress 评论功能如何开启和关闭 视频教程 (1154511 次浏览)
    wordpress评论功能可以让用户在我们自己的网站上进行对文章的评论，发表自己的观点，很好的增强了网站与用户之间的交互性。还有的网站还添加了邮件功
  • Wordpress前台游客投稿功能制作方法（纯代码） 图文教程 (114729 次浏览)
    纯代码Wordpress前台投稿功能制作方法，很多建网站学员学习了Wordpress教程后，使用Wordpress 程序建了网站。但如果每天都是自己更新文章，感觉会有点
  • 纯代码实现Wordpress长文章分页 图文教程 (121839 次浏览)
    请注意，这里说的文章分页，不是学做网站论坛以前说的wordpress分页插件进行网站分类目录分页，而是一篇文章如果文字过多，会造成网页篇幅过长，影响

建站培训课程

最新教程

其它教程