Our “Full Screen 2” search design has its own background overlay and open/close scripts, which conflict with the plugin you are using. As a result, achieving the desired functionality using only custom CSS is not possible. To implement your idea, you do not need to select “Full Screen 2” in the search settings, as you are not actually using it.
To resolve this issue, follow these steps:
1. Remove all the custom code we provided earlier.
2. Go to the Header settings, locate the Search element, and change the design from “Full Screen 2” to the regular “Form” design (Screenshot https://monosnap.com/file/ysrCL8GI5VXNYLSAViSxdri9an9hmT).
3. Use the following custom CSS to give the form a pointer cursor on hover, indicating that clicking it will open the plugin popup:
body .wd-header-search-form input {
cursor: pointer;
}
Additional Note: search settings for the desktop and mobile headers are configured separately. You may need to apply the same changes to the mobile header as well.
Kind Regards
.
