สุดยอดคู่มือการโพสต์ WordPress และการกรองหน้า

เผยแพร่แล้ว: 2017-07-13

หากคุณเคยซื้อของบน Amazon เป็นไปได้ว่าคุณพอใจกับพลังของตัวกรองที่เจาะลึกลงไปในเนื้อหาจำนวนมากและค้นหาสิ่งที่คุณต้องการอย่างแท้จริง เมื่อค้นหาผลิตภัณฑ์ใน Amazon จะมีแถบด้านข้างที่เต็มไปด้วยตัวกรองที่ช่วยคุณปรับแต่งการค้นหา โดยแสดงเฉพาะผลลัพธ์ที่ตรงกับความต้องการที่สำคัญที่สุดของคุณ ตัวกรองต่างๆ เช่น การให้คะแนนของลูกค้า แบรนด์ ไม่ว่าจะเป็นสินค้าสำหรับผู้ชายหรือผู้หญิง สภาพ (ใหม่/มือสอง) และอื่นๆ อีกมากมาย

เมื่อพิจารณาว่าตัวกรองเนื้อหามีประโยชน์เพียงใด จึงไม่น่าแปลกใจเลยที่ความสามารถในการสร้างตัวกรองสำหรับเนื้อหา WordPress ของคุณจะถูกสร้างขึ้นใน WordPress Core และด้วยความรู้เพียงเล็กน้อย คุณสามารถนำพลังนั้นมาสู่ผู้เยี่ยมชมไซต์ของคุณ ช่วยให้พวกเขาสำรวจเนื้อหาของคุณได้อย่างคล่องแคล่วกว่าที่เคย

ในบทความนี้ เราจะแนะนำคุณตลอดขั้นตอนการสร้างตัวเลือกการกรองเนื้อหาสำหรับผู้ใช้ของคุณด้วยปลั๊กอิน

มาเริ่มกันเลย!

ทำไม WordPress Post และ Page Filtering?

WordPress มีความยืดหยุ่นอย่างเหลือเชื่อ แกนหลักช่วยให้คุณควบคุมทุกอย่างบนไซต์ของคุณได้อย่างสมบูรณ์ การกรองโพสต์และหน้าเป็นหนึ่งในคุณสมบัติที่ทรงพลังที่สุดของ WordPress มีฟังก์ชันในตัวหลายอย่างสำหรับโพสต์ เพจ และเนื้อหาที่กำหนดเอง นอกจากนี้ยังมีหลายวิธีในการเลือก จัดกลุ่ม และกรองรายการที่จัดเก็บไว้ในฐานข้อมูล คุณสามารถสร้างรายการผลการค้นหาที่จัดเรียงได้ตามเทมเพลตของเพจ ประเภทโพสต์ เงื่อนไขการจัดหมวดหมู่ ลำดับชั้นของเทมเพลต หน้าผลิตภัณฑ์ หรืออะไรก็ได้ที่คุณต้องการ

ตามค่าเริ่มต้น WordPress มาพร้อมกับฟังก์ชันการค้นหาในตัว อย่างไรก็ตาม ฟังก์ชันการค้นหานั้นเป็นที่ต้องการอย่างมาก และไม่ได้ช่วยอะไรเมื่อผู้อ่านของคุณต้องการกรองผลลัพธ์ด้วยวิธีใดวิธีหนึ่ง นั่นคือสิ่งที่ความช่วยเหลือของปลั๊กอินของบุคคลที่สามเข้ามาเล่น

ปลั๊กอินการค้นหาและตัวกรองทำอะไรได้บ้าง

ปลั๊กอินการค้นหาและตัวกรองเป็นปลั๊กอินที่ใช้งานง่ายซึ่งนำช่องค้นหา WordPress เริ่มต้นไปสู่ระดับถัดไป ช่วยให้ผู้เยี่ยมชมของคุณค้นหาคำเฉพาะและกรองผลลัพธ์ตามหมวดหมู่ แท็ก ประเภทโพสต์ที่กำหนดเอง การจัดหมวดหมู่แบบกำหนดเอง ช่วงวันที่ หรือแม้แต่การผสมผสานของคำเหล่านั้นทั้งหมดเพื่อการค้นหาที่ละเอียดยิ่งขึ้นและผลลัพธ์ที่แม่นยำยิ่งขึ้น

