本教程旨在指導(dǎo)用戶(hù)如何在 Elementor 中為分類(lèi)歸檔頁(yè)面動(dòng)態(tài)展示相關(guān)文章。我們將重點(diǎn)介紹如何利用 Elementor 主題構(gòu)建器中的“歸檔文章”小部件，并通過(guò)設(shè)置“當(dāng)前查詢(xún)”選項(xiàng)，無(wú)需編寫(xiě)復(fù)雜代碼即可實(shí)現(xiàn)文章根據(jù)當(dāng)前分類(lèi)自動(dòng)篩選和顯示，從而優(yōu)化用戶(hù)體驗(yàn)和開(kāi)發(fā)效率。

在 Elementor 主題構(gòu)建器中創(chuàng)建自定義歸檔頁(yè)面時(shí)，動(dòng)態(tài)展示與當(dāng)前分類(lèi)相關(guān)的文章是一個(gè)非常常見(jiàn)的需求。許多開(kāi)發(fā)者可能會(huì)誤認(rèn)為需要編寫(xiě)復(fù)雜的自定義查詢(xún)代碼來(lái)實(shí)現(xiàn)這一功能。然而，Elementor 提供了更簡(jiǎn)潔、高效且內(nèi)置的解決方案，能夠完美處理這類(lèi)場(chǎng)景。

核心方法：使用 Elementor “歸檔文章”小部件

Elementor 的“歸檔文章”（Archive Posts）小部件專(zhuān)為各種歸檔頁(yè)面（如分類(lèi)、標(biāo)簽、作者歸檔等）設(shè)計(jì)，能夠智能地根據(jù)當(dāng)前頁(yè)面上下文顯示相關(guān)內(nèi)容。

步驟詳解：

1. 創(chuàng)建或編輯歸檔模板:

   • 首先，導(dǎo)航至 WordPress 后臺(tái)的 Elementor -youjiankuohaophpcn 主題構(gòu)建器。
   • 點(diǎn)擊“添加新模板”，選擇模板類(lèi)型為“歸檔”（Archive），然后命名并創(chuàng)建模板。
   • 在“顯示條件”中，確保該歸檔模板被應(yīng)用到“所有分類(lèi)歸檔”（All Categories Archive）或你指定的目標(biāo)分類(lèi)。

2. 添加“歸檔文章”小部件:

   • 在 Elementor 編輯器中，從左側(cè)小部件面板搜索并拖拽“歸檔文章”（Archive Posts）小部件到你的頁(yè)面布局中。
   • 這個(gè)小部件會(huì)自動(dòng)顯示你的文章，但關(guān)鍵在于下一步的配置。

3. 配置查詢(xún)選項(xiàng)為“當(dāng)前查詢(xún)”:

   • 選中“歸檔文章”小部件，進(jìn)入其設(shè)置面板。
   • 找到“查詢(xún)”（Query）選項(xiàng)卡。
   • 在“源”（Source）下拉菜單中，務(wù)必選擇“當(dāng)前查詢(xún)”（Current Query）。

原理闡釋?zhuān)?/h4>

當(dāng)“歸檔文章”小部件的“查詢(xún)?cè)础痹O(shè)置為“當(dāng)前查詢(xún)”時(shí)，Elementor 會(huì)智能地識(shí)別當(dāng)前頁(yè)面的上下文。這意味著：

藍(lán)心千詢(xún)

藍(lán)心千詢(xún)是vivo推出的一個(gè)多功能AI智能助手

34

查看詳情

• 如果用戶(hù)正在訪問(wèn)一個(gè)特定的分類(lèi)歸檔頁(yè)面（例如：/category/news/），“當(dāng)前查詢(xún)”會(huì)自動(dòng)獲取該分類(lèi)的 ID。
• 小部件隨后會(huì)根據(jù)這個(gè) ID 自動(dòng)過(guò)濾并顯示該分類(lèi)下的所有文章，無(wú)需你手動(dòng)指定任何分類(lèi)或編寫(xiě) PHP 代碼來(lái)獲取當(dāng)前分類(lèi)信息。
• 這種方法不僅大大簡(jiǎn)化了開(kāi)發(fā)流程，還確保了最佳的兼容性和性能。

理解與避免：自定義查詢(xún)過(guò)濾器的常見(jiàn)誤區(qū)

雖然 Elementor 提供了強(qiáng)大的自定義查詢(xún)過(guò)濾器（通過(guò) add_action( 'elementor/query/{your_custom_filter}', ... ) 鉤子），但對(duì)于標(biāo)準(zhǔn)的分類(lèi)歸檔需求，它通常不是首選，甚至可能因誤用而導(dǎo)致問(wèn)題。

