如何使用 For & Foreach 循環在 WordPress 中創建多個小部件

已發表: 2020-01-25

如何在 WordPress 中創建多個小部件您是否正在尋找一種無需編寫太多代碼即可在 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/

註冊邊欄（

  大批（
     'name' => __('Njengah 小部件示例', 'textdomain' ),
     'id' => 'sidebar-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');

這是我們用來向 WordPress 站點添加一個小部件的 register_sidebar() 函數，現在可以使用 dynamic_sidebar() 函數將小部件顯示在相應的頁面模板中，如下所示：

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

    <ul id="邊欄">

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

    </ul>

<?php endif; ?>

在 WordPress 中創建多個小部件側邊欄

由於註冊側邊欄的代碼使用 register_sidebar() 函數來創建更多側邊欄，您只需根據需要重複該代碼幾次：現在我們可以通過重複此代碼來創建三個側邊欄，如下所示：

 /**
* 註冊 3 個小部件區域。
*/

功能 njengah_create_three_widget_tutorial() {

//註冊側邊欄#1

註冊邊欄（
   大批（
       'name' => __('Njengah Sidebar 1', 'textdomain'),
       'id' => 'sidebar-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

註冊邊欄（
   大批（
       'name' => __( 'Njengah Sidebar 2', 'textdomain' ),
        'id' => 'sidebar-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

註冊邊欄（
   大批（
       'name' => __('Njengah Sidebar 3', 'textdomain'),
       'id' => 'sidebar-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() 函數來執行 3 次。

使用參數在 WordPress 中創建多個小部件

我們可以通過將參數數組作為第二個參數傳遞給 register_sidebar() 函數來實現在 WordPress 中創建多個小部件的目標，第一個參數是我們想要創建的小部件的數量。在這種情況下，我們可以將上面共享的代碼更改為：

 功能 create_multiple_sidebar_widgets() {

$args = 數組（
    'name' => 'Njengah 側邊欄 %d',
    'id' => 'njengah-sidebar',
    'description' => 'Njengah 教程邊欄之一',
    '類' => '',
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget' => '</li>',
    'before_title' => '<h2 class="widgettitle">',
    'after_title' => '</h2>'
 );

  註冊邊欄（3，$args）；

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

名稱值有一個佔位符 %d，它只允許我們顯示帶有數字 1,2 和 3 的側邊欄。

這是在 WordPress 中創建多個小部件的快速解決方案，但它仍然不是最終解決方案。我們可以繼續改進它，我稍後會演示。

在 WordPress 中使用數組創建多個側邊欄

上面的解決方案不是很有效，因為標題和描述僅限於您在 register_sidebar () 函數中指定的內容。

為了使這個解決方案更好，我們可以引入一個包含名稱、ID 和描述的數組，然後我們使用 foreach 循環來註冊側邊欄。

以下是使用數組和 foreach 循環創建多個小部件的示例：

 功能 create_multiple_sidebar_widgets() {

$njengah_sidebars = 數組（
  大批（
     'name' => '小部件區域主頁',
     'id' => 'widget-area-homepage',
     'description' => '主頁上顯示的小部件',
  ),
  大批（
      'name' => '小部件區域標題',
     'id' => 'widget-area-header',
     'description' => '標題中顯示的小部件',
  ),
  大批（
     'name' => '小部件區域頁腳',
     'id' => 'widget-area-footer',
     'description' => '頁腳中顯示的小部件',
   ),
  );

   $默認值 = 數組（
      '名稱' => 'Njengah 側邊欄',
      'id' => 'njengah-sidebar',
      '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($sidebar, $defaults);

    註冊邊欄（$args）；
   }

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

此解決方案使您能夠在將來創建多個小部件，因為您只需將每個新的小部件詳細信息（名稱、id 和描述）添加到數組中，並且小部件是即時創建的。

在 WordPress 中創建多個類似的頁腳小部件

最終，這是在 WordPress 中創建多個小部件的最佳方法，儘管當您需要多個類似的小部件時，第二個選項也可以派上用場。

例如，當您要創建多個頁腳小部件時，可以更輕鬆地使用 for 循環，如下所示：

 /**
* 使用 for 循環註冊小部件區域
*
* @作者喬恩傑加
*/

功能 njengah_register_sidebars_dynamically() {

    for ( $i = 1, $n = 5; $i <= $n; $i++ ) {

       註冊邊欄（

         大批（
               'name' => esc_html__('頁腳區域#', 'textdomain') 。 $i,
               'id' => '頁腳-' 。 $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 循環只是計數為 5 並創建 5 個小部件，您只需將數字更改為您想要的任何其他數量的小部件，就會生成多個小部件動態動態。

包起來

我們已經介紹了在 WordPress 中創建多個小部件的三種不同方法，我希望這只是一個開始，可以激勵您在 WordPress 主題和插件中創建更多創新的方式來創建多個動態側邊欄或多個小部件。最後，對於每個 WordPress 開發人員來說，學習如何利用 DRY 原則非常重要，因為它不僅可以節省時間，還可以提高代碼效率。