การใช้ปลั๊กอินนั้นง่ายมาก หลังจากที่คุณติดตั้งและเปิดใช้งานปลั๊กอิน คุณจะเข้าสู่หน้าการตั้งค่าพร้อมคำอธิบายโดยละเอียดเกี่ยวกับวิธีการใช้งาน สรุป คุณสามารถใช้รหัสสั้นได้ทุกที่ในโพสต์ หน้า หรือแถบด้านข้างที่มีวิดเจ็ต อีกทางหนึ่ง หากคุณรู้สึกกล้าหาญและไม่รังเกียจที่จะทำให้มือสกปรกด้วยโค้ดเล็กๆ น้อยๆ คุณสามารถวางโค้ดบรรทัดเดียวในไฟล์ธีมของคุณได้

ลองมาดูตัวอย่างกัน

วิธีกรองโพสต์ด้วยการค้นหา & ตัวกรอง

การใช้งานปลั๊กอินขั้นพื้นฐานที่สุดคือรหัสย่อที่ช่วยให้ผู้เข้าชมสามารถค้นหาหมวดหมู่และแท็กทั้งหมดของคุณได้ รหัสย่อเริ่มต้นมีลักษณะดังนี้:

[searchandfilter fields="search,category,post_tag"] 

คุณสามารถแทรกลงในโพสต์ หน้า หรือวิดเจ็ตข้อความ และจะแสดงตัวเลือกการกรองด้วยฟิลด์การค้นหา หมวดหมู่ และแท็กที่ส่วนหน้า:

หากคุณต้องการให้ผู้เยี่ยมชมเลือกมากกว่าหนึ่งหมวดหมู่หรือหนึ่งแท็ก คุณสามารถทำได้โดยแก้ไขรหัสย่อเพื่อรวมช่องทำเครื่องหมายแทนดรอปดาวน์และติดป้ายกำกับแต่ละฟิลด์:

[searchandfilter headings="Select categories:" types="checkbox" fields="category"]

ตัวอย่างด้านบนแสดงวิธีใช้ปลั๊กอินในแถบด้านข้าง อย่างไรก็ตาม คุณสามารถใช้มันในไฟล์ธีมของคุณเพื่อแสดงมันบนหน้าใดก็ได้ ในตัวอย่างด้านล่าง แบบฟอร์มจะแสดงบนหน้าบล็อก สิ่งที่คุณต้องทำคือวางโค้ดบรรทัดต่อไปนี้:

<?php echo do_shortcode('[searchandfilter fields="search,category,post_tag"]'); ?>

ในกรณีของเรา เราได้เพิ่มลงในเทมเพลตดัชนีหลักของธีม Twenty Seventeen

จะกรองอนุกรมวิธานที่กำหนดเองได้อย่างไร

ตัวอย่างข้างต้นแสดงการใช้งานปลั๊กอินขั้นพื้นฐาน แต่ปลั๊กอินการค้นหาและตัวกรองก็ยอมรับพารามิเตอร์อื่นๆ ด้วย คุณสามารถใช้รหัสย่อที่ช่วยให้ผู้เยี่ยมชมของคุณกรองผลการค้นหาเฉพาะการจัดหมวดหมู่แบบกำหนดเองได้

สมมติว่าคุณมีร้านค้าบนไซต์ของคุณด้วย WooCommerce หากคุณต้องการรวมหมวดหมู่สินค้าในผลการค้นหา สิ่งที่คุณต้องทำคือเพิ่มรหัสย่อต่อไปนี้:

[searchandfilter taxonomies="search,category,post_tag,product_cat" headings=",Categories,Tags,Product Categories"]

ในตัวอย่างนี้ ฉันได้เพิ่มส่วนหัวก่อนแต่ละฟิลด์ด้วย เพื่อให้ผู้เข้าชมแยกความแตกต่างระหว่างฟิลด์ได้ง่ายขึ้น:

หากคุณต้องการแสดงสิ่งนี้บนเพจในธีมของคุณ สิ่งที่คุณต้องทำคือวางโค้ดบรรทัดต่อไปนี้ในเทมเพลตเพจที่เหมาะสมภายใต้ Appearance > Themes > Editor :

<?php echo do_shortcode('[searchandfilter taxonomies="search,category,post_tag,product_cat" headings=",Categories,Tags,Product Categories"]'); ?>

วิธีการกรองโพสต์ตามช่วงวันที่?

