If you don’t use the blocks editor, go to the Search shortcodes section where you can find the default shortcode that you can customize as you want. You can also create other shortcodes by clicking on Add new shortcode and configure the following settings:
- General
- Search input
- Submit button – Classic style
- Search results – Classic style
- Search results – Fullscreen overlay
- Extra options
General
- Name: enter the name for the shortcode;
- Style: choose the layout style from Classic and Fullscreen overlay;
- Size: (available if Classic style is selected) choose the search size from Small or Large;
- CSS class: enter CSS classes, space separated, to customize the search.
Search input
- Placeholder: enter the text that will show within the search bar;
- Border size (px): set the size of the border;
- Border radius: set the border radius;
- Colors: set the colors of the search form, placeholder, border, and background.
Submit button (available only for Classic style)
- Submit search style: select the style to apply to the search button. Available options are:
- Icon
- Icon position: left or right;
- Text
- Text: enter the label for the search button;
- Icon + Text
- Text: enter the label for the search button.
- Icon
Search results – Classic style
- Max results to show: set the number of results to show;
- Product info to show: choose the product data to show:
- Title
- Price
- SKU
- Add to cart
- Image
- Stock
- Summary
- Categories
- Title color: set the color of the title;
- Results layout: choose whether to show the results as a list or in a grid;
- Image size (px): set the size of the product images;
- Image position: (available only with List layout) choose whether to show the image on the left or on the right;
- Price label: enter the text to show before the price;
- No results notice: enter the text to show when the search produces no results;
- Limit summary length: enable this option if you want to define a maximum number of words in the summary;
- Max words: enter the value for the maximum number of words;
- Show “View all results” link: enable this option to show the View all results in the search results;
- “View all results” text: enter the text for the link to view all results. You can show the number of available results by using the placeholder {total};
- Badges to show: choose the badges to show:
- on sale
- out of stock
- featured
- Hide “Featured” badge if the product is on sale: enable this option to hide the featured badge on discounted products;
- Show also results related to: choose whether to extend the search to posts and/or pages;
- Related content label: enter the text for the related content;
- Max related content to show: set the maximum number of pages or posts to show.
Search results – fullscreen overlay style
- Product info to show: choose the product data to show:
- Title
- Price
- Add to cart
- Image
- Columns to show: set the number of columns to show;
- Rows to show: set the number of rows to show;
- No results notice: enter the text to show when the search produces no results;
- Show also results related to: choose whether to extend the search to posts and/or pages;
- Related content label: enter the text for the related content;
- Max related content to show: set the maximum number of pages or posts to show.
Extra options
- Icon colors: (available only with Fullscreen overlay) set the color and color focus of the icon;
- Show last searches: enable this option to show the latest searches made by the current user;
- Max searches to show: set the maximum number of latest searches to show;
- Label: enter the text to show as label for the latest searches;
- Show trending searches: enable this option to show the most popular searches made by all users;
- Max searches to show: set the maximum number of popular searches to show;
- Label: enter the text to show as label for the latest searches;
- Show related categories: enable this option to show the categories linked to search results;
- Max categories to show: set the maximum number of categories to show;
- Label: enter the text to show as label for the categories.