如何在側邊欄中自定義 WordPress 檔案的顯示

您是否需要自定義 WordPress 檔案在側邊欄中的顯示方式？

默認的 WordPress 檔案小部件提供有限的自定義。 您可能希望您的帖子檔案使用更少的空間、顯示更多信息或具有更吸引人的外觀。

在本文中，我們將向您展示如何在側邊欄中自定義 WordPress 檔案的顯示。

為什麼要在側邊欄中自定義 WordPress 檔案的顯示？

您的 WordPress 網站帶有一個存檔小部件，可讓您在側邊欄中顯示每月的博客文章存檔鏈接。

該小部件有兩個自定義選項：您可以將存檔列表顯示為下拉菜單，並且您可以顯示每個月的帖子計數。

但是，您可能希望以不同的方式顯示您的側邊欄存檔列表。 例如，隨著您網站的增長，默認列表可能會變得太長，或者您可能希望讓訪問者更容易瀏覽。

讓我們看看一些在側邊欄中自定義 WordPress 檔案顯示的方法：

• 創建壓縮檔案
• 在可折疊的大綱中顯示檔案
• 限制顯示的存檔月數
• 每日、每週、每月或每年列出檔案
• 顯示按年份排列的每月檔案

創建壓縮檔案

如果您的檔案列表變得太長，那麼您可以創建一個緊湊的檔案，以使用更少的空間來顯示您的帖子。

您需要安裝並激活由 WPBeginner 團隊開發和維護的 Compact Archives 插件。 有關更多詳細信息，請參閱我們關於如何安裝 WordPress 插件的分步指南。

激活後，您可以使用“WPBeginner 的緊湊檔案”塊將緊湊檔案添加到帖子、頁面或小部件。

緊湊的檔案列表通過稍微寬一些來節省垂直空間。 這意味著它可能更適合頁腳或檔案頁面而不是側邊欄。

但是，該插件非常可配置，您可以通過僅顯示每個月的第一個首字母或數字來縮小範圍。 您可以在我們的指南中了解有關如何在 WordPress 中創建緊湊檔案的更多信息。

在可折疊的大綱中顯示檔案

處理長檔案列表的另一種方法是在發布博客文章時顯示可折疊的年月大綱。

為此，您需要安裝並激活 Collapsing Archives 插件。 激活後，您需要訪問外觀»小部件頁面並將“壓縮檔案”小部件添加到您的側邊欄。

折疊檔案小部件使用 JavaScript 按年份折疊您的檔案。 您的用戶可以單擊年份來展開它們以查看每月檔案。 您甚至可以使每月檔案可折疊，並允許用戶查看下方的帖子標題。

您可以參考我們指南中關於如何限制 WordPress 中顯示的存檔月數的方法 1 了解更多信息。

這是它在我們的演示網站上的外觀。

限制顯示的存檔月數

阻止存檔列表變得過長的第三種方法是將顯示的月數限制為最近六個月。

為此，您必須將代碼添加到 WordPress 主題的文件中。 如果您以前沒有這樣做過，請參閱我們的指南，了解如何在 WordPress 中復制和粘貼代碼。

第一步是將以下代碼片段添加到您的functions.php 文件中，在特定於站點的插件中，或通過使用代碼片段插件。

// Function to get archives list with limited months
function wpb_limit_archives() { 
 
$my_archives = wp_get_archives(array(
    'type'=>'monthly', 
    'limit'=>6,
    'echo'=>0
));
     
return $my_archives; 
 
} 
 
// Create a shortcode
add_shortcode('wpb_custom_archives', 'wpb_limit_archives'); 
 
// Enable shortcode execution in text widget
add_filter('widget_text', 'do_shortcode'); 

您可以通過編輯第 6 行的數字來更改顯示的月數。例如，如果您將數字更改為“12”，那麼它將顯示 12 個月的檔案。

您現在可以轉到外觀 » 小部件頁面並將“自定義 HTML”小部件添加到您的側邊欄。 之後，您應該將以下代碼粘貼到小部件框中：

