9917105951
Implement Phase 3: single product page templates (Bootstrap 5)
...
Add 21 Twig template overrides for the single product page:
Product layout:
- product-image: gallery with thumbnail strip, img-fluid rounded
- title: h1 entry-title
- price: fs-3 fw-bold with sale del/ins markup
- short-description: lead text-body-secondary
- meta: dl row with SKU, categories, tags
- rating: Bootstrap Icon stars with half-star, review count link
- stock: badge (bg-success/bg-danger/bg-warning) per status
- sale-flash: badge bg-danger fs-6
- share: hook-only wrapper
- product-attributes: table-sm table-striped
Related/upsells:
- related, up-sells: section with product loop grid
Tabs:
- tabs: nav-tabs + tab-content with fade transitions
- description: tab-pane with prose content
- additional-information: tab-pane with attributes hook
Add to cart (4 product types + variation JS):
- simple: input-group quantity + btn-primary btn-lg
- variable: form-select per attribute + variation display
- grouped: table-borderless with quantity per child product
- external: btn-outline-primary with external link icon
- variation: Underscore.js script templates (Bootstrap-styled)
- variation-add-to-cart-button: quantity + submit with hidden fields
CSS additions: gallery thumbnail hover, variation selector spacing.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com >
2026-02-28 10:28:13 +01:00
c9c99a6b88
Implement Phase 2: product archive and shop loop templates (Bootstrap 5)
...
Add 15 Twig template overrides for the product archive and shop loop:
- archive-product: 3+9 grid layout with optional filter sidebar
- content-product: card component with hook-based content injection
- content-product-cat: category card with thumbnail
- product-searchform: input-group with search icon button
- loop/loop-start, loop-end: responsive row-cols grid
- loop/header: archive title with description hook
- loop/result-count: showing X-Y of Z with aria-relevant
- loop/orderby: form-select-sm sort dropdown
- loop/pagination: delegates to components/pagination.html.twig
- loop/no-products-found: alert-info empty state
- loop/add-to-cart: btn-primary-sm with AJAX data attributes
- loop/price: fw-semibold with sale/regular markup
- loop/rating: Bootstrap Icon stars (full, half, empty)
- loop/sale-flash: badge bg-danger positioned overlay
CSS additions: product card hover, sale badge z-index, star rating sizing,
price del/ins styling, WooCommerce grid reset.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com >
2026-02-28 10:23:09 +01:00
01b807a769
Implement Phase 1: global templates and notices (Bootstrap 5)
...
Add 9 Twig template overrides for WooCommerce's global and notice templates:
- global/wrapper-start, wrapper-end: conditional container with _theme_wrapped
- global/breadcrumb: Bootstrap breadcrumb component with aria-current
- global/sidebar: offcanvas-lg for mobile, standard aside for desktop
- global/quantity-input: input-group with +/- buttons
- global/form-login: responsive form with form-control, form-check
- notices/notice, error, success: Bootstrap alert-dismissible with icons
Supporting changes:
- assets/js/quantity.js: +/- button handler respecting min/max/step
- assets/css/wc-bootstrap.css: WooCommerce notice fallback styles, spinner removal
- functions.php: register quantity.js script
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com >
2026-02-28 10:19:10 +01:00
9592b8cae5
Add comprehensive template conversion plan (PLAN.md)
...
9-phase plan covering all ~125 customer-facing WooCommerce templates,
organized by priority: globals, archive, single product, cart, checkout,
my account, orders, emails, and supplementary. Includes Bootstrap 5
component mappings, CSS/JS strategy, reusable components, accessibility
checklist, and per-file tracking.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com >
2026-02-28 10:05:58 +01:00
