How to create a woocommerce custom my account page

Looking for a way to customize the woocommerce my account page? The edit account page is one of the most important pages in the woocommerce store. This page is essential for the smooth operation of the whole online store, so it must have a beautiful design. \
Woocommerce customize my account page this simple tutorial demonstrates how to customize the look, feel, layout, content, and design of my account page using custom PHP scripts. In other words, some coding knowledge is needed before continuing. If you are familiar with PHP customization, woocomerce can do almost everything. That is, you can add custom tabs, rename tabs, remove tabs, or merge tab contents. Let’s see how to achieve this.
To edit the \
function njengah_rename_address_my_account( $items ) {
$items[‘edit-address’] = ‘Delivery Address’;
return $items;
}
The results are as follows: To remove the male address tag, add the following code to the PHP file: add_filter( ‘woocommerce_account_menu_items’, ‘njengah_remove_address_my_account’, 9999 );
function njengah_remove_address_my_account( $items ) {
unset( $items[‘edit-address’] );
return $items;
}
The following is a complete list of label sliders in the $items array, allowing you to select which labels to remove$ items = array(
‘dashboard’ => __( ‘Dashboard’, ‘woocommerce’ ),
‘orders’ => __( ‘Orders’, ‘woocommerce’ ),
” => __( ”, ‘woocommerce’ ),
‘edit-address’; => _ n( ‘Addresses’, ‘Address’, (int) wc_shipping_enabled(), ‘woocommerce’ ),
‘payment-methods’ => __( ‘Payment methods’, ‘woocommerce’ ),
‘edit-account’ => __( ‘Account details’, ‘woocommerce’ ),
‘customer-logout’ => __( ‘Lo
gout’, ‘woocommerce’ ),
);
You can also merge tabs and content. For example, you can delete the address tab and move the content to the accounts tab. Add the following code to the PHP file:\/\/———————————–
\/\/ 1. Remove the Addresses tab
add_filter( ‘woocommerce_account_menu_items’, ‘njengah_remove_acc_tab’, 999 );
function njengah_remove_acc_tab( $items ) {
unset($items[‘edit-address’]);
return $items;
}
\/\/ ——————————-
\/\/ 2. Insert the content of the Addresses tab into an existing tab (edit-account in this case)
add_action( ‘woocommerce_account_edit-account_endpoint’, ‘woocommerce_account_edit_address’ );
The results are as follows: You can also create custom labels on this page. For example, you can add a new tab called \
* Add New Tab on the My Account page
*\/
\/\/ ——————
\/\/ 1. Register new endpoint (URL) for My Account page
\/\/ Note: Re-save Permalinks or it will give 404 error
function njengah_add_premium_support_endpoint() {
add_rewrite_endpoint( ‘premium-support’, EP_ROOT | EP_PAGES );
}
add_action( ‘init’, ‘njengah_add_premium_support_endpoint’ );
\/\/ ——————
\/\/ 2. Add new query var
function njengah_premium_support_query_vars( $vars ) {
$vars[] = ‘premium-support’;
return $vars;
}
add_filter( ‘query_vars’, ‘njengah_premium_support_query_vars’, 0 );
\/\/ ——————
\/\/ 3. Insert the new endpoint into the My Account menu
function njengah_add_premium_support_link_my_account( $items ) {
$items[‘premium-support’] = ‘Premium Support’;
return $items;
}
add_filter( ‘woocommerce_account_menu_items’, ‘njengah_add_premium_support_link_my_account’ );
\/\/ ——————
\/\/ 4. Add content to the new tab
function njengah_premium_support_content() {
echo ‘Premium WooCommerce Support. Welcome to the WooCommerce support area. As a premium customer, you can submit a ticket should you have any WooCommerce issues with your website, snippets or customization. & amp; lt; i& gt; Please contact your theme\/plugin developer for theme\/plugin-re

Author:

Leave a Reply

Your email address will not be published. Required fields are marked *