Method 1: Add Button via Hook in functions.php
Add this code to your theme’s functions.php file:
function custom_go_back_button_view_order() {
?>
<style>
.custom-view-order-footer {
text-align: center;
margin-top: 30px;
padding: 20px 0;
}
.custom-view-order-footer .button {
background-color: #0071a1; /* Customize button color */
color: #fff;
padding: 10px 20px;
text-decoration: none;
border-radius: 5px;
display: inline-block;
}
.custom-view-order-footer .button:hover {
background-color: #005d85;
}
</style>
<div class="custom-view-order-footer">
<a href="<?php echo esc_url( wc_get_page_permalink( 'myaccount' ) ); ?>" class="button wc-backward">
← Go Back to My Account
</a>
</div>
<?php
}
add_action( 'woocommerce_view_order', 'custom_go_back_button_view_order', 20 );
Explanation:
- The
woocommerce_view_orderhook places the button at the bottom of the View Order page. - The button links back to the My Account page (
wc_get_page_permalink( 'myaccount' )). - Custom CSS ensures proper styling.
Alternative: Redirect to Order List Instead
If you want to redirect users back to their order list, change this line:
<a href="<?php echo esc_url( wc_get_account_endpoint_url( 'orders' ) ); ?>" class="button wc-backward">
Now, the button will return to the Orders list instead of the My Account page.
Final Output:
A “Go Back to My Account” (or Orders) button appears at the bottom of the View Order page. 🚀