在前面的建站教程中，我們講了如何制作Wordpress搜索功能，可以實現單一內容的搜索。但在實際網站建設過程中，往往需要多重篩選、多條件搜索功能。如下圖所示：

這就是一種多重篩選、多條件搜索功能，需要同時滿足三個條件，才會顯示出內容。如果使用WordPress制作出這樣的多重篩選、多條件搜索功能呢？下面跟著學做網站論壇一起來制作這個功能吧！

方法/步驟

1. 使用Dreamweaver cs6軟件，新建一個HTML網頁，保存為searchform.php，然后，將以下的代碼放到searchform.php里并保存到模板文件夾；

   
   <form method="get" id="searchform" action="<?php bloginfo('home'); ?>">
   
   
   
   <div style=""><input name="username" type="text" placeholder="姓名"/></div>
   
   <div style=""><input name="s" id="s" type="text" placeholder="證件號碼"/></div>
   
   <div style=""><input name="bianhao" type="text" placeholder="證書編號"/></div>
   
   
   
   <div><input id="searchsubmit" type="submit" value="查詢" class="but" /></div>
   
   </form>
   
   

2. 復制Wordpress模板里的分類目錄模板代碼，另存為search.php。放到自己的模板文件夾里。
3. 將search.php模板代碼里的循環(huán)代碼全部刪除，替換為以下的條件搜索循環(huán)代碼；

   
   <?php
   
   $haoma=$_GET['s'];//證件號碼
   
   $username = $_GET['username']; //姓名
   
   $bianhao = $_GET['bianhao']; //證書編號
   
   $mood1 = get_post_meta($post->ID, 'username', true);
   
   $mood2 = get_post_meta($post->ID,"bianhao",true);
   
   
   
   /*
   
   echo $username . "<br/>";
   
   echo $bianhao . "<br/>";
   
   echo $mood1 . "<br/>";
   
   echo $mood2 . "<br/>";
   
   */
   
   
   
   if( $username==$mood1 && $bianhao==$mood2) { ?>
   
   
   
   ?<div class="zhenshu">
   
   
   
   ?<table width="100%">
   
   ? <tr>
   
   ?   <td width="13%">姓名：</td>
   
   ?   <td width="87%"><?php echo get_post_meta($post->ID, 'username', true);?></td>
   
   ? </tr>
   
   ? <tr>
   
   ?   <td>證件號碼：</td>
   
   ?   <td><?php the_title(); ?></td>
   
   ? </tr>
   
   ? <tr>
   
   ?   <td>證書編號：</td>
   
   ?   <td><?php echo get_post_meta($post->ID,"bianhao",true);?></td>
   
   ? </tr>
   
   ? <tr>
   
   ?   <td colspan="2" class="tplr"><img src="<?php echo get_first_image(); ?>" alt="<?php the_title(); ?>縮略圖" /></td>   
   
   ? </tr>
   
   
   
   </table> 
   
   ?</div> 
   
   <?php 
   
   } else { 
   
   echo '請?zhí)顚懻�確的信息后，再查詢！';
   
   }
   
   ?>
   
   

4. 將以下的CSS樣式代碼，粘貼到style.css中，用于控制搜索結果的樣式；

   
   .zhenshu table {
   
   ?           margin: 0 auto;
   
   ?           width: 100%;
   
   ?           border:1px solid #999;
   
   ?           border-collapse: collapse;
   
   ?       }
   
   .zhenshu th,.zhenshu td {
   
   ?          padding:15px;
   
   ?           border: 1px solid #999;
   
   ?       }
   
   .tplr{text-align:center;}
   
   

5. 在網站后臺發(fā)文章里，創(chuàng)建自定義欄目。（如果沒有，可以參考：wordpress自定義欄目設置方法）
6. 文章底部設置二個自定義欄目項，名稱分稱是【username】和【bianhao】，并填寫相應的值。如下圖：
   
7. 文章標題填寫【證件號碼】，內容只需要上傳證書圖片即可。
8. 在需要顯示搜索框的位置，使用以下的代碼進行調用：

   
   <?php include( TEMPLATEPATH . '/searchform.php' ); ?>
   
   

9. 這樣我們自己建網站時，就可以實現多重篩選、多條件搜索功能了。

標簽： 代碼 建網站 建站 建站教程 搜索 網站建設

版權申明：本站文章部分自網絡，如有侵權，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權歸原作者所有，如需使用，請與原作者聯(lián)系。