สร้างส่วน "โพสต์ที่ได้รับความนิยม" ในตัวสร้างออกซิเจน - บทช่วยสอน

เผยแพร่แล้ว: 2022-06-22

ในบทความและวิดีโอบทช่วยสอนนี้ เราจะสร้างส่วนโพสต์ที่มีแนวโน้ม/เป็นที่นิยมใน Oxygen Builder โดยใช้องค์ประกอบ repeater, ปลั๊กอิน WordPress Popular Posts และข้อความค้นหาขั้นสูง

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

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

หลักสูตรการสร้างออกซิเจน - เร็ว ๆ นี้!

หลักสูตร Oxygen Builder Mastery จะนำคุณตั้งแต่เริ่มต้นจนถึงมืออาชีพ - รวมโมดูล ACF, MetaBox & WooCommerce

รับการแจ้งเตือนการเปิดตัว & ส่วนลด

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

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

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

ด้วยวิธีนี้ เราสามารถรวมโพสต์ยอดนิยมและโพสต์ที่กำลังเป็นที่นิยมไว้ใน Oxygen Builder ได้อย่างง่ายดายโดยใช้ตัวทำซ้ำ

วิดีโอสอน

รับมุมมอง

ขั้นตอนแรกคือการทำความเข้าใจจำนวนการดูโพสต์แต่ละรายการ

เพื่อให้ได้มุมมองจะใช้ปลั๊กอินยอดนิยมที่เรียกว่า " WordPress Popular Posts " นี่เป็นเครื่องมือที่ทรงพลังจริงๆ - รองรับหลายภาษา มาพร้อมกับแคช มีการจัดทำเอกสารไว้อย่างดีบน GitHub มีแดชบอร์ดสถิติในผู้ดูแลระบบ WP และยังมีการรองรับ API ด้วย!

isotropic-2022-06-19-at-17-41-16 — ติดตั้งปลั๊กอินนี้บนเว็บไซต์ Oxygen Builder ของคุณ

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

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

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

เพิ่มมุมมองในการโพสต์ Meta

เมื่อคุณติดตั้งปลั๊กอิน WordPress Popular Posts แล้ว ก็ถึงเวลาทำให้ข้อมูลนี้ใช้งานได้สำหรับการสืบค้นของเรา

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

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

ขั้นแรก เพิ่มรหัสนี้ในเว็บไซต์ของคุณโดยใช้ตัวจัดการข้อมูลโค้ด เราขอแนะนำ Scripts Organizer สำหรับเว็บไซต์ Oxygen Builder