<ul>
[wpb_custom_archives]
</ul>

單擊“更新”按鈕後，您的側邊欄將僅顯示六個月的存檔。

有關更多詳細信息，請參閱我們指南中的方法 3，了解如何限制 WordPress 中顯示的存檔月數。

每日、每週、每月或每年列出檔案

如果您想更好地控制檔案的列出方式，那麼年度檔案插件會有所幫助。 它可以讓您每天、每週、每月、每年或按字母順序列出您的檔案，並且可以按十年對列表進行分組。

通過安裝和激活年度檔案插件開始。 之後，您可以前往外觀»小部件頁面並將年度存檔小部件拖動到您的側邊欄。

您可以給小部件一個標題，然後選擇是否顯示天、週、月、年、十年或帖子的列表。 您可以向下滾動到其他選項以限制顯示的檔案數量、選擇排序選項並添加其他文本。

如果您導航到設置 » 年度存檔，則可以使用自定義 CSS 進一步自定義存檔列表。

顯示按年份排列的每月檔案

有一次，我們正在處理客戶的網站設計，該網站需要在側邊欄中按年份排列的月度檔案。 這很難編碼，因為這個客戶只想在左邊顯示一次年份。

我們能夠修改 Andrew Appleton 的一些代碼。 Andrew 的代碼沒有檔案的限制參數，因此列表將顯示所有檔案月份。 我們添加了一個限制參數，允許我們在任何給定時間僅顯示 18 個月。

您需要做的是將以下代碼粘貼到主題的sidebar.php文件或您要顯示自定義 WordPress 檔案的任何其他文件中：

<?php
global $wpdb;
$limit = 0;
$year_prev = null;
$months = $wpdb->get_results("SELECT DISTINCT MONTH( post_date ) AS month ,  YEAR( post_date ) AS year, COUNT( id ) as post_count FROM $wpdb->posts WHERE post_status = 'publish' and post_date <= now( ) and post_type = 'post' GROUP BY month , year ORDER BY post_date DESC");
foreach($months as $month) :
    $year_current = $month->year;
    if ($year_current != $year_prev){
        if ($year_prev != null){?>
         
        <?php } ?>
     
    <li class="archive-year"><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/"><?php echo $month->year; ?></a></li>
     
    <?php } ?>
    <li><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/<?php echo date("m", mktime(0, 0, 0, $month->month, 1, $month->year)) ?>"><span class="archive-month"><?php echo date_i18n("F", mktime(0, 0, 0, $month->month, 1, $month->year)) ?></span></a></li>
<?php $year_prev = $year_current;
 
if(++$limit >= 18) { break; }
 
endforeach; ?>

如果要更改顯示的月數，則需要編輯第 19 行，將當前 $limit 值設置為 18。

您還可以通過在上述代碼的第 12-16 行之間的任何位置添加這段代碼來顯示每個月的帖子數：

<?php echo $month->post_count; ?>

您將需要使用自定義 CSS 在您的網站上正確顯示存檔列表。 我們在客戶網站上使用的 CSS 看起來像這樣：

.widget-archive{padding: 0 0 40px 0; float: left; width: 235px;}
.widget-archive ul {margin: 0;}
.widget-archive li {margin: 0; padding: 0;}
.widget-archive li a{ border-left: 1px solid #d6d7d7; padding: 5px 0 3px 10px; margin: 0 0 0 55px; display: block;}
li.archive-year{float: left; font-family: Helvetica, Arial, san-serif; padding: 5px 0 3px 10px; color:#ed1a1c;}
li.archive-year a{color:#ed1a1c; margin: 0; border: 0px; padding: 0;}

我們希望本教程能幫助您了解如何在側邊欄中自定義 WordPress 檔案的顯示。 您可能還想了解如何在 WordPress 中安裝 Google Analytics，或者查看我們的列表，列出使用 WordPress 寫博客的行之有效的方法。

如果您喜歡這篇文章，請訂閱我們的 YouTube 頻道以獲取 WordPress 視頻教程。 您也可以在 Twitter 和 Facebook 上找到我們。