> For the complete documentation index, see [llms.txt](https://aries-theme.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aries-theme.gitbook.io/docs/other-pages/search.md). # Search The Search Page is where customers see results when they search for products, articles, or pages on your store. This page displays a search bar at the top where customers can enter their search terms, and then shows all matching results in an organized grid layout. The Search Page can display products, blog articles, and pages that match the search query, making it easy for customers to find exactly what they're looking for across your entire store. This page is essential for helping customers discover products and content, especially in stores with large catalogs or extensive blog content. The Search Page automatically appears when customers use the search functionality on your store. It shows results from all searchable content including product titles, descriptions, blog posts, and pages. Customers can filter and sort results to narrow down their search, making it easier to find specific items or information. The page supports predictive search (if enabled) which shows suggestions as customers type, helping them find what they need faster. ## Main Section: Search results The Search Results section displays all search results in a customizable grid layout. It can show products, blog articles, and pages that match the customer's search query. The section includes a search bar at the top, filtering and sorting options, and customizable result cards that display different information based on the type of content. You can control the layout, image sizes, what information is displayed, and how results are organized to create an effective search experience.
{% hint style="info" %} ### How to set it up 1. Go to Online Store > Themes > Customize. 2. Open Templates > Search. 3. Configure the sections and blocks. 4. Preview live, then click Save. {% endhint %} ### Settings #### Heading content * **Heading text size**: Control the size of the search page heading. Options include Small heading (compact), Medium heading (standard size), or Large heading (prominent). The heading automatically displays "Search" or "Search results" depending on whether a search has been performed. #### Layout * **Columns**: Control how many results appear side by side on desktop screens. Options range from 4 to 6 columns. More columns create a more compact layout showing more results at once, while fewer columns make each result more prominent and easier to see. * **Mobile columns**: Control how many results appear side by side on mobile devices. Options include 1 column (results stacked vertically) or 2 columns (results side by side). Two columns show more results at once but make each result smaller. * **Colors**: Choose a color scheme for the search results section background. This affects the overall appearance of the search page. #### Pagination * **Items per page**: Control how many search results are displayed on each page before pagination. Options range from 12 to 24 items in increments of 4. More items per page reduce pagination but may make pages load slower, while fewer items create faster-loading pages with more navigation. #### Product card * **Image ratio**: Control the shape of product images in search results. Options include Landscape (wide images), Portrait (tall images), Square (equal width and height), or Tall (extra tall images). Choose the ratio that best showcases your products and matches your design aesthetic. * **Show second image on hover**: When enabled, displays a second product image when customers hover over a product card in search results. This gives customers a better view of products without clicking through to the product page. * **Vendor**: When enabled, displays the product vendor name on product cards in search results. This is useful if you sell products from multiple brands or manufacturers and want to highlight brand information. * **Product rating**: When enabled, displays customer ratings and reviews on product cards in search results if you have a reviews app installed. Ratings help build trust and provide social proof that can encourage purchases. An app is required for product ratings to work. #### Filtering and sorting * **Filters**: When enabled, allows customers to filter search results by various attributes like price, availability, product options, and more. This helps customers quickly narrow down search results to find exactly what they're looking for. Filters can be customized with the Search & Discovery app in your Shopify admin. * **Filter layout**: Choose how filters are displayed on the search page. Options include Horizontal (filters appear as a horizontal bar above results), Vertical (filters appear in a sidebar on the left), or Drawer (filters appear in a slide-out drawer that opens from the side). Each layout works well for different screen sizes and design preferences. * **Sorting**: When enabled, allows customers to sort search results by various criteria like relevance, price (low to high or high to low), newest, best selling, and more. This gives customers control over how results are organized, making it easier to find what they want. #### Blog card * **Date**: When enabled, displays the publication date on blog article cards in search results. This helps customers see how recent the content is and can help them find timely information. * **Author**: When enabled, displays the author name on blog article cards in search results. This is useful if you have multiple authors or want to give credit to content creators. #### Padding * **Padding top**: Add space above the section. Options range from 0px (no space) to 400px in 10px increments. On mobile devices, this is automatically reduced to half the value for better mobile display. * **Padding bottom**: Add space below the section. Options range from 0px (no space) to 400px in 10px increments. On mobile devices, this is automatically reduced to half the value for better mobile display. *** ### Tips * Enable filters and sorting to help customers narrow down search results quickly. Well-organized filtering can significantly improve the search experience and help customers find what they're looking for faster. * Show product ratings in search results to build trust and help customers make informed decisions. Ratings can be particularly helpful when customers are comparing multiple products from search results. * Use the "Show second image on hover" feature to give customers a better view of products without leaving the search page. This can help reduce bounce rates and increase engagement. * Adjust the items per page setting based on your typical search result volume. If searches often return many results, showing more per page reduces pagination, but be mindful of page load times. * Use the image ratio that works best with your product photography style. Portrait ratios work well for fashion and apparel, while square ratios are great for accessories and home goods. * Consider enabling predictive search in your theme settings to show suggestions as customers type. This can significantly improve the search experience and help customers find products faster.