|
↳ See all 15 articles
/ Documentation /Customizer Settings/WooCommerce/ How to Add Additional Content on the My Account Login Page

How to Add Additional Content on the My Account Login Page

You can add headings, notices, links, or any custom content to specific parts of the WooCommerce My Account page, such as above the login form, above the registration form, or on the account dashboard. This guide covers two methods: Astra Pro’s Site Builder (no code) and an Astra child theme (code).

Requirements

  • WooCommerce installed and activated, with a My Account page set under WooCommerce > Settings > Advanced
  • Method 1: Astra Pro with the Site Builder module active
  • Method 2: An Astra child theme (works with free Astra)
  • To show the registration form, WooCommerce > Settings > Accounts & Privacy must allow customers to create an account on the My Account page

Before You Start: Shortcode vs Block-Built My Account Pages

How your My Account page is built decides whether the methods below will work.

Default (shortcode) My Account page: WooCommerce creates the My Account page with the [woocommerce_my_account] shortcode inside a Shortcode block. This page loads WooCommerce’s account templates, which include the hooks used in this guide. Both methods below work here.

Block-built or page builder My Account page: If the shortcode has been replaced with standalone login or registration blocks, or a page builder layout, WooCommerce’s account templates don’t load. In that case, the hooks below don’t run. Add your content directly with blocks in the page editor instead.

To check which one you have, go to Pages, edit your My Account page, and look for a Shortcode block containing [woocommerce_my_account].

Method 1: Using Site Builder Hooks (Astra Pro)

Astra Pro’s Site Builder module lets you add content easily using hooks. Site Builder lets you design the content with blocks and attach it to any of the hooks above, with no code required.

  1. Go to Astra > Site Builder and select Hooks.
  2. Create a new layout and give it a name, for example “Login Form Intro”.
  3. Add your content using blocks, such as a Heading and a Paragraph. You can also enable the Code Editor to add HTML instead.
  4. In the layout settings, set:
    • Layout: Hooks
    • Placcement: Custom Hook and then add action: woocommerce_login_form_start
    • Display On: Specific Pages, then select your My Account page. This keeps the content off the Checkout login form.
    • User Roles: Logged Out
  5. Click Publish.
custom hooks placement

To add content above the registration form, repeat these steps with woocommerce_register_form_start. For content on the logged-in dashboard, use woocommerce_account_dashboard and set User Roles to Logged In.

Why Use Hooks Instead of Editing the Page?

Blocks added above or below the shortcode on the My Account page show to every visitor, whether they’re logged in or not. Hooks let you place content at a precise spot, such as inside the login form or on the logged-in dashboard only.

Available My Account Hooks

HookWhere the content appears
woocommerce_before_customer_login_formAbove the login and registration forms (logged-out visitors)
woocommerce_login_form_startTop of the login form. Also fires on the Checkout login form.
woocommerce_login_form_endBottom of the login form
woocommerce_register_form_startTop of the registration form
woocommerce_register_form_endBottom of the registration form
woocommerce_after_customer_login_formBelow the login and registration forms
woocommerce_account_dashboardThe Dashboard tab (logged-in customers)

Apart from that, you can also use the hook placement added directly in the Site Builder module and display any custom before the My Account Navigation Tabs.

Method 2: Using an Astra Child Theme

If you prefer code, add the snippet below to the functions.php file of your Astra child theme. See How to Add Custom PHP Code for safe ways to add it.

Once the child theme is installed and activated, go to Appearance > Theme File Editor, and find the child theme. Open the functions.php file within the child theme for code customization.

Note: It’s generally recommended to edit the file over FTP or your host’s file manager rather than Appearance > Theme File Editor, since a typo in the editor can lock you out of the dashboard.

Next, copy and paste the provided code snippets at the end of the functions.php file.

// Add a heading and text at the top of the My Account login form.
add_action( 'woocommerce_login_form_start', 'astra_child_login_form_intro' );
function astra_child_login_form_intro() {
	// Skip the login form shown on the Checkout page.
	if ( ! is_account_page() ) {
		return;
	}
	echo '<h3 class="myaccount-form-title">Registered Customers</h3>';
	echo '<p class="myaccount-form-text">If you already have an account, sign in with your email address.</p>';
}

// Add a heading and text at the top of the registration form.
add_action( 'woocommerce_register_form_start', 'astra_child_register_form_intro' );
function astra_child_register_form_intro() {
	echo '<h3 class="myaccount-form-title">New Customers</h3>';
	echo '<p class="myaccount-form-text">Create an account for faster checkout, saved addresses, and easy order tracking.</p>';
}
Word Image 168089 1

Then, save the functions.php file by clicking the Update File button.

You can change the text, or swap in any other hook from the table above. To style the content, target the myaccount-form-title and myaccount-form-text classes under Appearance > Customize > Additional CSS.

Expected Outcome

Log out, or open a private browser window, and visit your My Account page. The custom content appears at the top of the login and registration forms, and doesn’t appear on the Checkout page’s login form.

The added content should now be displayed on the login and registration forms. You can visit your My Account page to view the changes.

Word Image 168089 2

By following these steps, you have successfully customized the My Account login page on your WooCommerce store. Feel free to adjust the HTML content and styling according to your store’s design preferences.

Notes

  • If the registration form doesn’t appear, enable account creation under WooCommerce > Settings > Accounts & Privacy.
  • If the content doesn’t show up, clear your site and browser cache, then confirm the page still uses the [woocommerce_my_account] shortcode.
  • Content added with woocommerce_login_form_start without a My Account display rule, or without the is_account_page() check, also shows on the Checkout page’s login form.
  • The above solution works with both the Classic My Account and Modern My Account Layout from Astra Pro.

Related Docs

We hope the above guide has been helpful. If you face any issues or need help with this, feel free to reach out to our support team.

Was this doc helpful?
What went wrong?

We don't respond to the article feedback, we use it to improve our support content.

Need help? Contact Support
Scroll to Top