例如，在問(wèn)題中提供了一個(gè)嘗試使用自定義查詢(xún)過(guò)濾器的代碼片段：

add_action( 'elementor/query/my_custom_filter', function( $query ) {
    // 獲取當(dāng)前 meta Query
    $meta_query = $query->get( 'meta_query' );

    // 如果沒(méi)有 meta query，則初始化為空數(shù)組
    if ( ! $meta_query ) {
        $meta_query = [];
    }

    // 添加我們的 meta query
    $meta_query[] = [
        'key' => 'category',
        'value' => get_the_ID(),
        'compare' => '=',
    ];
    $query->set( 'meta_query', $meta_query );
} );

這段代碼存在幾個(gè)關(guān)鍵誤區(qū)：

1. meta_query 用于分類(lèi)過(guò)濾是錯(cuò)誤的: meta_query 是用于查詢(xún)文章的自定義字段（post meta）。而 category 是 WordPress 的一個(gè)內(nèi)置分類(lèi)法（taxonomy）。要按分類(lèi)過(guò)濾，應(yīng)使用 tax_query，而不是 meta_query。
2. get_the_ID() 在此上下文中的作用: 在 Elementor 的查詢(xún)鉤子中直接使用 get_the_ID()，如果不是在文章循環(huán)內(nèi)部，它通常會(huì)返回當(dāng)前頁(yè)面（例如歸檔模板本身）的 ID，而非當(dāng)前歸檔分類(lèi)的 ID。要獲取當(dāng)前歸檔對(duì)象的 ID，應(yīng)使用 get_queried_object_id()。

如果確實(shí)需要通過(guò)自定義代碼實(shí)現(xiàn)分類(lèi)過(guò)濾（例如，在非歸檔頁(yè)面上顯示特定分類(lèi)的文章，并且 Elementor 內(nèi)置選項(xiàng)無(wú)法滿(mǎn)足），正確的做法是使用 tax_query 并獲取正確的分類(lèi) ID。以下是一個(gè)僅作演示的示例，但對(duì)于標(biāo)準(zhǔn)的分類(lèi)歸檔，仍然推薦使用“歸檔文章”小部件的“當(dāng)前查詢(xún)”功能：

// 僅作演示：如何通過(guò)自定義查詢(xún)過(guò)濾器正確地按分類(lèi)過(guò)濾
// 通常不推薦用于標(biāo)準(zhǔn)的分類(lèi)歸檔頁(yè)面，因?yàn)椤皻w檔文章”小部件更優(yōu)
add_action( 'elementor/query/my_custom_filter_taxonomy', function( $query ) {
    $queried_object = get_queried_object(); // 獲取當(dāng)前查詢(xún)的對(duì)象

    // 確保當(dāng)前查詢(xún)對(duì)象是分類(lèi)（WP_Term）且是“category”分類(lèi)法
    if ( $queried_object instanceof WP_Term && $queried_object->taxonomy === 'category' ) {
        $tax_query = $query->get( 'tax_query' );
        if ( ! $tax_query ) {
            $tax_query = [];
        }
        $tax_query[] = [
            'taxonomy' => 'category',
            'field'    => 'term_id',
            'terms'    => $queried_object->term_id,
            'operator' => 'IN',
        ];
        $query->set( 'tax_query', $tax_query );
    }
} );

重要提示: 上述代碼僅為演示如何正確使用 tax_query 和 get_queried_object()。對(duì)于本教程討論的“Elementor 分類(lèi)歸檔頁(yè)面動(dòng)態(tài)文章展示”場(chǎng)景，強(qiáng)烈推薦使用“歸檔文章”小部件的“當(dāng)前查詢(xún)”功能，因?yàn)樗?jiǎn)單、更健壯，且無(wú)需編寫(xiě)任何代碼。

總結(jié)

Elementor 提供了直觀且強(qiáng)大的工具來(lái)構(gòu)建動(dòng)態(tài)網(wǎng)站。對(duì)于分類(lèi)歸檔頁(yè)面的文章展示，優(yōu)先選擇“歸檔文章”小部件并將其查詢(xún)?cè)O(shè)置為“當(dāng)前查詢(xún)”，這不僅能大大簡(jiǎn)化開(kāi)發(fā)流程，還能確保最佳的兼容性和性能。只有在遇到非常規(guī)或復(fù)雜查詢(xún)需求，且 Elementor 內(nèi)置功能無(wú)法滿(mǎn)足時(shí)，才考慮深入研究自定義查詢(xún)過(guò)濾器，并務(wù)必確保正確理解其工作原理和參數(shù)設(shè)置。

以上就是Elementor 動(dòng)態(tài)分類(lèi)歸檔文章展示：利用內(nèi)置功能實(shí)現(xiàn)智能查詢(xún)的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！