Search icon in header to open full page search

Support
#1

Hi,

Is there a way that in my pro theme header that i can have the search icon that when clicked it opens the full page search with cursor like how it does in the xtheme?

See the search icon here (on my other site) as to what i want it to do from my pro theme header.

Thanks.

#2

Hi,

You can use modal search element.

#3

Hi Paul, when i use the the modal serach element, when clicked a small searcg box appears with a border around it but it doesn’t do what the search box does on the site i mentioned which basically goes full screen with a larger search text in the middle.

#4

Hi There,

The element using PRO is easy to customize. There are a lot of ways to achieve what you want. Please check each options available. See this: https://screencast-o-matic.com/watch/cbQIesI2Ee

#5

Hi Lely,

Thanks for that. Im certainly much closer to what i want now. The only thing i cannot seem to do now is have the search text description “search” above a flashing cursor where you type like on the site i listed in my opening post. I also cant find where you turn off the submit and clear icons.

:slightly_smiling_face:

#6

Hi there,

Please add this CSS to your global Custom CSS

.x-search:before {
    content: "Type and Press “enter” to Search";
    display: block;
    clear: both;
    position: absolute;
    top: 15px;
    left: 0;
    width: 100%;
    text-align: center;
}
.x-search {
margin-top: 30px;
}

Hope this helps :slight_smile: