wc-bootstrap/templates/product-searchform.html.twig

{#
 # Product Search Form (Bootstrap 5 Override)
 #
 # Renders the WooCommerce product search form as a Bootstrap 5 input-group.
 #
 # Expected context:
 #   index - Unique form index (for multiple search forms on a page)
 #
 # WooCommerce PHP equivalent: product-searchform.php
 #
 # @package WcBootstrap
 # @since 0.1.0
 #}

{% set field_id = 'woocommerce-product-search-field-' ~ (index|default(0)) %}

<form role="search" method="get" class="woocommerce-product-search" action="{{ home_url('/') }}">
    <label class="visually-hidden" for="{{ field_id }}">{{ __('Search for:') }}</label>
    <div class="input-group">
        <input type="search"
               id="{{ field_id }}"
               class="form-control"
               placeholder="{{ __('Search products…') }}"
               value="{{ get_search_query()|esc_attr }}"
               name="s" />
        <button type="submit" class="btn btn-outline-primary" aria-label="{{ __('Search') }}">
            <i class="bi bi-search" aria-hidden="true"></i>
            <span class="d-none d-sm-inline ms-1">{{ __('Search') }}</span>
        </button>
    </div>
    <input type="hidden" name="post_type" value="product" />
</form>