Style and place search box anywhere (Squarespace)


Another quick Squarespace 6 tip.

To place a search box anywhere on your page (without using the usual block), insert the following code:

<code><div class="sqs-search-ui-button sqs-search-ui-button-wrapper" boost_title="10"><span class="title">Search</span></div>
</code>

You can then style the resultant search box like this:

<code>.sqs-search-ui-button-wrapper .title{border:0px;}
</code>

This is especially handy if you want to use jQuery to append the search box places that it usually can’t get to, like the menu: