為WordPress文章添加一個類似WooCommerce的相冊功能需要涉及到WordPress插件開發或者通過自定義代碼修改主題文件。以下是一個簡化的步驟,介紹如何為WordPress文章添加一個基本的相冊功能:

1. 創建相冊自定義字段

首先,你需要在文章編輯頁面添加一個自定義字段來保存相冊的圖片ID列表。

使用插件(推薦)

你可以使用Advanced Custom Fields這樣的插件來輕松地添加自定義字段。

安裝并激活Advanced Custom Fields插件。

創建一個新的字段組,并添加一個“圖片”類型的字段,允許用戶選擇多個圖片。

將此字段組關聯到你的文章類型。

手動修改主題文件

如果你想手動實現,你需要編輯你的主題中的functions.php文件,并添加自定義字段的代碼。

function add_gallery_field() {
    register_meta(
        'post',
        'gallery_images',
        array(
            'type'         => 'array',
            'description'  => __( 'Gallery Images', 'textdomain' ),
            'single'       => false,
            'show_in_rest' => true,
        )
    );
}
add_action( 'init', 'add_gallery_field' );

2. 在文章模板中顯示相冊

接下來,你需要在文章模板中顯示這個相冊。你可以通過編輯single.php或相關的模板文件來實現。

if ( get_post_meta( get_the_ID(), 'gallery_images', true ) ) {
    $gallery_images = get_post_meta( get_the_ID(), 'gallery_images', true );
    echo '<div class="custom-gallery">';
    foreach ( $gallery_images as $image_id ) {
        $image_src = wp_get_attachment_image_src( $image_id, 'large' );
        echo '<img src="' . $image_src[0] . '" alt="" />';
    }
    echo '</div>';
}

3. 樣式化相冊

你可以通過CSS來樣式化你的相冊。你可以將下面的樣式添加到你的主題樣式表或自定義CSS中。

.custom-gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.custom-gallery img {
    width: calc(50% - 10px);
    margin: 5px;
}

4. 測試你的相冊

保存你的更改,并發布一篇帶有相冊的文章來測試你的功能。

注意事項

確保在編輯主題文件之前備份你的網站。

上述代碼只是一個基本的示例,你可能需要根據你的需求進行調整。

考慮使用現成的WordPress插件,如Envira Gallery,它們提供了更多的功能和選項。