如何自定义WooCommerce模板以避免在更新时覆盖

Question

我已经成功地更改了archive-product.php和content-product.php页面的HTML。一旦我更新到最新的Wordpress，我发现我所做的所有改变都消失了。

我注意到这个问题在我搜索自定义主题开发时随处可见。但是，我不知道如何对WooCommerce页面执行此操作。

首先，我在管理面板中找不到模板选项(可能是我的主题问题)。

第二，如何告诉WooCommerce使用我的自定义模板？

第三，我不知道该把什么放在我的定制设计中。

这就是我如何定制archive-product.php页面的方式。

get_header( 'shop' ); ?>

    <div class="row">
        <div class="small-12 medium-12 large-12 columns text-left">
            <!--breadcrumb-->
            <?php
            /**
             * woocommerce_before_main_content hook.
             *
             * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
             * @hooked woocommerce_breadcrumb - 20
             * @hooked WC_Structured_Data::generate_website_data() - 30
             */
            do_action( 'woocommerce_before_main_content' );
            ?>
        </div>

        <header class="small-12 medium-6 large-6 columns text-left woocommerce-products-header collapse">
        <!--title-->
            <?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?>

            <h1 class="woocommerce-products-header__title page-title"><?php woocommerce_page_title(); ?></h1>

            <?php endif; ?>

            <?php
                /**
                 * woocommerce_archive_description hook.
                 *
                 * @hooked woocommerce_taxonomy_archive_description - 10
                 * @hooked woocommerce_product_archive_description - 10
                 */
                do_action( 'woocommerce_archive_description' );
            ?>
        </header>

        <div class="small-12 medium-6 large-6 columns collapse">

            <?php if ( have_posts() ) : ?>
            <?php
                /**
                 * woocommerce_before_shop_loop hook.
                 *
                 * @hooked woocommerce_result_count - 20
                 * @hooked woocommerce_catalog_ordering - 30
                 */
                do_action( 'woocommerce_before_shop_loop' );
            ?>
            <?php endif; ?>
        </div>

    </div>


    <div class="row small-up-2 large-up-4">
        <?php if ( have_posts() ) : ?>

        <?php #woocommerce_product_loop_start(); ?><!--removes ul-->

            <?php woocommerce_product_subcategories(); ?>

            <?php while ( have_posts() ) : the_post(); ?>

                <?php
                    /**
                     * woocommerce_shop_loop hook.
                     *
                     * @hooked WC_Structured_Data::generate_product_data() - 10
                     */
                    do_action( 'woocommerce_shop_loop' );
                ?>

                <?php wc_get_template_part( 'content', 'product' ); ?>

            <?php endwhile; // end of the loop. ?>

        <?php #woocommerce_product_loop_end(); ?>

        <?php
            /**
             * woocommerce_after_shop_loop hook.
             *
             * @hooked woocommerce_pagination - 10
             */
            do_action( 'woocommerce_after_shop_loop' );
        ?>

        <?php elseif ( ! woocommerce_product_subcategories( array( 'before' => woocommerce_product_loop_start( false ), 'after' => woocommerce_product_loop_end( false ) ) ) ) : ?>

        <?php
            /**
             * woocommerce_no_products_found hook.
             *
             * @hooked wc_no_products_found - 10
             */
            do_action( 'woocommerce_no_products_found' );
        ?>

        <?php endif; ?> 
    </div>


<?php get_footer( 'shop' ); ?>

请与我分享这方面的任何参考资料。因为我不确定该跟着哪一个，也不清楚具体的步骤。

按照建议，

我在主题中创建了一个名为woocommerce的文件夹，并将模板文件放置如下：

my_theme/woocommerce/templates/archive-product.php
my_theme/woocommerce/templates/content-product.php

然而，它仍然指向插件文件。

Answer 1

让它像这样：

my_theme/woocommerce/archive-product.php
my_theme/woocommerce/content-product.php

Answer 2

在根文件夹上创建一个woocommerce文件夹，并将模板从woocommerce插件(在模板文件夹中)复制到根文件夹/woocommerce文件夹。编辑它们以避免在更新时发生更改。此外，根woocommerce文件夹中的文件必须与woocommerce插件/模板文件夹中的模式相同。

请按照下面的链接获得关于woocommerce模板自定义的更多细节。https://code.tutsplus.com/articles/an-introduction-to-theming-woocommerce-for-wordpress--wp-31577