WooCommerce Products Search in Oxygen

Update on 13 Aug 2021: You may want to follow this method instead.

---

This members-only tutorial provides the steps to set up a search form that searches across WooCommerce products instead of the standard posts & pages and to show the results with pagination on the search results pages.

We shall

• enable HTML5 output for the search form
• customise the above HTML to set the post_type to product
• get the posts_per_page value from WordPress settings page and use it to add pagination on search results pages. By default all products will appear without pagination.

Step 1

Install and activate Code Snippets plugin.

Add a new Snippet.

Title: Enable HTML5 for Search and other elements

Code:

add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) );

Step 2

Add another Snippet.

Title: Customize Search Form

Code: