วิธีเพิ่มการแบ่งหน้า WordPress
เผยแพร่แล้ว: 2020-10-24หนึ่งในผู้อ่านของเราถามเราเมื่อเร็ว ๆ นี้ว่าจะเพิ่มการแบ่งหน้า WordPress ได้อย่างไร
การแทรกบทความเก่าและลิงก์บทความใหม่ที่ด้านล่างของหน้าเก็บถาวรของ WordPress จะแสดงลิงก์การแบ่งหน้า อย่างไรก็ตาม หน้า WordPress หลายหน้าใช้เลขหน้า ประสบการณ์ของเราแสดงให้เห็นว่าการแบ่งหน้าเป็นตัวเลขนั้นใช้งานง่าย น่าดึงดูดยิ่งขึ้น ง่าย และเป็นมิตรกับ SEO
ในบทความนี้ เราจะสอนวิธีการที่ง่ายที่สุดในการเปิดใช้การแบ่งหน้าของ WordPress และการใส่เลขหน้าอย่างแม่นยำ
การแบ่งหน้าคืออะไร?
การแบ่งหน้าเป็นคุณลักษณะทั่วไปของบล็อกต่างๆ ใน WordPress มันสำคัญมากเพราะเป็นคุณสมบัติที่สำคัญในศูนย์ WordPress สำหรับเจ้าของเว็บไซต์จำนวนมาก .. การแบ่งหน้าเป็นวิธีปฏิบัติที่เรียบง่ายและเป็นมาตรฐานซึ่งจะหยุดคุณไม่ให้โหลดรายการทั้งหมดของคุณพร้อมกัน หลายหัวข้อยังได้รับการพัฒนาเป็นการแบ่งหน้า
อย่างไรก็ตาม หากไม่เป็นเช่นนั้น คุณสามารถกำหนดค่าการแบ่งหน้าได้อย่างสะดวกด้วยโค้ดสองสามบรรทัดบนเว็บไซต์ของคุณ ในบทความนี้ เราจะสำรวจวิธีการต่างๆ สองสามวิธีในการจัดการการแบ่งหน้าบนไซต์ของคุณ
วิธีเพิ่มการแบ่งหน้า WordPress ด้วยตนเอง?
คุณสามารถใช้ฟังก์ชัน WordPress ในตัวและโค้ดสองสามบรรทัดได้ หากคุณสร้างธีมของคุณเองหรือต้องการเพิ่มการแบ่งหน้าให้กับธีมของคุณ ในความเป็นจริง มีวิธีแทรกสองวิธีที่แตกต่างกัน
โดยแนบ “โพสต์ก่อนหน้า” และ “โพสต์ถัดไป” หรือ ( << ก่อนหน้า 1 … 3 4 5 6 7 … 9 ถัดไป >> ) ที่ด้านล่างของหน้า
วิธีที่ 1: การแนบลิงก์ก่อนหน้าและถัดไป
หากต้องการเพิ่มการรองรับการแบ่งหน้าให้กับธีมของคุณ โค้ดส่วนใหญ่ควรรวมอยู่ในไฟล์ functions.php ของธีมหรือหัวเรื่องสำหรับเด็ก ฉันอยากจะแนะนำการสร้างปัญหาสำหรับเด็กด้วยคุณลักษณะแบบกำหนดเองเมื่อใช้ธีมพรีเมียม
สำหรับการเพิ่มการแบ่งหน้าให้กับธีม WordPress เราจำเป็นต้องสร้างคุณลักษณะที่ให้ลิงก์ก่อนและหลังที่ด้านล่างของรายการ

