> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/unicorn-shopify-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/unicorn-shopify-theme/page-categories/search.md).

# Search

{% hint style="success" %}
**Tip:** To edit the page, navigate to the **Search** template. Then, press the **"Search results"** section.
{% endhint %}

## Search results

<mark style="color:orange;">**Note!**</mark> This section contains the same settings as the Collection page. Read the settings description [<mark style="color:blue;">here</mark>](/unicorn-shopify-theme/page-categories/collections/collection.md#product-grid).

{% hint style="success" %}
Provides additional blocks to configure content: "[<mark style="color:blue;">Predictive search</mark>](#predictive-search)", "[<mark style="color:blue;">Sidebar</mark>](/unicorn-shopify-theme/page-categories/collections/collection/sidebar.md)", "[<mark style="color:blue;">Toolbar</mark>](/unicorn-shopify-theme/page-categories/collections/collection/toolbar.md)", and "[<mark style="color:blue;">Results grid</mark>](#results-grid)".
{% endhint %}

***

### Predictive search

**Show product suggestions**\
This option should be enabled to show the list of available products in the pop-up below the search box after entering a search query into the search input field. The product suggestions work on both desktop and mobile devices.\ <mark style="color:orange;">**Note!**</mark> Predictive search is supported for specific languages. Read more about Product suggestions in the following [<mark style="color:blue;">documentation</mark>](https://shopify.dev/docs/api/ajax/reference/predictive-search#requirements-and-limitations).

**Show vendor**\
Enable the option to display a product vendor.

**Show price**\
Tick the checkbox to display the product price

<figure><img src="/files/S2S2Nsbv5ShuJCqFFSxY" alt=""><figcaption></figcaption></figure>

***

### Results grid

#### Product cards

**Image ratio**\
Choose the appropriate aspect ratio for product cards. You can use one of the options that display well on both desktop and mobile views: "Adapt to image", "Portrait", "Square", "Landscape", or "Circle". You can check the image ratios [<mark style="color:blue;">here</mark>](/unicorn-shopify-theme/dynamic-theme-sections.md#content).

**Add image padding**\
Enable this option to add extra padding around product images and increase the space between product cards.

**Show secondary image on hover**\
Enable the option to show the second product image when the product card is hovered over.

**Show vendor**\
Display a brand for each product card.

**Buttons layout**\
Select the corresponding option in the drop-down: "Use theme settings", "Icon with text", "Icon only", or "Add to cart below". Read the options' descriptions [<mark style="color:blue;">here</mark>](/unicorn-shopify-theme/theme-settings/product-cards.md#button-layout).

#### Article card

The settings apply only to the blog posts.

**Show date /** **Show author**\
Control the display of the date and author by enabling or disabling the options.

***

{% tabs %}
{% tab title="Desktop" %}

<figure><img src="/files/31jJDhmIHC1d5Q1jTZs7" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="/files/XczMXtmEQzptxAlrXEOF" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}
