WooCommerce is an outstanding tool for building online stores with WordPress, coping with the whole lot from product showcases to shop for processing, tax control, and previous.
One standout serve as of WooCommerce is its skill to handle detailed order knowledge. It meticulously stores each aspect of an order, along with the amount, international cash, delivery details, taxes, and further.
This detailed knowledge is effective for each and every store house owners and customers. Believe creating a internet web page where shoppers can with out issues check out their order details and customize it to turn additional information.
This knowledge walks you all the way through the stairs to build a custom designed WooCommerce web page that shows order details consistent with the order ID.
Why would you create a custom designed order details internet web page?
Creating a custom designed order details internet web page in WooCommerce will also be providing a number of advantages, catering to each and every the store owner’s and the patron’s needs. Listed here are a few compelling the reason why it’s essential want to pass this trail:
- Enhanced particular person revel in — A custom designed order details internet web page signifies that you’ll supply order knowledge that most nearly fits your customers’ needs. It signifies that you’ll tailor the layout and content material subject matter of your internet web page so that you’ll highlight very important details an identical to move status, product specifics, and provide dates, making it more uncomplicated for purchasers to go looking out what they’re on the lookout for in brief.
- Additional choices — A custom designed order details internet web page may give assist to as a way to upload unavailable choices via default in WooCommerce. For example, you’ll display customized fields like provide messages, specific instructions, or personalized notes unique to each order.
- Interactivity — A custom designed order details internet web page lets you include interactive parts an identical to enlargement bars for order tracking, links to equivalent products, or direct get right to use to purchaser improve, providing a richer, further sexy revel in for your shoppers.
- Flexibility and adaptability — Creating a custom designed order details internet web page can imply you’ll implement business-specific commonplace sense and adapt to changing needs. You’ll display different knowledge consistent with requirements unique for your store, an identical to the patron’s location or the type of products ordered.
One of the simplest ways to get order knowledge from the $order object
In WooCommerce, the $order object is a central piece that accommodates all the information about a decided on order. By way of leveraging this object, you’ll retrieve various details about an order, such since the order ID, order date, billing and delivery knowledge, and the products purchased.
Let’s go through discover ways to get right to use and use the ones different pieces of data from the $order object in detail.
1. Retrieve the order object
First, you must get the order object using the wc_get_order function. This function takes an order ID and returns the corresponding order object.
$order_id = 123; // Example order ID
$order = wc_get_order( $order_id );2. Fundamental order knowledge
After getting the $order object, you’ll retrieve basic information about the order. Listed here are some examples:
- Order ID — The unique identifier for the order.
$order_id = $order->get_id(); echo 'Order ID: ' . $order_id; - Order date — The date when the order used to be as soon as created.
$order_date = $order->get_date_created(); echo 'Order date: ' . wc_format_datetime( $order_date ); - Order normal — The entire amount for the order.
$order_total = $order->get_formatted_order_total(); echo 'Order normal: ' . $order_total;
3. Billing knowledge
Billing knowledge accommodates details supplied throughout the purchaser all the way through the checkout process. You’ll retrieve the ones details using the following methods:
- Billing care for:
$billing_address = $order->get_formatted_billing_address(); echo 'Billing care for: ' . $billing_address; - Billing email:
$billing_email = $order->get_billing_email(); echo 'Billing email: ' . $billing_email; - Billing phone:
$billing_phone = $order->get_billing_phone(); echo 'Billing phone: ' . $billing_phone;
4. Supply Knowledge
Supply knowledge accommodates the details of where the order will also be shipped. Similar to billing knowledge, you’ll get right to use the ones details using the $order object:
- Supply care for:
$shipping_address = $order->get_formatted_shipping_address(); echo 'Supply care for: ' . $shipping_address;
5. Order items
You’ll retrieve the items built-in in an order, which is particularly useful if you want to display purchased products. Proper right here’s discover ways to get the order items:
$items = $order->get_items();
foreach ( $items as $item_id => $products ) {
$product_name = $item->get_name();
$product_quantity = $item->get_quantity();
$product_total = $item->get_total();
echo 'Product identify: ' . $product_name . '
';
echo 'Quantity: ' . $product_quantity . '
';
echo 'General: ' . wc_price( $product_total ) . '
';
}6. Rate and delivery methods
You’ll moreover retrieve information about the cost and delivery methods used for the order:
- Rate method:
$payment_method = $order->get_payment_method_title(); echo 'Rate method: ' . $payment_method; - Supply method:
$shipping_methods = $order->get_shipping_methods(); foreach ( $shipping_methods as $shipping_method ) { echo 'Supply method: ' . $shipping_method->get_name(); }
7. Order status
The status of the order can also be helpful for various functionalities, an identical to tracking the expansion of the order:
$order_status = wc_get_order_status_name( $order->get_status() );
echo 'Order status: ' . $order_status;Creating a internet web page to turn order details via order ID
To provide a unbroken revel in for your customers, creating a custom designed internet web page where they may be able to view their order details via simply entering their order ID is beneficial.
Let’s knowledge you via creating a internet web page, along with setting up the template and showing the order knowledge.
Step 1: Create a custom designed internet web page template
First, create a custom designed internet web page template in your WordPress theme. This template can be utilized to turn the order details.
To take a look at this, navigate for your endeavor’s provide code. If you created your endeavor with DevKinsta, this is easy to get right to use. You’ll moreover use an FTP Consumer via using the settings in your internet web site knowledge internet web page (WordPress Internet sites > sitename > Knowledge).
In your kid theme list, create a brand spanking new document named page-order-details.php. Add the following code to this document:
<?php
if ( isset( $_GET['order_id'] ) ) {
$order_id = intval( $_GET['order_id'] );
display_order_details( $order_id );
} else {
echo 'No order ID supplied.
';
}
?>
<?php
get_footer();
// Function to turn order details
function display_order_details( $order_id ) {
$order = wc_get_order( $order_id );
if ( ! $order ) {
echo 'Invalid order ID.
';
return;
}
echo 'Order Details
';
echo '';
echo '- Order ID: ' . $order->get_id() . '
';
echo '- Order Date: ' . wc_format_datetime( $order->get_date_created() ) . '
';
echo '- Order General: ' . $order->get_formatted_order_total() . '
';
echo '- Billing Take care of: ' . $order->get_formatted_billing_address() . '
';
echo '- Supply Take care of: ' . $order->get_formatted_shipping_address() . '
';
echo '- Billing Electronic message: ' . $order->get_billing_email() . '
';
echo '- Billing Phone: ' . $order->get_billing_phone() . '
';
echo '- Rate Way: ' . $order->get_payment_method_title() . '
';
echo '- Order Status: ' . wc_get_order_status_name( $order->get_status() ) . '
';
echo '
';
echo 'Order Items
';
echo '';
$items = $order->get_items();
foreach ( $items as $item_id => $products ) {
echo '- ';
echo 'Product Establish: ' . $item->get_name() . '
';
echo 'Quantity: ' . $item->get_quantity() . '
';
echo 'General: ' . wc_price( $item->get_total() ) . '
';
echo ' ';
}
echo '
';
}Let’s injury down this code so you understand.
First, you understand the get_header() and get_footer() functions, which include the standard WordPress header and footer for the internet web page, ensuring it maintains the internet web site’s normal design and layout.
We also have some basic HTML markups which will also be very important for showing text on the web. The next very important code you understand is the location that checks if an order_id is passed as a URL parameter.
if ( isset( $_GET['order_id'] ) ) {
$order_id = intval( $_GET['order_id'] );
display_order_details( $order_id );
} else {
echo 'No order ID supplied.
';
}What it does is that if an order_id exists, it sanitizes the input using intval() and calls the display_order_details function. If no order_id is supplied, it outputs a message indicating this.
The display_order_details function is the function declared underneath get_footer(). This function takes the order ID as an input and retrieves the corresponding order object using wc_get_order().
If the order ID is invalid, it outputs an error message. In a different way, it retrieves and shows various order details an identical to reserve ID, date, normal, billing and delivery addresses, email, phone, rate method, and order status in an unordered list.
Additionally, it loops all the way through the order items and shows the product identify, quantity, and normal price for each products in another unordered list.
Step 2: Add the template for your theme and Create a brand spanking new internet web page in WordPress
Save the page-order-details.php document in your child theme list. This may most likely make the template available for selection when rising a brand spanking new internet web page in WordPress.
Next, pass to Pages > Add New in your WordPress admin dashboard. Give the internet web page a name, and then inside the Internet web page Attributes section at the right kind, make a selection the Order Details template from the Template dropdown.
If you don’t see the Internet web page Attributes section, you’ll navigate once more to Pages, where you’ll see a list of all pages with some alternatives when you hover over each internet web page. Make a selection Speedy Edit, and then you’ll see the Internet web page Attributes section.
Publish the internet web page, and also you’ll now check out the custom designed order details internet web page.
To test, navigate for your browser and append ?order_id=ORDER_ID to the URL, converting ORDER_ID with a sound WooCommerce order ID. As an example, https://yourwebsite.com/order-details/?order_id=70
This should display the order details for the specified order ID.
You’ll then add styling to the template as you like.
Creating an order details internet web page using WooCommerce order tracking shortcode
Another option you are going to now not be aware of is the WooCommerce order tracking shortcode, which supplies a UI for patrons to search for their order details via entering their order amount and email care for.
This internet web page shows the order amount, date, status, items, delivery, and billing care for. This can also be useful should you don’t intend to show further detailed knowledge.
Creating an order tracking internet web page using the WooCommerce order tracking shortcode is a straightforward way to improve purchaser revel in without delving into custom designed coding.
To take a look at this, follow the ones steps:
- Log into your WordPress dashboard.
- Next, create a brand spanking new internet web page via navigating to Pages > Add New.
- Give the internet web page a reputation, and inside the internet web page editor, add the following shortcode:
[woocommerce_order_tracking] - Next, click on at the Publish button to make the internet web page reside.
It’s as simple as that. Then again this gained’t give you the flexibility you wish to have.
Summary
Creating an order details internet web page in WooCommerce enhances the patron revel in via providing easy get right to use to order knowledge, bettering transparency and purchaser excitement.
If you’re experiencing slowness to your WordPress retailer, in particular massive stores with quite a few products, it is important to to remember the fact that a significant portion of your internet web site’s potency depends upon the high quality of your web hosting.
Fortunately, with Kinsta as your web hosting supplier in your WooCommerce retailer, you received’t need to worry about this.
The submit Developing a web page to show WooCommerce order particulars through order ID gave the impression first on Kinsta®.
Contents
- 1 Why would you create a custom designed order details internet web page?
- 2 One of the simplest ways to get order knowledge from the $order object
- 3 Creating a internet web page to turn order details via order ID
- 4 Order Details
- 5 Creating an order details internet web page using WooCommerce order tracking shortcode
- 6 Summary
- 7 How to Master Hover Effects in Divi 5 (Public Alpha)
- 8 Proscribing IPs and tracking process the use of the Kinsta API
- 9 Coming Soon: Black Friday Theme Builder Packs, Header Layouts, Footer Layouts And More!
0 Comments