TemplateX should wrap the account area, not rebuild WooCommerce's account screens as static markup.
Smallest My Account Page#
Create a page template for the WooCommerce account page:
<main class="account-page"> <h1>My account</h1> {{ notices }} {{ my_account }}</main>{{ my_account }} is a value tag. It prints WooCommerce's account area and does not have a closing tag.
WooCommerce controls:
- Login and registration forms when needed.
- Account navigation.
- Order lists.
- Downloads.
- Addresses.
- Account details.
- Logout links.
Your template controls the page wrapper, heading, spacing, and surrounding layout.
Notices#
Put {{ notices }} before the WooCommerce page tag:
{{ notices }}{{ my_account }}That gives WooCommerce one clear place to print login, account, payment, and order messages.
Related Order Pages#
WooCommerce usually handles order pay and order received screens as endpoints under the configured checkout page. Start with a normal checkout page:
<main class="checkout-page"> {{ notices }} {{ checkout }}</main>Add separate templates only when your routing and theme structure need them.
For an order payment page:
<main class="order-pay-page"> <h1>Pay for order</h1> {{ notices }} {{ order_pay }}</main>For an order received page:
<main class="order-received-page"> <h1>Order received</h1> {{ notices }} {{ order_received }}</main>{{ order_pay }} and {{ order_received }} are value tags.
What Not To Rebuild#
Avoid rebuilding these screens as static markup unless you are intentionally replacing WooCommerce behavior:
- Account login forms.
- Customer address forms.
- Order payment forms.
- Order received details.
- Download lists.
Those areas often receive markup, validation, links, and fields from WooCommerce or extensions. Use the native page tags first, then style the output from your theme CSS.