Responsive Full Screen Morphing Search Page Overlay With Predictive Autocomplete !

LebCit

PLEASE, MAKE SURE TO HAVE AT LEAST ONE POST WITH ONE CATEGORY AND ONE TAG BEFORE ACTIVATING 
Zipped : V2.7 -> 683Ko / V3.0 -> 33.6Ko ! 
MUCH LIGHTER, but STRONGER than ever !
Effect for any WordPress search input that morphs into a fullscreen overlay. 
Enlarge the search input and show 5 most recent posts, 5 most used categories and tags with counter. 
Once a search input is clicked, the whole search element expands to a fullscreen overlay. 
The fullscreen overlay has a bigger search input.
There are no settings for this plugin. Simply activate it, click on any search input and see the magic happens !
In the Customizer, look for FSMS Plugin, design it as you want ! 
You can change colors, search placeholder’s text and default icons with a styling option !
Don’t forget to take a look at the <a href="https://wordpress.org/plugins/full-screen-morphing-search/faq/" title="Frequently Asked Questions" rel="ugc">FAQ</a> Section. 
If you have some issues don’t hesitate, head over to the <a href="https://wordpress.org/support/plugin/full-screen-morphing-search" title="Support" rel="ugc">Support</a> Section ! 
If you use this plugin, please consider leaving a <a href="https://wordpress.org/support/plugin/full-screen-morphing-search/reviews/" title="Reviews" rel="ugc">Review</a> to give me a push forward 😉
<h3>Resources</h3>
This plugin is created by <a href="http://tympanus.net/codrops/author/crnacura/" title="Manoela Ilic" rel="author nofollow ugc">Manoela Ilic</a> and ported to WordPress by <a href="https://profiles.wordpress.org/lebcit/" title="LebCit" rel="author nofollow ugc">LebCit</a>. 
If you want to learn more about this plugin, visit the <a href="http://tympanus.net/codrops/2014/11/04/simple-morphing-search/" title="Simple Morphing Search" rel="nofollow ugc">Simple Morphing Search</a> original post.
<blockquote>
A <a href="https://wordpress.org/plugins/full-screen-morphing-search/#screenshots" title="Screenshots" rel="ugc">Picture</a> is worth a thousand words
</blockquote>
I think that a demo is even better ! 
See how <a href="http://tympanus.net/Development/MorphingSearch/" title="Full Screen Morphing Search" rel="nofollow ugc">Full Screen Morphing Search</a> works.
The autocompletition implemented in this plugin is based on <a href="https://github.com/TarekRaafat/autoComplete.js" title="autoComplete.js" rel="nofollow ugc">autoComplete.js</a> by <a href="https://github.com/TarekRaafat" title="Tarek Raafat" rel="nofollow ugc">Tarek Raafat</a> under the <a href="https://opensource.org/licenses/Apache-2.0" title="Apache License, Version 2.0" rel="nofollow ugc">Apache 2.0</a> License.
The main plugin icon is made by <a href="http://www.flaticon.com/authors/pixel-buddha" title="Pixel Buddha" rel="nofollow ugc">Pixel Buddha</a> from <a href="http://www.flaticon.com" title="Flaticon" rel="nofollow ugc">www.flaticon.com</a> and is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" rel="nofollow ugc">CC 3.0 BY</a> 
The article icon is made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik" rel="nofollow ugc">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon" rel="nofollow ugc">www.flaticon.com</a> and is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" rel="nofollow ugc">CC 3.0 BY</a> 
The category icon is made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik" rel="nofollow ugc">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon" rel="nofollow ugc">www.flaticon.com</a> and is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" rel="nofollow ugc">CC 3.0 BY</a> 
The tag icon is made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik" rel="nofollow ugc">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon" rel="nofollow ugc">www.flaticon.com</a> and is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" rel="nofollow ugc">CC 3.0 BY</a>

Alternatives to Full Screen Morphing Search

Top alternatives