# Shortcode generator

`Search instance options -> Shortcode generator button`

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

The *shortcode generator* helps you to create a specific arrangement for search elements. It's a great tool if you need to display the search box, the settings box and the result box in a specific way.

## Usage

* Click on the `Shortcode generator` button to open the modal box.
* Choose a pre-defined arrangement from the drop-down list, or use the buttons below it to add/remove the shortcode elements.
* Drag/Drop the elements to change their order.
* Use the width input fields to adjust the element relative width.

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

The above arrangement shortcode will appear on the front-end as:

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