การใช้งานอีกกรณีหนึ่งคือ ถ้าคุณต้องการให้ผู้เยี่ยมชมของคุณค้นหาโพสต์ในหมวดหมู่เฉพาะภายในช่วงวันที่ที่กำหนด ในกรณีนั้น ให้วางโค้ดบรรทัดต่อไปนี้ใน archive.php ของคุณ:

<?php echo do_shortcode('[searchandfilter fields="search,post_date" types=",daterange" headings=",Post Date"]'); ?>

วิธีการกรองรูปแบบโพสต์และหน้า?

ในตัวอย่างสุดท้าย มาดูการกรองรูปแบบโพสต์และหน้ากัน หากคุณเผยแพร่โพสต์วิดีโอหรือเสียง รหัสย่อนี้จะช่วยให้ผู้เยี่ยมชมสามารถค้นหาโพสต์ที่เป็นของรูปแบบโพสต์ที่คุณระบุเท่านั้น:

[searchandfilter fields="search,post_format" types=",select" headings=",Post Format" submit_label="Filter"]

หากคุณต้องการให้ผู้เยี่ยมชมกรองหน้าหรือโพสต์ สิ่งที่คุณต้องมีคือรหัสย่อที่ยอมรับประเภทโพสต์เป็นพารามิเตอร์:

[searchandfilter fields="search,post_types" post_types="post,page" headings=",Post Types"]

นอกเหนือจากตัวอย่างข้างต้นแล้ว ปลั๊กอินยังช่วยให้คุณเจาะจงยิ่งขึ้นโดยการรวมพารามิเตอร์สำหรับการเรียงลำดับผลลัพธ์ตามลำดับชั้น เพื่อแสดงจำนวนโพสต์ในหมวดหมู่ที่ระบุ เพิ่มคลาส ผู้เขียนตัวกรอง และอื่นๆ อีกมากมาย

วิธีการกรองโพสต์ด้วยตนเอง

เช่นเดียวกับสิ่งที่เกี่ยวข้องกับ WordPress มีวิธีทำโดยไม่ต้องใช้ปลั๊กอิน สมมติว่าคุณต้องการสร้างแบบฟอร์มง่ายๆ ที่ช่วยให้ผู้เยี่ยมชมกรองโพสต์จากบางหมวดหมู่ได้
ขั้นแรก คุณต้องสร้างแบบฟอร์มอย่างง่าย:

<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
    <?php
        if( $terms = get_terms( 'category', 'orderby=name' ) ) : 
            echo '<select name="categoryfilter"><option>Select category...</option>';
            foreach ( $terms as $term ) :
                echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; 
            endforeach;
            echo '</select>';
        endif;
    ?>
    <label>
        <input type="radio" name="date" value="ASC" /> Date: Ascending
    </label>
    <label>
        <input type="radio" name="date" value="DESC" selected="selected" /> Date: Descending
    </label>
    <button>Apply filters</button>
    <input type="hidden" name="action" value="customfilter">
</form>
<div id="response"></div>

ในแบบฟอร์มด้านบน ส่วนแรกให้ผู้ใช้เลือกอนุกรมวิธานได้ง่ายๆ โดยใช้ฟังก์ชัน get_terms คุณสามารถใช้สิ่งนี้สำหรับหมวดหมู่และแท็กเริ่มต้นรวมถึงการจัดหมวดหมู่แบบกำหนดเอง ส่วนถัดไปจะเพิ่มปุ่มตัวเลือกที่ช่วยให้ผู้เข้าชมสามารถแสดงผลตามลำดับจากน้อยไปมากหรือจากมากไปน้อย สุดท้าย ส่วนสุดท้ายคือปุ่มสำหรับแบบฟอร์มที่อนุญาตให้ใช้ตัวกรองที่เลือก

เพิ่มแบบฟอร์มทั้งหมดลงในเทมเพลต sidebar.php ใน Appearance > Themes > Editor

ขั้นตอนต่อไปคือการใช้ jQuery เพื่อให้สามารถแสดงผลได้โดยไม่ต้องโหลดหน้าซ้ำ:

jQuery(function($){
    $('#filter').submit(function(){
        var filter = $('#filter');
        $.ajax({
            url:filter.attr('action'),
            data:filter.serialize(), // form data
            type:filter.attr('method'), // POST
            beforeSend:function(xhr){
                filter.find('button').text('Applying Filters...');          },
            success:function(data){
                filter.find('button').text('Apply filters');                $('#response').html(data); 
            }
        });
        return false;
    });
});

