# Compact Pop-Out Search

{% embed url="<https://youtu.be/LB7oLfuBWdI>" %}

Plugin version 4.0 and later includes the compact box layout, a pop-out search icon, that slides open a search bar upon user interaction. This layout is optimal for websites with less or no widget space left.

![](http://i.imgur.com/be4UCiS.gif)

By default, this option is disabled, but you can enable it with one single click under the `Layout Options -> Compact box layout` panel..

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

## Interaction

![](http://i.imgur.com/zbyw1LV.png)

With these two options you can define which events will open/close the compact search box.

* If the **Close on magnifier click** option is enabled, then none of the events associated with the magnifier icon will work. Thus it won't redirect or start a search event by clicking on it.

## Position and Size

By default the position is set to **"static"**, so it will stay inside it's parent element.

![](http://i.imgur.com/FYOpW8F.png)

If you however want to put it to the side of the page, you will need to change it to **"absolute"** or **"fixed"**.

In absolute or fixed positions it's highly advised to use a fixed width. As you can see on this option page, it's set to **"100%"** by default. Try **200px** or **300px** in absolute or fixed positions to avoid full page width search box.

![](http://i.imgur.com/QdKGkSM.png)

## Position values and z-index

![](http://i.imgur.com/5goIJjM.png)

If using **absolute or fixed** position, you can adjust the top, bottom, left and right values here.

The z-index is also adjustable here.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://documentation.ajaxsearchpro.com/layout-settings/compact-search-box-layout.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.