วิธีสร้างวิดเจ็ตหลายตัวใน WordPress โดยใช้ For & Foreach Loops

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

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

วนซ้ำเพื่อสร้างแถบด้านข้าง WordPress หลายอัน

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

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

การสร้างวิดเจ็ต WordPress

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

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

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

 /**
* ลงทะเบียนพื้นที่วิดเจ็ต
*/

ฟังก์ชัน njengah_create_one_widget_tutorial () {

//ลงทะเบียนฟังก์ชันแถบด้านข้าง - https://developer.wordpress.org/reference/functions/register_sidebar/

register_sidebar (

  อาร์เรย์ (
     'name' => __( 'ตัวอย่างวิดเจ็ต Njengah', 'textdomain' ),
     'id' => 'แถบด้านข้าง-1',
     'description' => __( 'เพิ่มวิดเจ็ตที่นี่เพื่อให้ปรากฏในแถบด้านข้างของคุณ', 'textdomain' ),
     'before_widget' => '<section id="%1$s" class="widget %2$s">',
     'after_widget' => '</section>',
     'before_title' => '<h2 class="widget-title">',
     'after_title' => '</h2>',

   )

  );


}

add_action ('widgets_init', 'njengah_create_one_widget_tutorial');

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

 <?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>

    <ul id="แถบด้านข้าง">

      <?php dynamic_sidebar( 'sidebar-1' ); ?>

    </ul>

<?php endif; ?>

การสร้างแถบด้านข้างวิดเจ็ตหลายอันใน WordPress

เนื่องจากโค้ดสำหรับ register sidebar ใช้ฟังก์ชัน register_sidebar() เพื่อสร้างแถบด้านข้างเพิ่มเติม คุณเพียงแค่ต้องทำซ้ำโค้ดนั้นหลายๆ ครั้งตามที่คุณต้องการ: ตอนนี้ เราสามารถสร้างแถบด้านข้างได้สามแถบโดยทำซ้ำโค้ดนี้ดังนี้:

 /**
* ลงทะเบียน 3 พื้นที่วิดเจ็ต
*/

ฟังก์ชัน njengah_create_three_widget_tutorial () {

//ลงทะเบียนแถบด้านข้าง #1

register_sidebar (
   อาร์เรย์ (
       'name' => __( 'Njengah แถบด้านข้าง 1 ', 'textdomain' ),
       'id' => 'แถบด้านข้าง-1',
      'description' => __( 'เพิ่มวิดเจ็ตที่นี่เพื่อให้ปรากฏในแถบด้านข้าง 1', 'textdomain' ),
      'before_widget' => '<section id="%1$s" class="widget %2$s">',
      'after_widget' => '</section>',
      'before_title' => '<h2 class="widget-title">',
      'after_title' => '</h2>',
  )
);

//ลงทะเบียนแถบด้านข้าง #2

register_sidebar (
   อาร์เรย์ (
       'ชื่อ' => __( 'Njengah แถบด้านข้าง 2', 'โดเมนข้อความ' ),
        'id' => 'แถบด้านข้าง-2',
        'description' => __( 'เพิ่มวิดเจ็ตที่นี่เพื่อให้ปรากฏในแถบด้านข้าง 2.', 'textdomain' ),
        'before_widget' => '<section id="%1$s" class="widget %2$s">',
        'after_widget' => '</section>',
        'before_title' => '<h2 class="widget-title">',
       'after_title' => '</h2>',
     )
);

//ลงทะเบียนแถบด้านข้าง #3

register_sidebar (
   อาร์เรย์ (
       'name' => __( 'Njengah แถบด้านข้าง 3 ', 'textdomain' ),
       'id' => 'แถบด้านข้าง-3',
       'description' => __( 'เพิ่มวิดเจ็ตที่นี่เพื่อให้ปรากฏในแถบด้านข้าง 3.', 'textdomain' ),
       'before_widget' => '<section id="%1$s" class="widget %2$s">',
       'after_widget' => '</section>',
       'before_title' => '<h2 class="widget-title">',
       'after_title' => '</h2>',
      )
   );

}
add_action( 'widgets_init', 'njengah_create_three_widget_tutorial');

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

แต่เดี๋ยวก่อน! คุณไม่เคยได้ยินเกี่ยวกับกฎพื้นฐานหรือการเขียนโปรแกรมหนึ่งข้อ – DRY (อย่าทำซ้ำตัวเอง) หรือไม่?

นี่เป็นหลักการง่ายๆ ที่หมายความว่าโค้ดของคุณควรมีประสิทธิภาพและควรหลีกเลี่ยงการทำซ้ำเพื่อหลีกเลี่ยงความซ้ำซ้อน เราสามารถแทนที่โค้ดนี้ด้วยสิ่งที่ดีกว่าได้ ตัวอย่างเช่น เราสามารถส่งอาร์กิวเมนต์ไปยังฟังก์ชัน register_sidebar() เพื่อทำสิ่งนี้สามครั้ง