โค้ดบิตสุดท้ายคือการเพิ่มฟังก์ชันลงในไฟล์ function.php ซึ่งจะประมวลผลผลลัพธ์ตามตัวกรองที่เลือก มันจะดูผ่านหมวดหมู่ที่เลือกและตราบใดที่มีโพสต์ก็จะแสดงตามวันที่โพสต์ในลำดับจากน้อยไปมากหรือจากมากไปน้อย หากไม่พบโพสต์ในหมวดหมู่ จะแสดงข้อความว่าไม่พบโพสต์:

 
function my_filters(){
    $args = array(
        'orderby' => 'date', 
        'order' => $_POST['date'] 
    );
 
        if( isset( $_POST['categoryfilter'] ) )
        $args['tax_query'] = array(
            array(
                'taxonomy' => 'category',
                'field' => 'id',
                'terms' => $_POST['categoryfilter']
            )
        );
  
    $query = new WP_Query( $args );
 
    if( $query->have_posts() ) :
        while( $query->have_posts() ): $query->the_post();
            echo '<h2>' . $query->post->post_title . '</h2>';
        endwhile;
        wp_reset_postdata();
    else :
        echo 'No posts found';
    endif;
 
    die();
}
 
 
add_action('wp_ajax_customfilter', 'my_filters'); 
add_action('wp_ajax_nopriv_customfilter', 'my_filters');

ผลลัพธ์สุดท้ายจะแสดงในลักษณะนี้ที่ส่วนหน้า:

ทำไมคุณควรให้ผู้อ่านกรองโพสต์และเพจใน WordPress

วิธีการข้างต้นเป็นวิธีที่ดีในการให้ผู้ใช้กรองโพสต์ของคุณ แต่ทำไมคุณถึงต้องการทำเช่นนั้น?

WordPress อนุญาตให้คุณจัดระเบียบบทความของคุณด้วยหมวดหมู่และแท็ก แต่อนุญาตให้ผู้ใช้ดูหมวดหมู่หรือแท็กเดียวเท่านั้นในแต่ละครั้ง นอกจากนี้ หากคุณใช้ประเภทโพสต์แบบกำหนดเองที่ใช้หมวดหมู่ของตนเอง หมวดหมู่เหล่านั้นจะไม่ปรากฏพร้อมกับประเภทที่ใช้สำหรับโพสต์ปกติ

ปลั๊กอินการค้นหาและตัวกรองมีประโยชน์อย่างยิ่งไม่เฉพาะเมื่อคุณมีหมวดหมู่และแท็กต่างๆ มากมายที่จับคู่กับเนื้อหาประจำปีเท่านั้น แต่ยังมีประโยชน์อีกด้วยหากคุณเพิ่มประเภทโพสต์ที่กำหนดเอง เช่น พอร์ตโฟลิโอ แกลเลอรี ข้อความรับรอง และอื่นๆ

อีกตัวอย่างหนึ่งคือผู้เยี่ยมชมของคุณสามารถใช้ปลั๊กอินนี้เพื่อกรองผลิตภัณฑ์ของคุณและค้นหาสิ่งที่พวกเขากำลังมองหาได้อย่างง่ายดาย และหากคุณคุ้นเคยกับโค้ด การทำด้วยตนเองจะช่วยให้คุณสามารถควบคุมวิธีแสดงผลการค้นหาและพารามิเตอร์ที่ใช้ได้มากขึ้น

ห่อ

การทำให้แน่ใจว่าเว็บไซต์ของคุณใช้งานง่ายโดยอนุญาตให้ผู้เยี่ยมชมค้นหาเนื้อหาที่คุณต้องการได้อย่างรวดเร็ว เป็นวิธีที่ยอดเยี่ยมในการมอบประสบการณ์การใช้งานที่น่าพึงพอใจแก่พวกเขาและกระตุ้นให้พวกเขากลับมา หากไซต์ของคุณเต็มไปด้วยเนื้อหา ให้พิจารณาใช้การกรองหน้าและโพสต์เพื่อให้แน่ใจว่าได้รับเนื้อหาที่ต้องการดูเพิ่มเติม

เรายินดีรับฟังประสบการณ์ของคุณเกี่ยวกับการค้นหาและกรอง WordPress แจ้งให้เราทราบในความคิดเห็นด้านล่าง

ภาพขนาดย่อของบทความโดย graphicglobe / shutterstock.com