# smootify-search-page

> Full search results page driven by the query in the url or its text inputs (2.0: type="search" too), filled with the query, with count and pagination.

Status: Ready (Smootify 2.0)  
Add-on: Search  
URL: https://www.smootify.io/docs/astro/reference/elements/smootify-search-page  
Updated: 2026-10-21

## Where it can go

- **Anywhere** on the page.
- **Must contain** [`smootify-product`](https://www.smootify.io/docs/astro/reference/elements/smootify-product).
- **Out of place,** Smootify removes it from the page.

## What it requires

- The **Search** extension (lite or server plan, or the extension activated in the Smootify dashboard). Without it, the element does nothing.

## Fields in the form

Each field’s `name` attribute tells Smootify what the field holds.

| Name | Field | What it does |
|---|---|---|
| every `input[type="text"]` (any name) | `input type="text"` | Renamed `q`, prefilled from `?q=`; the first filled one is the query. |

## Attributes on the element

- **It reads** `data-wait`, `limit`, `disable-scroll`, `disable-scroll-on-load-more`, `auto-close-details`, `avoid-webflow-restart`, `page-range`, `animation`, `easing`, `duration`, `stagger`, `unavailable-products`.
- `avoid-webflow-restart`: the results render of this block fires no `smootify:render` (the other renders still can). There is no generic-named twin. See [Render event](https://www.smootify.io/docs/astro/reference/generic-build#render-event).

## Attributes inside it

| Group | Attribute name | Values |
|---|---|---|
| [Loading](https://www.smootify.io/docs/astro/reference/attributes/loading) | `skeleton` | 5 |
| [Search page](https://www.smootify.io/docs/astro/reference/attributes/search-page) | `search` | 5 |

## State classes

Smootify toggles `inited`, `is-empty`, `is-filtered`, `has-pagination`, `has-page-numbers`, `has-query`, `is-single-result` on it: style them in the site’s CSS for each state. See [State classes](https://www.smootify.io/docs/astro/reference/state-classes).

## Loading

Its code loads only on pages that have `smootify-search-page`.