สร้างวิดเจ็ตหลายรายการใน WordPress ด้วยอาร์กิวเมนต์

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

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

$args = อาร์เรย์ (
    'name' => 'Njengah แถบด้านข้าง %d',
    'id' => 'njengah-แถบด้านข้าง',
    'description' => 'หนึ่งในแถบด้านข้างของบทช่วยสอนของ Njengah',
    'คลาส' => '',
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget' => '</li>',
    'before_title' => '<h2 class="widgettitle">',
    'after_title' => '</h2>'
 );

  register_sidebar( 3, $args );

}
add_action( 'widgets_init', 'create_multiple_sidebar_widgets');

ค่าชื่อมีตัวยึดตำแหน่ง %d ที่ช่วยให้เราสามารถแสดงแถบด้านข้างด้วยตัวเลข 1,2 และ 3

นี่เป็นวิธีแก้ปัญหาอย่างรวดเร็วในการสร้างวิดเจ็ตหลายรายการใน WordPress แต่ก็ยังไม่ใช่ทางออกที่ดีที่สุด เราสามารถไปข้างหน้าและปรับปรุงมันตามที่ฉันจะแสดงให้เห็นในไม่ช้า

สร้างแถบด้านข้างหลายอันด้วย Array ใน WordPress

วิธีแก้ปัญหาข้างต้นไม่ได้ผลมากนัก เนื่องจากชื่อและคำอธิบายจำกัดเฉพาะรายการที่คุณกำหนดในฟังก์ชัน register_sidebar () เท่านั้น

เพื่อทำให้โซลูชันนี้ดีขึ้น เราสามารถแนะนำอาร์เรย์ที่มีชื่อ รหัส และคำอธิบาย จากนั้นเราใช้ foreach loop เพื่อลงทะเบียนแถบด้านข้าง

ต่อไปนี้คือตัวอย่างการสร้างวิดเจ็ตหลายรายการโดยใช้อาร์เรย์และลูป foreach:

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

$njengah_sidebars = อาร์เรย์ (
  อาร์เรย์ (
     'name' => 'หน้าแรกของพื้นที่วิดเจ็ต',
     'id' => 'วิดเจ็ตพื้นที่หน้าแรก',
     'description' => 'วิดเจ็ตที่แสดงในหน้าแรก',
  ),
  อาร์เรย์ (
      'name' => 'วิดเจ็ตพื้นที่ส่วนหัว ',
     'id' => 'วิดเจ็ตพื้นที่ส่วนหัว',
     'description' => 'วิดเจ็ตที่แสดงในส่วนหัว',
  ),
  อาร์เรย์ (
     'name' => 'วิดเจ็ตพื้นที่ส่วนท้าย',
     'id' => 'วิดเจ็ตพื้นที่ส่วนท้าย',
     'description' => 'วิดเจ็ตที่แสดงในส่วนท้าย',
   ),
  );

   $ค่าเริ่มต้น = อาร์เรย์ (
      'name' => 'Njengah แถบด้านข้าง',
      'id' => 'njengah-แถบด้านข้าง',
      'description' => 'แถบด้านข้างเริ่มต้นจะแสดงที่ด้านซ้ายของหน้าบล็อกในธีมนี้',
       'คลาส' => '',
      'before_widget' => '<li id="%1$s" class="widget %2$s">',
      'after_widget' => '</li>',
      'before_title' => '<h2 class="widgettitle">',
      'after_title' => '</h2>'
  );

  foreach( $njengah_sidebars เป็น $sidebar ) {

    $args = wp_parse_args( แถบด้านข้าง $, $defaults );

    register_sidebar( $args );
   }

}
add_action( 'widgets_init', 'create_multiple_sidebar_widgets');

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

สร้างวิดเจ็ตส่วนท้ายที่คล้ายกันหลายรายการใน WordPress

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

ตัวอย่างเช่น เมื่อคุณต้องการสร้างวิดเจ็ตส่วนท้ายหลายอัน คุณสามารถใช้ for loop ได้ง่ายขึ้นดังนี้:

 /**
* ลงทะเบียนพื้นที่วิดเจ็ตโดยใช้ for loop
*
* @ผู้เขียน Joe Njenga
*/

ฟังก์ชัน njengah_register_sidebars_dynamically () {

    สำหรับ ( $i = 1, $n = 5; $i <= $n; $i++ ) {

       register_sidebar (

         อาร์เรย์ (
               'name' => esc_html__( 'Footer Area #', 'textdomain' ) $i,
               'id' => 'footer-' $i,
               'description' => sprintf( esc_html__( 'คอลัมน์ #%s ในส่วนท้าย', 'textdomain' ), $i ),
               'before_widget' => '<aside id="%1$s" class="widget %2$s">',
               'after_widget' => '</aside>',
               'before_title' => '<h3 class="widget-title">',
              'after_title' => '</h3>',
           )
        );
     }
   }
}
add_action( 'widgets_init', 'njengah_register_sidebars_dynamically' );

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

ห่อ

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