如何使用我的自定义html更改content-single-product.php页面

Question

我想在产品页面上显示我的自定义html代码，我创建了子主题并复制了woocommerce文件。现在，我要为该页面实现我的自定义html代码。

这是我的自定义代码

<section id="aboutus-section" class="content-section">
                <div class="container">
                    <div class="row">
                        <div class="main-title">
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                <h1 class="text-uppercase">ART BY MONA LIND</h1>
                                <h3>$150 - <a herf="https://www.definitepossibilities.com/hosting-clients/monalind/checkout/"> Checkout</a></h3>
                                <hr/>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <img class="img-responsive pull-right" style="margin-left: 20px; margin-bottom: 15px;" src="https://www.definitepossibilities.com/hosting-clients/monalind/wp-content/uploads/2018/07/Abstract-2-1.jpg" alt="Capturing  the light  and  the  natural  elements  of  life." />
                            <p>Art is a diverse range of human activities in creating visual, auditory or performing artifacts (artworks), expressing the author's imaginative, conceptual idea, or technical skill, intended to be appreciated for their beauty or emotional power. </p>
                            <p>Many argue that art cannot be defined. ... Art is often considered the process or product of deliberately arranging elements in a way that appeals to the senses or emotions. 
                                <br/> It encompasses a diverse range of human activities, creations and ways of expression, including music, literature, film, sculpture and paintings.
                                <br/><a herf="https://www.definitepossibilities.com/hosting-clients/monalind/checkout/"> Purchase this for $150</a>

                                </p>
                        </div>
                    </div>
                </div>
            </section>

这就是我想要的样子：

这是我的content-single-product.php模板代码：

<?php defined( 'ABSPATH' ) || exit;

/**
 * Hook: woocommerce_before_single_product.
 *
 * @hooked wc_print_notices - 10
 */
do_action( 'woocommerce_before_single_product' );

if ( post_password_required() ) {
    echo get_the_password_form(); // WPCS: XSS ok.
    return;
}
?>
<div id="product-<?php the_ID(); ?>" <?php wc_product_class(); ?>>

    <?php
        /**
         * Hook: woocommerce_before_single_product_summary.
         *
         * @hooked woocommerce_show_product_sale_flash - 10
         * @hooked woocommerce_show_product_images - 20
         */
        do_action( 'woocommerce_before_single_product_summary' );
    ?>

    <div class="summary entry-summary">
        <?php
            /**
             * Hook: woocommerce_single_product_summary.
             *
             * @hooked woocommerce_template_single_title - 5
             * @hooked woocommerce_template_single_rating - 10
             * @hooked woocommerce_template_single_price - 10
             * @hooked woocommerce_template_single_excerpt - 20
             * @hooked woocommerce_template_single_add_to_cart - 30
             * @hooked woocommerce_template_single_meta - 40
             * @hooked woocommerce_template_single_sharing - 50
             * @hooked WC_Structured_Data::generate_product_data() - 60
             */
            do_action( 'woocommerce_single_product_summary' );
        ?>
    </div>

    <?php
        /**
         * Hook: woocommerce_after_single_product_summary.
         *
         * @hooked woocommerce_output_product_data_tabs - 10
         * @hooked woocommerce_upsell_display - 15
         * @hooked woocommerce_output_related_products - 20
         */
        do_action( 'woocommerce_after_single_product_summary' );
    ?>
</div>

<?php do_action( 'woocommerce_after_single_product' ); ?>