wc-bootstrap/templates/content-single-product.html.twig

{#
 # Single Product Content (Bootstrap 5 Override)
 #
 # Renders the single product page with a Bootstrap 5 two-column grid:
 #   Left column (col-lg-6):  Product images (sale flash + gallery)
 #   Right column (col-lg-6): Product summary (title, rating, price, excerpt,
 #                             add-to-cart, meta, sharing)
 #   Full-width rows below:   Tabs, upsells, related products
 #
 # All individual components are rendered via WooCommerce action hooks,
 # which trigger the Bootstrap 5 sub-templates through TemplateOverride.
 #
 # Rendered via the content-single-product.php bridge file (not TemplateOverride)
 # because wc_get_template_part() does not fire the template_part hooks.
 #
 # Hook output structure:
 #   woocommerce_before_single_product_summary → sale flash (10), product images (20)
 #   woocommerce_single_product_summary        → title (5), rating (10), price (10),
 #                                               excerpt (20), add-to-cart (30),
 #                                               meta (40), sharing (50)
 #   woocommerce_after_single_product_summary  → tabs (10), upsells (15), related (20)
 #
 # Context (from bridge file):
 #   product       - WC_Product object
 #   product_id    - Product post ID
 #   product_class - Space-separated CSS class string from wc_get_product_class()
 #
 # WooCommerce PHP equivalent: content-single-product.php
 #
 # @package WcBootstrap
 # @since 0.1.0
 #}

<div id="product-{{ product_id }}" class="{{ product_class }}">

    {# Two-column layout: images left, summary right #}
    <div class="row gx-4 gx-lg-5 mb-5">
        {# Left column: Sale flash + Product images #}
        <div class="col-lg-6 position-relative">
            {{ do_action('woocommerce_before_single_product_summary') }}
        </div>

        {# Right column: Product summary #}
        <div class="col-lg-6">
            <div class="summary entry-summary">
                {{ do_action('woocommerce_single_product_summary') }}
            </div>
        </div>
    </div>

    {# Full-width sections: Tabs, Upsells, Related Products #}
    {{ do_action('woocommerce_after_single_product_summary') }}

</div>

{{ do_action('woocommerce_after_single_product') }}