My account page

Follow this guide to create a custom my account page: https://brickslabs.com/custom-woocommerce-account-dashboard-in-bricks/

I'll focus on a custom endpoints for account page. Let's say you want to create an endpoint for My Wishlist page.

First we need to add it with a code snippet:

// Add custom endpoint to WooCommerce My Account menu
function bt_add_wishlist_link_my_account( $items ) {
    $items['wishlist'] = __( 'Wishlist', 'bricks' );
    return $items;
}
add_filter( 'woocommerce_account_menu_items', 'bt_add_wishlist_link_my_account' );

// Display content for custom endpoint
function bt_wishlist_endpoint_content() {
    echo do_shortcode( '[bricks_template id="2977"]' ); // Replace with your template ID or desired content
}
add_action( 'woocommerce_account_wishlist_endpoint', 'bt_wishlist_endpoint_content' );

// Register the custom endpoint
function bt_woo_cust_endpoints(){
    add_rewrite_endpoint('wishlist', EP_ROOT | EP_PAGES);
}
add_action( 'init', 'bt_woo_cust_endpoints' );

// Define the URL for the custom endpoint
function bt_custom_endpoint_query_vars( $vars ) {
    $vars[] = 'wishlist';
    return $vars;
}
add_filter( 'query_vars', 'bt_custom_endpoint_query_vars', 0 );

// Add custom endpoint to WooCommerce breadcrumbs
function bt_add_wishlist_breadcrumbs( $crumbs ) {
    global $wp_query;
    
    if ( is_account_page() && isset( $wp_query->query_vars['wishlist'] ) ) {
        $crumbs[] = array( 'Wishlist', 'bricks' );
    }

    return $crumbs;
}
add_filter( 'woocommerce_get_breadcrumb', 'bt_add_wishlist_breadcrumbs' );

Notice this part:

echo do_shortcode( '[bricks_template id="2977"]' );

Specify the template shortcode id you want to use for Wishlist page. Meaning, you need to create a template in Bricks > Templates (Single type) and design it with Bricks. Then just copy its shortcode ID

Now this wishlist page will be under /my-account/wihslist url and it will inherit template from the My account page.

Last updated