There are instances when you might want WooCommerce products to open in a new tab instead of navigating away from the current page. This is especially useful when showcasing multiple products, such as in a product catalogue or related products section, where customers may want to explore different products without losing their place on your site.
In this guide, we’ll show you how to make WooCommerce product links open in a new browser tab using simple custom code, without relying on plugins. This can improve your store’s user experience, helping customers browse your products more efficiently. As always, use a child theme to protect your custom code during theme updates.
Why Open Products in a New Tab?
There are several reasons why you might want to have your products open in a new tab:
- Enhanced Browsing: Let customers view products without losing their place on the current page.
- Product Comparison: Make it easier for customers to compare products by allowing them to open multiple products in new tabs.
- User Retention: Keep users on the original page for longer, potentially encouraging further browsing or additional purchases.
Custom Code to Open Products in a New Tab
To make WooCommerce product links open in a new tab, we’ll add a custom attribute to all product anchor (<a>) tags on the shop and product listing pages. Add the following code to your theme’s functions.php file or in your child theme.
/*
* Snippet: How to Open WooCommerce Products in a New Tab – 2026
* Author: John Cook
* URL: https://wcsuccessacademy.com/?p=1554
* Tested with WooCommerce 10.7.0
* "This function adds target _blank to WooCommerce product links to open in new tab"
*/
function wcsuccess_open_products_in_new_tab( $html, $product ) {
// Add the 'target="_blank"' attribute to product links
$html = str_replace( '<a ', '<a target="_blank" ', $html );
return $html;
}
add_filter( 'woocommerce_loop_product_link', 'wcsuccess_open_products_in_new_tab', 10, 2 );
add_filter( 'woocommerce_single_product_link', 'wcsuccess_open_products_in_new_tab', 10, 2 );
How the Code Works
str_replace()Function: This code modifies the WooCommerce product link (<a>) tags, adding thetarget="_blank"attribute, which tells the browser to open the product link in a new tab.- Filters: The
woocommerce_loop_product_linkandwoocommerce_single_product_linkfilters are applied to both product listings (such as the shop or category pages) and the individual product links.
This method ensures that when users click on any WooCommerce product, it will open in a new browser tab, keeping the original page intact.
Open Products in a New Tab for Specific Pages Only
If you only want product links to open in a new tab on certain pages, such as the shop page or a category page, you can modify the code to be more specific. Here’s an example of how to apply this change only on the shop page:
/*
* Snippet: How to Open WooCommerce Products in a New Tab – 2026
* Author: John Cook
* URL: https://wcsuccessacademy.com/?p=1554
* Tested with WooCommerce 10.7.0
* "This function makes product links open in new tab only on the shop page"
*/
function wcsuccess_open_products_in_new_tab_on_shop( $html, $product ) {
if ( is_shop() ) {
$html = str_replace( '<a ', '<a target="_blank" ', $html );
}
return $html;
}
add_filter( 'woocommerce_loop_product_link', 'wcsuccess_open_products_in_new_tab_on_shop', 10, 2 );
How This Works
is_shop()Conditional: This condition checks if the user is currently on the WooCommerce shop page. If true, thetarget="_blank"attribute is applied to product links, ensuring that only shop page products open in a new tab.
You can replace is_shop() with other conditional tags, such as is_product_category(), to target specific areas of your site.
Adding Shortcodes to Product Descriptions
If you want to add dynamic content, such as shortcodes, to product descriptions or other parts of the product page, you can use the do_shortcode() function within WooCommerce product templates. For example:
add_filter( 'woocommerce_short_description', 'wcsuccess_add_shortcode_to_description' );
function wcsuccess_add_shortcode_to_description( $description ) {
return $description . do_shortcode('[your_custom_shortcode]');
}
This allows you to insert dynamic content, such as forms, banners, or other shortcode-supported elements, into product descriptions or other product-related content areas.
Best Use Cases for Opening Products in a New Tab
- Product Catalogues: If you display many products on the same page, letting customers open each product in a new tab ensures they don’t lose their place.
- Product Comparison: When customers are likely to compare several products, this feature makes it easier for them to open multiple products side by side.
- Cross-Selling: Encouraging customers to explore additional products without leaving their current page can lead to increased cart value and a smoother browsing experience.
Conclusion
Opening WooCommerce products in a new tab can greatly improve the user experience, making it easier for customers to browse your store without losing their place on key pages. Whether you want to apply this change to all product links or only specific sections of your store, the custom code provided ensures that you have complete control.
Remember to always test changes in a staging environment before applying them to your live site, and use a child theme to protect your customisations from theme updates. For more WooCommerce tips, check out our WooCommerce Visual Hooks Guide and wp-config generator for further customisation options.
I have been working with WordPress and WooCommerce since 2012 and have developed a deep knowledge of the content management system. Since 2012, I have developed several plugins and designed dozens of websites utilising different frameworks, CMS’s and programming languages. I am proficient in PHP, Python, Java, C, C++, R and JavaScript with limited experience in Go, Kotlin and Swift.
Educationally, I have a Master’s degree in cyber security a Bachelor’s (Hons, First Class) in Applied Research and a Graduate Certificate in Data Science. I’m currently undertaking PhD studies investigating IoT cybersecurity. I recently graduated with First Class Honours and Masters of Information Technology, receiving the Executive Dean’s Award for studies undertaken in the 2021 and 2022 academic years. I have worked in the information technology industry for the past 11 years primarily as a software/web developer specific to design, optimisation, network management and security. My research interests are in the areas of Internet of Things (IoT), 5G and Beyond Networks, information security for wireless networks and software development.
Stay In Touch