/** * จัดเก็บมุมมองของช่วงเวลาต่างๆ เป็นเมตาคีย์ * * @author @migueleste / @radgh * @link https://wordpress.org/support/topic/how-to-sort-a-custom-query-by-views-all-time-monthly-weekly-or- daily/ * @param int $postid ID ของโพสต์ปัจจุบัน/หน้า/ประเภทโพสต์ที่กำหนดเอง */ ฟังก์ชั่น custom_wpp_update_postviews($postid) { // ความแม่นยำ: // 10 = 1 ใน 10 ครั้งจะอัปเดตจำนวนการดู (แนะนำสำหรับไซต์ที่มีการเข้าชมสูง) // 30 = 30% ของการเข้าชม (เว็บที่มีการเข้าชมปานกลาง) // 100 = ทุกครั้งที่เข้าชม สร้างการดำเนินการเขียน db จำนวนมากทุกคำขอ ความแม่นยำ $ = 50; if ( function_exists('wpp_get_views') && (mt_rand(0,100) < $accuracy) ) { // ลบหรือแสดงความคิดเห็นในบรรทัดที่คุณจะไม่ได้ใช้!! update_post_meta( $postid, 'views_total', wpp_get_views($postid, 'all', เท็จ) ); update_post_meta( $postid, 'views_daily', wpp_get_views($postid, 'daily', เท็จ) ); update_post_meta( $postid, 'views_weekly', wpp_get_views($postid, 'weekly', เท็จ) ); update_post_meta( $postid, 'views_monthly', wpp_get_views($postid, 'monthly', เท็จ) ); } } add_action('wpp_post_update_views', 'custom_wpp_update_postviews');

รหัสนี้สร้างขึ้นโดยนักพัฒนาซอฟต์แวร์ที่อยู่เบื้องหลังปลั๊กอินเพื่อทำสิ่งที่เราต้องการอย่างแท้จริง - ให้ข้อมูลที่ใช้งานได้แก่เราในการสืบค้น

มันทำให้เราใช้งานได้สี่ฟิลด์เมตาใหม่ - views_total, views_daily, views_weekly, views_monthly

จำนวนการดูทั้งหมดและจำนวนการดูรายเดือนเหมาะสำหรับส่วนโพสต์ยอดนิยม มุมมองรายวันและรายสัปดาห์เหมาะสำหรับโพสต์ที่กำลังเป็นที่นิยม

แต่ละฟิลด์มีตัวเลขสำหรับจำนวนการดูที่เกี่ยวข้อง - ตัวอย่างเช่น ในโพสต์หนึ่งๆ ฉันสามารถแสดง จำนวนการดูทั้งหมด ที่ฟรอนท์เอนด์โดยเพิ่มสิ่งนี้ในบล็อคโค้ด Oxygen บนเทมเพลตที่ใช้กับโพสต์:

<?php the_field('views_total'); ?> //ตัวอย่างผลลัพธ์จะเป็น 1203 นั่นหมายความว่าตั้งแต่เผยแพร่โพสต์ ก็มีผู้เข้าชม 1203 ครั้ง

รอก่อน!

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

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

ความแม่นยำถูกควบคุมจาก 0-100 หากตั้งค่าเป็น 100 การดูหน้าเว็บทุกหน้าจะถูกบันทึกลงในฐานข้อมูล หากตั้งค่าไว้ที่ 1 การเข้าชม 1 ใน 10 จะอัปเดตจำนวนการดู

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

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

สร้างส่วนโพสต์ที่ได้รับความนิยม

ตอนนี้ มาสร้างส่วนโพสต์ที่กำลังเป็นที่นิยมและเป็นที่นิยมกันอย่างรวดเร็ว

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

isotropic-2022-06-19-at-18-04-50 — จอแสดงผล "เรื่องเด่น" ของฉันสร้างขึ้นด้วยเครื่องทำซ้ำ Oxygen Builder

กระทู้ที่กำลังมาแรงของแบบสอบถาม

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

เมื่อต้องการทำเช่นนี้ ใช้คุณลักษณะการสืบค้นขั้นสูงสำหรับองค์ประกอบทวนหรือโพสต์อย่างง่าย

คลิกปุ่ม "แก้ไขแบบสอบถาม" เพื่อเปิด UI แบบสอบถามขั้นสูง

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

ฉันตั้ง:

posts_per_page = 8
no_found_rows = true (ปิดใช้งานการแบ่งหน้าสำหรับผู้ทำซ้ำ)
post_type = โพสต์
meta_key = views_weekly (สิ่งนี้บอก WordPress ว่าเราจำเป็นต้องเชื่อมโยงข้อมูลจากฟิลด์นี้กับแบบสอบถาม โปรดจำไว้ว่า เราสามารถเปลี่ยนแปลงสิ่งนี้เป็นยอดรวม รายวัน รายสัปดาห์ หรือรายเดือน ขึ้นอยู่กับว่าเราต้องการโพสต์ที่ได้รับความนิยมหรือเป็นที่นิยม)
order_by = meta_value_num (สิ่งนี้บอกเราว่าเราจะเรียงลำดับตามจำนวนที่เกี่ยวข้องกับ meta-value ซึ่งในกรณีนี้คือมุมมองรายสัปดาห์)
order = desc (คำสั่งนี้บอกให้เราเรียงโพสต์จากจำนวนการดูมากสุดไปน้อยสุด)

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

โบนัส

ฉันยังต้องการแสดงจำนวนการดูโดยรวมต่อผู้อ่านของฉันที่ส่วนหน้าของบล็อก ในการดำเนินการนี้ ฉันจะสร้างโค้ดสั้นๆ ฉันเพิ่มรหัสนี้ในตัวจัดการข้อมูลโค้ดของฉัน:

<?php add_action('init', function(){ add_shortcode('post_views', function(){ return wpp_get_views(get_the_ID()); }); }); ?>

จากนั้น ฉันสามารถแทรกจำนวนการดูสำหรับโพสต์เดียวโดยเพิ่มรหัสย่อนี้:

[post_views]

สำหรับบทช่วยสอนนี้ ฉันวางรหัสย่อนี้ไว้ในตัวทำซ้ำเพื่อแสดงมุมมองที่เกี่ยวข้องกับโพสต์ ด้วยวิธีนี้ ฉันสามารถตรวจสอบได้ว่าการสืบค้นของฉันทำงานตามที่ออกแบบไว้

isotropic-2022-06-19-at-18-03-45 — จะใช้ไม่ได้ในเอดิเตอร์ แต่จะใช้งานในส่วนหน้า

isotropic-2022-06-19-at-18-14-12 — ตัวทำซ้ำส่วนหน้า จัดเรียงตามจำนวนการดูรายสัปดาห์ แสดงจำนวนการดูหน้าเว็บทั้งหมดในส่วนหน้า

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

ฉันยังเพิ่มข้อมูลนี้ได้โดยเพิ่ม PHP ต่อไปนี้ไปที่บล็อกโค้ดบนเทมเพลตที่ใช้กับโพสต์เดียวโดยตรง:

<?php if ( function_exists('wpp_get_views') ) ) { // get_the_ID() ใช้งานได้เฉพาะเมื่อใช้ // ภายใน The Loop! (https://codex.wordpress.org/The_Loop) echo wpp_get_views(get_the_ID()); } ?> // ฉันยังสามารถกรอง <?php if ( function_exists('wpp_get_views') ) ) { // '15' นี่คือ ID ของโพสต์ / หน้า echo wpp_get_views(15, 'last7days'); } ?> // เพิ่มเติม: https://github.com/cabrerahector/wordpress-popular-posts/wiki/2.-Template-tags#wpp_get_views

บทสรุป

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

คุณอาจจะชอบ

สมัครสมาชิก & แชร์

หากคุณชอบเนื้อหานี้ สมัครสมาชิกเพื่อรับข่าวสาร WordPress แรงบันดาลใจเว็บไซต์ ข้อเสนอสุดพิเศษและบทความที่น่าสนใจทุกเดือนของเรา

ยกเลิกการสมัครได้ตลอดเวลา เราไม่สแปมและจะไม่ขายหรือแบ่งปันอีเมลของคุณ