ดังที่กล่าวไปแล้ว เราต้องตรวจสอบให้แน่ใจด้วยว่าการเชื่อมต่อบางอย่างจะแสดงเฉพาะเมื่อมีการเชื่อมต่อกับโพสต์โดยเฉพาะเท่านั้น ขั้นตอนแรกคือการสร้างฟังก์ชันอย่างมีประสิทธิภาพ คุณสามารถทำได้โดยเปิดเอกสาร functions.php ของคุณ เลื่อนลงมาแล้วใส่โค้ดนี้:
function pagination_nav() { global $wp_query; if ( $wp_query->max_num_pages > 1 ) { ?> <nav class="pagination" role="navigation"> <div class="nav-previous"><?php next_posts_link( '← Older posts' ); ?></div> <div class="nav-next"><?php previous_posts_link( 'Newer posts →' ); ?></div> </nav> <?php } }
จากนั้น คุณลักษณะนี้จะสร้างการเชื่อมต่อก่อนหน้าและถัดไป ซึ่งรวมอยู่ในแท็กการนำทาง HTML5 เมื่อนำไปใช้กับเทมเพลต องค์ประกอบแรกของคุณลักษณะนี้ช่วยยืนยันว่าขณะนี้มีโพสต์มากกว่า 1 หน้า ถ้าไม่ก็ไม่จำเป็นต้องใช้รหัส
หลังจากนั้นจะมีการจัดระเบียบมาร์กอัป HTML เราเริ่มต้นด้วยแท็กนำทางพื้นฐาน จากนั้นใช้ฟังก์ชันลิงก์โพสต์ถัดไปและลิงก์โพสต์ก่อนหน้าภายในแท็ก div ฟังก์ชันทั้งสองนี้รองรับอาร์กิวเมนต์แรกสำหรับ HTML ซึ่งสามารถใช้สำหรับกำหนดข้อความเอาต์พุตเองได้ ในแต่ละ (<-โพสต์ใหม่) เรามีจาวาสคริปต์และลูกศรจาวาสคริปต์เพื่อจัดรูปแบบด้วย CSS ในภายหลัง
คุณเพียงแค่ต้องใช้ฟังก์ชันนี้กับเทมเพลตจริงเมื่อคุณเพิ่มเข้าไปแล้ว ด้วยเหตุผลนี้ ให้ไปที่เทมเพลตซึ่งมีการเพจไฟล์ index.php และเลื่อนลงไปที่จุดสิ้นสุดของลูป สิ่งนี้เป็นไปตามประโยค "สิ้นสุด" แต่บางประโยค "แล้ว" ในวง เพิ่มหนึ่งบรรทัดนี้แล้ว:
<?php pagination_nav(); ?>
ซึ่งจะแสดงลิงก์ไปยังหน้าเว็บของคุณด้านล่างเนื้อหา และจะแสดงลิงก์เฉพาะในกรณีที่จำเป็นเท่านั้น

วิธีที่ 2: การแนบเลขหน้าเลขหน้า

การตั้งค่าค่อนข้างใกล้เคียงกับที่เรากำหนดค่าการแบ่งหน้าพื้นฐาน แต่แทนที่จะใช้ลิงก์ไปรษณีย์ต่อไปนี้และก่อนหน้า เราจะใช้คุณลักษณะลิงก์การแบ่งหน้าของ WordPress ซึ่งจะแสดงแถบการเพจทั้งหมดบนโมเดลของคุณ โค้ดบิตแรกในไฟล์ functions.php ของธีมหรือธีมลูกสามารถวางได้อีกครั้ง เราสามารถใช้ลิงก์ที่มีการแบ่งหน้าเพื่อวัดจำนวนหน้าที่ใช้ได้และแสดงรายการลิงก์
function pagination_bar() { global $wp_query; $total_pages = $wp_query->max_num_pages; if ($total_pages > 1){ $current_page = max(1, get_query_var('paged')); echo paginate_links(array( 'base' => get_pagenum_link(1) . '%_%', 'format' => '/page/%#%', 'current' => $current_page, 'total' => $total_pages, )); } }
อีกครั้ง มีการเพิ่มอ็อบเจกต์การสืบค้น $wp ทั่วโลกเพื่อให้เราดูบทความทั้งหมดของเราได้ จากนั้น โดยใช้คุณลักษณะ max num pages เราจะคำนวณจำนวนหน้าที่มีอยู่ในเพจของเรา และทำการตรวจสอบตามเงื่อนไขเพื่อให้แน่ใจว่ามีมากกว่า 1 หน้า ซึ่งต้องมีการแบ่งหน้า จะไม่มีใครแสดงเป็นอย่างอื่น สุดท้าย ในการค้นหาหน้าเว็บที่เราอยู่ตอนนี้ เราใช้ get_query_var
การย้ายขั้นสุดท้ายคือการใช้คุณลักษณะการใส่เลขหน้าเพื่อสร้างรายการหน้าและปุ่มก่อนหน้าและปุ่มถัดไป
โปรดไปที่เว็บไซต์ (โดยทั่วไปคือ index.php) และวางโค้ดต่อไปนี้ก่อนสิ้นสุดลูปของเรา หลัง "endif" แต่ก่อน "endwhile"
<nav class="pagination"> <?php pagination_bar(); ?> </nav>
คุณสามารถดูรายชื่อเว็บไซต์ที่เชื่อมต่อทั้งหมดได้ตามที่เห็นในภาพด้านบน แทนที่จะเป็นลิงก์พื้นฐานถัดไปหรือก่อนหน้า
เพิ่มการแบ่งหน้า WordPress โดยใช้ปลั๊กอิน
หากคุณไม่ได้เพิ่มการแบ่งหน้า WordPress ด้วยตนเอง คุณสามารถใช้ปลั๊กอิน WordPress เพื่อเพิ่มการแบ่งหน้าเหล่านี้ได้อย่างง่ายดาย นี่คือปลั๊กอินบางส่วนที่คุณสามารถใช้ได้:
WP-เพจNavi

