--- title: "How to Customize WooCommerce Search Results Page in Elementor?" url: https://theplusaddons.com/docs/customize-woocommerce-search-results-page-in-elementor/ date: 2023-08-08 modified: 2026-09-11 lang: en author: "Aditya Sharma" description: "Is your product search results page a plain list that looks nothing like the rest of your shop? Shoppers who search are ready to buy; the results page should look..." image: https://theplusaddons.com/wp-content/uploads/2023/08/How-to-Customize-WooCommerce-Search-Results-Page-in-Elementor_-1024x536.jpg word_count: 382 --- # How to Customize WooCommerce Search Results Page in Elementor? ## - Woo Product Listing muestra los resultados de búsqueda en un diseño propio cuando la plantilla de búsqueda usa Product Listing Types en Search List. - WP Search Bar envía a los compradores a la página de resultados cuando Source está en Post, Select Type en Product y AJAX Search está desactivado. - The Plus Addons for Elementor Pro incluye Woo Product Listing solo para productos, no para entradas ni páginas, y el widget no aparece en el plugin gratuito. Is your product search results page a plain list that looks nothing like the rest of your shop? Shoppers who search are ready to buy; the results page should look the part. With a search template, The Plus Addons Woo Product Listing shows the results in your own design, and the WP Search Bar sends shoppers there. *To check the complete feature overview documentation of The Plus Addons for Elementor Product Listing widget, [click here](https://theplusaddons.com/docs/product-listing-widget-settings-overview/).* ***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.*** [LIVE WIDGET LINK](https://theplusaddons.com/elementor-listing/?utm_source=tpae&utm_medium=docs&utm_campaign=text#woo-products-wgts) ## Before You Start - **Edition:** **Pro** — the Woo Product Listing widget is part of The Plus Addons for Elementor Pro. It does not appear in the widget panel of the free plugin.- **WooCommerce** installed and active, with some published products.- **A search results template** from [Nexter Builder](https://nexterwp.com) or Elementor Pro's Theme Builder.- **Widget to enable:** Woo Product Listing, switched on under **ThePlus Settings > Widgets**. ## Step 1: Add the listing to the search template Edit your search results template and drag in the **Woo Product Listing** widget. In **Content > Content Layout**, set **Product Listing Types** to **Search List**. ![Product Listing Types set to Search List](https://theplusaddons.com/wp-content/uploads/2026/09/tp-product-listout-product-listing-types-wide-search.webp) The widget reads the search term from the address and lists matching products. The same listing type also works on product category and tag archives. ## Step 2: Add a product search bar Add The Plus Addons **WP Search Bar** widget to your header or the page. In its search field settings, set **Source** to **Post** and **Select Type** to **Product**. ![Select Type set to Product in the WP Search Bar field settings](https://theplusaddons.com/wp-content/uploads/2026/09/tpae-select-type-set-to-product-in-the-wp-search-bar-field-settings.webp) In its **Extra Options**, switch off **AJAX Search** so searches go to the results page instead of a dropdown. ![The AJAX Search switch turned off in the WP Search Bar widget](https://theplusaddons.com/wp-content/uploads/2026/09/tpae-the-ajax-search-switch-turned-off-in-the-wp-search-bar-widget.webp) ## Step 3: Test Search for a product on the live site. The results page shows your styled listing. ## Limitations - **Pro only.** The Woo Product Listing widget is not in the free plugin.- **Products only.** Search List lists products, not posts or pages. ## Troubleshooting ### The results show every product The template is not a search template, or the listing type is not Search List. ### Searches open a dropdown instead of the page AJAX Search is still on in the WP Search Bar widget. ## Related Docs - [Woo Product Listing widget: settings overview](https://theplusaddons.com/docs/product-listing-widget-settings-overview/) — every control in the widget.- [Build a product archive page](https://theplusaddons.com/docs/create-a-woocommerce-product-archive-page-in-elementor/)- [Add a category filter to the results](https://theplusaddons.com/docs/filter-woocommerce-products-by-category-in-elementor/) ## Frequently Asked Questions **Q: What do I need before customizing WooCommerce search results in Elementor?** A: The setup depends on a few specific pieces being in place: WooCommerce must be installed and active, you need some published products, and the search results page has to be built with a search template from Nexter Builder or Elementor Pro’s Theme Builder. The Woo Product Listing widget also has to be enabled under ThePlus Settings > Widgets. That matters because the listing only works inside a proper search template, not on a random page. **Q: How do I make WooCommerce search results show my own design instead of a plain product list?** A: The key is using the Woo Product Listing widget inside the search results template and setting Product Listing Types to Search List. The widget reads the search term from the address and pulls matching products into your layout, so the results page follows your design instead of looking like a default shop list. The same Search List mode also works on product category and tag archives. **Q: Why are my search results showing every product instead of matching the query?** A: That usually means the template is not actually a search template, or the listing type is not set to Search List. The widget only filters by the search term when it is placed in the right template and configured for that listing mode. If either part is off, it can fall back to showing all products, which makes the page look broken even though the widget is working. **Q: How do I stop product searches from opening a dropdown and send shoppers to the results page instead?** A: The WP Search Bar widget needs AJAX Search switched off in its Extra Options. When AJAX Search stays on, searches open a dropdown instead of loading the results page. For this tutorial, that setting matters because the whole goal is to route shoppers into your styled search template, not keep them in an inline suggestion list. **Q: Can I use this setup for posts or pages, or only WooCommerce products?** A: This setup is product-only. The Woo Product Listing widget’s Search List mode lists products, not posts or pages, so it is built for WooCommerce search results rather than general site search. That makes it a good fit when shoppers are already looking for something specific in your catalog and you want those results to stay inside your shop design. **Q: Is there another way to build a better WooCommerce results page with The Plus Addons for Elementor?** A: A related path is building a product archive page instead of a search results page. The tutorial links to [Build a product archive page](https://theplusaddons.com/docs/create-a-woocommerce-product-archive-page-in-elementor/), and it also points to [Add a category filter to the results](https://theplusaddons.com/docs/filter-woocommerce-products-by-category-in-elementor/) if you want more control over what shoppers see. For deeper widget settings, [Woo Product Listing widget: settings overview](https://theplusaddons.com/docs/product-listing-widget-settings-overview/) covers every control.