คู่มือสำคัญในการสร้างวิดเจ็ตที่กำหนดเองใน WordPress

เผยแพร่แล้ว: 2021-07-06

วิดเจ็ตที่กำหนดเองของตัวเอง

วิธีสร้างวิดเจ็ตที่กำหนดเองบนเว็บไซต์ WordPress

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

นอกจากนี้ คุณสามารถเพิ่มวิดเจ็ตในส่วนอื่นๆ ของธีม WP เช่น ส่วนหัว ส่วนท้าย ฯลฯ) ได้ตามความต้องการและความต้องการของคุณ

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

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

โพสต์ที่เกี่ยวข้อง: วิธีเพิ่มวิดเจ็ตและเริ่มใช้งานบนเว็บไซต์ WordPress

คุณจะสร้างวิดเจ็ตที่กำหนดเองในแดชบอร์ดได้อย่างไร

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

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

ด้านล่างนี้คือรหัสที่จะสาธิตวิธีลงทะเบียนวิดเจ็ตที่กำหนดเอง:

// Register your custom widget function by hooking into the 'wp_dashboard_setup' action
add_action( 'wp_dashboard_setup', 'first_custom_dashboard_widget' );

ฟังก์ชั่น first_custom_dashboard_widget () {

wp_add_dashboard_widget(

'first_custom_dashboard_widget',
//นี่คือเครื่องมือทาก
'วิดเจ็ตแดชบอร์ดที่กำหนดเองตัวแรก'
//นี่คือชื่อวิดเจ็ตของคุณ
'first_custom_dashboard_widget_display'
//ฟังก์ชั่นการแสดงผล
);

}
//สร้างฟังก์ชันเพื่อแสดงเนื้อหาที่จะแสดงในวิดเจ็ตแดชบอร์ด
ฟังก์ชั่น first_custom_dashboard_widget_display () {

echo 'คุณอธิบายวิดเจ็ตของคุณที่นี่ วิดเจ็ต';

}

หมายเหตุ: ต้องเพิ่มโค้ดด้านบนลงในไฟล์ functions.php ของธีมของคุณ

ข้อมูลโค้ดด้านบนนี้จะช่วยในการสร้างวิดเจ็ตที่กำหนดเองชื่อ “First Custom Dashboard Widget” ตอนนี้มาทำความเข้าใจว่าโค้ดทำงานอย่างไร:

  • ในบรรทัดแรกของโค้ด ฟังก์ชัน register_first_custom_dashboard_widget() จะถูกเชื่อมเข้ากับเบ็ดการดำเนินการ wp_dashboard_setup กล่าวง่ายๆ คือ บรรทัดเริ่มต้นของโค้ดหมายความว่าเมื่อใดก็ตามที่การกระทำ wp_dashboard_setup ปรากฏขึ้นภายในโค้ดของธีมของคุณ first_custom_dashboard_widget() จะถูกดำเนินการ
  • ถัดไป ฟังก์ชัน wp_dashboard_setup() ทำการเรียก wp_add_dashboard_widget() อย่างง่าย ๆ ที่มีพารามิเตอร์ต่างๆ เช่น:
    • ทากวิดเจ็ต
    • ชื่อวิดเจ็ต
    • ฟังก์ชั่นการแสดงผล

    พารามิเตอร์ทั้งหมดเหล่านี้จำเป็นสำหรับการสร้างวิดเจ็ตที่กำหนดเองของคุณ

  • สุดท้าย ฟังก์ชัน my_dashboard_widget_display() ถูกกำหนดและมีข้อความบางส่วนที่ระบุว่า "นี่เป็นวิดเจ็ตที่กำหนดเองตัวแรกของฉัน"


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

เอาท์พุท:
นิ้วหัวแม่มือ

วิธีการเปลี่ยนตำแหน่งของวิดเจ็ตที่กำหนดเองของคุณ?

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

เห็นได้ชัดว่าคุณต้องการให้ผู้ใช้ปลั๊กอินของคุณวาง 'Custom Dashboard Widget' ของคุณไปยังตำแหน่งที่พวกเขาเลือก เพียงแค่ลากมัน

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

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

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

function first_custom_dashboard_widgets() {
wp_add_dashboard_widget( 'first_custom_dashboard_widget', 'First Custom Dashboard Widget', 'first_custom_dashboard_widget_function' );
// Globalize the array of the metaboxes, this will apply to all the widgets for wp-admin
global $wp_meta_boxes;
// Fetch array of the regular dashboard widgets
$normal_dashboard = $wp_meta_boxes['dashboard']['normal']['core'];
// Create a backup of the custom dashboard widget and delete it from the end of the array
$first_custom_widget_backup = array( 'first_custom_dashboard_widget' => $normal_dashboard['first_custom_dashboard_widget'] );
unset( $normal_dashboard['first_custom_dashboard_widget'] );
// Combine both the arrays together to put custom widget at the beginning
$sorted_dashboard = array_merge( $first_custom_widget_backup, $normal_dashboard );
// Save the value of sorted array back into the main metaboxes
$wp_meta_boxes['dashboard']['normal']['core'] = $sorted_dashboard;
}

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

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

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

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

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

โปรดจำไว้ว่า หากคุณมีปัญหาใดๆ กับส่วนการเข้ารหัส จะดีกว่าที่จะจ้างนักพัฒนา WordPress ที่สามารถช่วยเหลือคุณในการทำโครงการให้เสร็จสิ้น

ชีวประวัติผู้แต่ง:
Samuel Dawson เป็นผู้พัฒนาแอปพลิเคชันเว็บไซต์และตัวจัดการไฟล์ใน Designs2html Ltd. เขายังทำการแปลงธีม HTML เป็น WordPress ได้สำเร็จอีกด้วย

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