【温馨提示:视频教程将在6月份开始更新,可提前购买,1-10元一节课,联系QQ248758228】
前言:
要实现自定义字段组合搜索的第一步是要有自定义字段,本文忽略这一步。我们是有字段的,如果你不是很懂,请查询相关资料或者直接联系我。
我们做出来的效果如下图,不要吐槽美工。
第一步:定义了5个自定义文章类型,用户发布不同的内容。
第二步:为你的每一个自定义类型的文章添加自定义字段,添加后如下图:
考虑到多个自定义文章类型的字段不一样,但是只做一个搜索表单页面。我们把自定义字段的meta_key 设置为规则自增,ws1\ws2—-ws15这样的格式方便后期的处理。
做了如上图设置后,我们新建一个页面模板 form.php
/* Template Name: form */ //用于判断当前文章为什么类型的,自动获取当前文章下面的自定义字段 $type = $_GET['type']; if(!isset($type)){ $type = 'character'; } $argss = array( 'post_type'=> $type, 'posts_per_page'=>1, ); $query = new WP_Query( $argss ); while ($query->have_posts() ) :$query->the_post(); $wid = get_the_ID(); //var_dump($wid); endwhile;wp_reset_query();
首先我要判断当前页面搜索的文章类型是什么,我们在不同的类型URL中加入了 TYPE属性,以方便识别:
<a href="/so/?type=character" <?php if($type == 'character'){echo 'class="active"';}?>>人物</a> <a href="/so/?type=event" <?php if($type == 'event'){echo 'class="active"';}?>>事件</a> <a href="/so/?type=age" <?php if($type == 'age'){echo 'class="active"';}?>>年份</a> <a href="/so/?type=place" <?php if($type == 'place'){echo 'class="active"';}?>>地点</a> <a href="/so/?type=book" <?php if($type == 'book'){echo 'class="active"';}?>>书籍</a>
有了自定义文章的类型后,我们读取该类型的第一篇文章,获取此篇文章的ID。
然后通过ID读取他的自定义字段的名称,同时输出为表单。
<form class="layui-form " action="" method="GET"> <div class="layui-form-item"> <label class="layui-form-label">所属分类</label> <div class="layui-input-block"> <select name="cate" class="layui-input" > <option value="all" class="layui-input" >所有分类</option> <?php $cate = $type.'_list'; $args = array( 'echo' => 0, // (布尔值)是否显示出来,控制直接显示列表,还是保存在某个变量中 'taxonomy' => $cate, //(字符串)显示某个自定义分类法下面的分类项目 'hide_empty' =>'0', ); $category =get_categories($args); foreach($category as $v){ ?> <option value="<?php echo $v->slug;?>" class="layui-input" ><?php echo $v->name;?></option> <?php } ?> </select> </div> </div> <input type="hidden" name="type" value="<?php echo $type;?>"/> <?php for($i=1;$i<15;$i++){ $ws = 'ws'.$i; $name = get_field_object($ws,$wid); if(!empty($name['label'])){ $ok = 1; ?> <div class="layui-form-item"> <label class="layui-form-label"><?php echo $name['label'];?></label> <div class="layui-input-block"> <input type="text" name="ws<?php echo $i;?>" class="layui-input" value=""> </div> </div> <?php }} ?> <?php if($ok == 1){?> <div class="clear"></div> <div class="layui-form-item"> <div class="ws"> <button class="layui-btn" lay-submit lay-filter="formDemo">马上搜索</button> </div> </div> <?php }?> </form>
其中核心代码是:
<?php for($i=1;$i<15;$i++){ $ws = 'ws'.$i; $name = get_field_object($ws,$wid); if(!empty($name['label'])){ $ok = 1; ?> <div class="layui-form-item"> <label class="layui-form-label"><?php echo $name['label'];?></label> <div class="layui-input-block"> <input type="text" name="ws<?php echo $i;?>" class="layui-input" value=""> </div> </div> <?php }} ?> <?php if($ok == 1){?> <div class="clear"></div> <div class="layui-form-item"> <div class="ws"> <button class="layui-btn" lay-submit lay-filter="formDemo">马上搜索</button> </div> </div> <?php }?>
通过上面的代码,我们可以正常的输出我们需要的表单,也就是你后台添加的自定义字段的名称,这里设置 了最大为14个。当然你要100个也是可以的。
通过以上的代码我们可以实现自动生成一个包含自定义字段的搜索框。如本文第一张图片所示。
下一步是数据提交了。如何来处理搜索,正确的显示搜索结果呢。继续往下走;
先上代码:
<?php if($_GET || get_query_var('paged') > 1 ) { //var_dump($_GET); $meta = array(); foreach ($_GET as $k => $v) { if (!empty($v) && $k != 'cate' && $k != 'type') { $a = array( 'key' => $k, 'value' => $v, 'compare' => 'LIKE', ); array_push($meta, $a); } } //var_dump($meta); if ($_GET['cate'] != 'all') { $ws_cate = array( 'taxonomy' => $cate, //(字符串) - 自定义分类法 'field' => 'slug', //(字符串) - 使用别名还是分类作为查询条件 ('id' 或 'slug') 'terms' => $_GET['cate'], //(整数/字符串/数组) - 自定义分类法分类条目 ); } else { $ws_cate = null; } $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $args = array( 'paged' => $paged, 'meta_compare' => 'or', 'meta_query' => $meta, 'post_type' => $type, 'tax_query' => array($ws_cate) ); //var_dump($args); $wp_query = new WP_Query($args); if ($wp_query->have_posts()){ while ($wp_query->have_posts()) : $wp_query->the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php if (cmp_get_option('pl little_thumb_right')) post_class('pl little-thumb thumb-right group'); else post_class('little-thumb group'); ?> > <div class="post-inner post-hover"> <p class="post-author"><a href="<?php echo get_author_posts_url(get_the_author_meta('ID')) ?>" title="<?php printf(esc_attr__('View all posts by %s', 'cmp'), get_the_author()) ?>" <?php echo cmp_target_blank(); ?>><?php echo get_avatar(get_the_author_meta('user_email'), 28) ?></a> </p> <h2 class="post-title"> <?php if (is_sticky()) echo '<i class="fa fa-thumb-tack" title="' . __('Sticky Post', 'cmp') . '"></i>'; ?> <a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title_attribute(); ?>" <?php echo cmp_target_blank(); ?>><?php the_title(); ?></a> </h2><!--/.post-title--> <div class="ws-inner"> <?php for ($i = 1; $i < 15; $i++) { $ws = 'ws' . $i; $name = get_field_object($ws, get_the_ID()); if (!empty($name['label'])) { ?> <li><span><?php echo $name['label']; ?>:</span><?php echo get_field($ws); ?></li> <?php } } ?> </div> <div class="clear"></div> <?php if (function_exists('cmp_post_thumbnail')): ?> <div class="post-thumbnail"> <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" <?php echo cmp_target_blank(); ?>> <?php cmp_post_thumbnail(230, 140); ?> </a> <?php if (function_exists('getPostLikeLink')): ?> <span class="post-like"><?php echo getPostLikeLink($post->ID); ?></span> <?php endif; ?> </div><!--/.post-thumbnail--> <?php endif; ?> <div class="post-info"> <div class="entry excerpt"> <?php if (function_exists('cmp_excerpt')) cmp_excerpt(); ?> </div><!--/.entry--> </div> <div class="clear"></div> <?php if (function_exists('archive_meta')) archive_meta(); ?> </div><!--/.post-inner--> </article><!--/.post--> <?php endwhile; if ($wp_query->max_num_pages > 1) { cmp_pagenavi(); } wp_reset_query(); }else{ ?> 没有搜索到相关文章 <?php } } ?>
代码中首先是判断是否提交了表单。这个很菜的,一看就知道。
下一步,拼接用户输入的自定义字段。
$meta = array(); foreach ($_GET as $k => $v) { if (!empty($v) && $k != 'cate' && $k != 'type') { $a = array( 'key' => $k, 'value' => $v, 'compare' => 'LIKE', ); array_push($meta, $a); } }
我们通过遍历的把,cate\type 这两个排出以后,其他的所有自定义字段,追加到一个数组,其实这里可以先过滤为空的,我们就不做这一步了。把所有的指定自定义字段拼接好了以后,作为查询参数传给需要的地方。
if ($_GET['cate'] != 'all') { //这里就是判断下到底是所有分类还是自定义分类法下面的某个分类 $ws_cate = array( 'taxonomy' => $cate, //(字符串) - 自定义分类法 'field' => 'slug', //(字符串) - 使用别名还是分类作为查询条件 ('id' 或 'slug') 'terms' => $_GET['cate'], //(整数/字符串/数组) - 自定义分类法分类条目 ); } else { $ws_cate = null; } $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $args = array( 'paged' => $paged, 'meta_compare' => 'or', 'meta_query' => $meta, 'post_type' => $type, 'tax_query' => array($ws_cate) ); //var_dump($args); $wp_query = new WP_Query($args);
因为客户要求分类也要进行筛选,所以需要给查询参数增加一个自定义分类法。
if ($_GET['cate'] != 'all') { $ws_cate = array( 'taxonomy' => $cate, //(字符串) - 自定义分类法 'field' => 'slug', //(字符串) - 使用别名还是分类作为查询条件 ('id' 或 'slug') 'terms' => $_GET['cate'], //(整数/字符串/数组) - 自定义分类法分类条目 ); } else { $ws_cate = null; }
如果CATE等于ALL,就是所有分类,那么就不用给查询函数提交参数了。否则提交一个参数给你查询函数。
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $args = array( 'paged' => $paged, 'meta_compare' => 'or', 'meta_query' => $meta, 'post_type' => $type, 'tax_query' => array($ws_cate) );
最终我们得到了以上包含所有查询条件的参数组。通过这个参数值就可以查询到我们想要的文章。
好了,就到这里了。我自己都怕将来看不懂这个文章。
0个问题