มีปลั๊กอินบางตัวที่อาจช่วยได้หากคุณกำลังมองหาการแบ่งหน้าแบบกำหนดเองเล็กน้อยหรือคุณไม่ต้องการดำเนินการด้วยตนเอง บางที WP-PageNavi อาจเป็นสิ่งที่พบได้บ่อยที่สุด เพราะต้องมีการตั้งค่าที่สะดวก ปรับแต่งได้ และทันสมัย เราอธิบายว่าธีมจากธีมที่สง่างามได้รับการตั้งค่าให้เริ่มใช้ WP-PageNavi โดยอัตโนมัติพร้อมฟีเจอร์ PHP ในตัวและสไตล์ CSS ดังนั้นคุณเพียงแค่ต้องเรียกใช้ปลั๊กอิน
ในการเพิ่มการแบ่งหน้าให้กับเพจของคุณโดยใช้ปลั๊กอินนี้ คุณต้องเพิ่มฟังก์ชันต่อไปนี้:
<?php wp_pagenavi(); ?>
จากนั้นคุณสามารถใช้หน้าการตั้งค่าของปลั๊กอินเพื่อปรับแต่งทุกแง่มุมของการแบ่งหน้า เลือกข้อความที่จะแสดง เมื่อทำการเพจ และรูปแบบของแต่ละพื้นที่หน้าสำหรับลิงก์ถัดไปและก่อนหน้า
WP-เลขหน้า

WP Paginate นั้นค่อนข้างเหมือนกับ WP-Page Navi แต่คุณอาจพบว่าฟังก์ชันเพิ่มเติมบางอย่างมีประโยชน์ ตัวอย่างเช่น หากคุณต้องการปรับแต่งในภายหลังด้วย CSS หรือเลือกหมายเลขหน้าที่แน่นอนเพื่อแสดงบนการแบ่งหน้าของคุณ คุณสามารถควบคุมการมาร์กอัปซึ่งการสรุปเลขหน้าของคุณ เพื่อไม่ให้ใช้งานไม่ได้มากเกินไป เช่น WP-PageNavi ฟังก์ชันเดียวจะเพิ่มหมายเลขหน้าในหน้าของคุณ แทนที่การแบ่งหน้าที่มีอยู่

<?php if(function_exists('wp_paginate_comments')) { wp_paginate_comments(); } ?>
ธีมของคุณจะมีรายการหน้าที่ครอบคลุมซึ่งสามารถเปลี่ยนแปลงได้ด้วยการตั้งค่าของปลั๊กอิน หากคุณกำลังหาวิธีแก้ปัญหาง่ายๆ ที่ไม่ได้ติดอยู่กับตัวเลือกมากมาย WP-Paginate ทำงานได้ดีและทำงานอัตโนมัติเท่านั้น
สรุปผล
ขอแสดงความยินดี ในที่สุดคุณก็ได้เรียนรู้ วิธีเพิ่มการแบ่งหน้า WordPress แล้ว นอกจากนี้ ผู้เยี่ยมชมบางคนยังถามเราเกี่ยวกับ วิธีแก้ไข WordPress ที่ล้มเหลวในการอัปเดต ตรวจสอบบทความเฉพาะเกี่ยวกับเรื่องนี้
ติดต่อเจ้าหน้าที่ช่วยเหลือของเราหากคุณต้องการความช่วยเหลือเกี่ยวกับข้อผิดพลาดของการแบ่งหน้าของ WordPress หากมีปัญหาเกี่ยวกับ WordPress ทีมสนับสนุนของเราจะช่วยคุณได้
เรายอมรับข้อเสนอแนะทุกประเภทจากผู้เข้าชม เพราะมันกระตุ้นให้เราปรับปรุงอยู่เสมอ รู้สึกอิสระที่จะแสดงความคิดเห็นด้านล่าง