# Search page

**A Search Page** is where customers can look for specific products, articles, or pages. It helps them find the products, brands, features, and content they care about.

## **How to set up sections for Search Page?**

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Search** from the dropdown windo&#x77;**.**
4. From the side menu, select **Search results**. Configure the search page in the setting on the side with the following settings.

**Search results**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Number of columns on desktop</td><td>Number of columns to display on desktop computers. Minimum: 1. Maximum: 5.</td></tr></tbody></table>

**Product card**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Image ratio</td><td><p></p><p>The image ratio for the images of the recommended products:</p><ul><li><strong>Adapt to image (default)</strong> - Uses the aspect ratio of the images. This prevents the images from being cropped.</li><li><strong>Portrait</strong> - Crops the images to use a 2:3 ratio.</li><li>Square - Crops the images to use a 1:1 ratio.</li></ul></td></tr><tr><td>Show second image on hover</td><td>When a customer hovers their cursor over the product image, displays the second product image if the product has one.</td></tr><tr><td>Show vendor</td><td>Displays the vendor for each product.</td></tr><tr><td>Show product rating</td><td>Displays the average product rating in stars with the number of reviews in parenthesis, for example: ★★★★★ (8). Also requires <a href="https://apps.shopify.com/stories/guide-product-reviews">a product review app</a>, and <a href="https://shopify.dev/apps/metafields/definitions/standard-definitions">metafield definitions</a> for reviews.rating_count and reviews.rating.</td></tr><tr><td>Enable quick add button</td><td>Select this checkbox to enable/disable the quick add button on the product card on the search page.</td></tr></tbody></table>

**Filtering and sorting**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Enable filtering</td><td>Click to activate filtering of search results.</td></tr><tr><td>Desktop filter layout</td><td>Choose between a horizontal (default), vertical, or drawer layout.</td></tr><tr><td>Enable sorting</td><td>Click to activate sorting of search results.</td></tr><tr><td>Enable layout switcher on desktop</td><td><p>Select this checkbox to enable or disable the layout switcher on the search page's desktop layout. When enabled, there are 3 layout options:</p><ul><li>2 products per row</li><li>3 products per row</li><li>4 products per row</li></ul></td></tr></tbody></table>

**Blog card**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Show date</td><td>For each blog post, displays the date that the blog post was published.</td></tr><tr><td>Show author</td><td>For each blog post, displays the author of the blog post.</td></tr></tbody></table>

**Mobile Layout**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Number of columns on mobile</td><td>Set a specific column layout for mobile devices. Choose between 1 and 2 columns.</td></tr></tbody></table>

**Section padding**

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Top padding</td><td>Determines the height of the top inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).</td></tr><tr><td>Bottom padding</td><td>Determines the height of the bottom inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).</td></tr></tbody></table>
