Title: Full Screen Morphing Search Author: LebCit Published: Ogwekkuminogumu (Museenene) 16, 2016 Last modified: Gatonnya 9, 2021 --- Search plugins ![](https://ps.w.org/full-screen-morphing-search/assets/banner-772x250.png?rev=1538331) This plugin **hasn’t been tested with the latest 3 major releases of WordPress**. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress. ![](https://ps.w.org/full-screen-morphing-search/assets/icon.svg?rev=1538331) # Full Screen Morphing Search By [LebCit](https://profiles.wordpress.org/lebcit/) [Download](https://downloads.wordpress.org/plugin/full-screen-morphing-search.3.5.zip) * [Details](https://lug.wordpress.org/plugins/full-screen-morphing-search/#description) * [Reviews](https://lug.wordpress.org/plugins/full-screen-morphing-search/#reviews) * [Installation](https://lug.wordpress.org/plugins/full-screen-morphing-search/#installation) * [Development](https://lug.wordpress.org/plugins/full-screen-morphing-search/#developers) [Support](https://wordpress.org/support/plugin/full-screen-morphing-search/) ## Description **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 [FAQ](https://wordpress.org/plugins/full-screen-morphing-search/faq/) Section. If you have some issues **don’t hesitate**, head over to the [Support](https://wordpress.org/support/plugin/full-screen-morphing-search) Section ! If you use this plugin, please consider leaving a [Review](https://wordpress.org/support/plugin/full-screen-morphing-search/reviews/) to give me a push forward 😉 ### Resources This plugin is created by [Manoela Ilic](http://tympanus.net/codrops/author/crnacura/) and ported to WordPress by [LebCit](https://profiles.wordpress.org/lebcit/). If you want to learn more about this plugin, visit the [Simple Morphing Search](http://tympanus.net/codrops/2014/11/04/simple-morphing-search/) original post. > A [Picture](https://wordpress.org/plugins/full-screen-morphing-search/#screenshots) > is worth a thousand words I think that a demo is even better ! See how [Full Screen Morphing Search](http://tympanus.net/Development/MorphingSearch/) works. The autocompletition implemented in this plugin is based on [autoComplete.js](https://github.com/TarekRaafat/autoComplete.js) by [Tarek Raafat](https://github.com/TarekRaafat) under the [Apache 2.0](https://opensource.org/licenses/Apache-2.0) License. The main plugin icon is made by [Pixel Buddha](http://www.flaticon.com/authors/pixel-buddha) from [www.flaticon.com](http://www.flaticon.com) and is licensed by [CC 3.0 BY](http://creativecommons.org/licenses/by/3.0/) The article icon is made by [Freepik](https://www.flaticon.com/authors/freepik) from [www.flaticon.com](http://www.flaticon.com) and is licensed by [CC 3.0 BY](http://creativecommons.org/licenses/by/3.0/) The category icon is made by [Freepik](https://www.flaticon.com/authors/freepik) from [www.flaticon.com](http://www.flaticon.com) and is licensed by [CC 3.0 BY](http://creativecommons.org/licenses/by/3.0/) The tag icon is made by [Freepik](https://www.flaticon.com/authors/freepik) from [www.flaticon.com](http://www.flaticon.com) and is licensed by [CC 3.0 BY](http://creativecommons.org/licenses/by/3.0/) ## Screenshots * [[ * As you can see, their is a search form a close button and three columns. The first column shows the most 5 recent posts. The second column shows the top 5 used categories and how many posts each category has. The third column shows the top 5 used tags and how many posts each tag has. * [[ * FSMS Plugin in the Customizer. * [[ * Posts with no Featured Image defined. * [[ * Change the default icons and choose to make the new Icon/Image Round or Not ! * [[ * First type something in the input text field, then change the input text color. * [[ * Old screenshot. ## Installation #### How to install the plugin and get it working. 1. Install Full Screen Morphing Search plugin through the WordPress plugins screen directly. 2. **Make sure to have at least one post with one category and one tag before activating**. 3. Activate the plugin through the ‘Plugins’ screen in WordPress. 4. Navigate to your site and click on any search input and see the magic happens ! 5. In the Customizer, look for **FSMS Plugin**, design it as you want ! ## FAQ ### Recent posts thumbnails are not round ! Some of your images where added before this plugin. If your posts thumbnails are not round, you’ll have to use, one time, a thumbnail regenerator. I recommend [Regenerate Thumbnails](https://wordpress.org/plugins/regenerate-thumbnails/). You can uninstall the thumbnail regenerator once the regeneration is done. ### The overlay is not covering the whole page ! If your theme has some boxed style(s), like Twenty Sixteen or Twenty Twelve, the overlay will only cover the inside box (the site content) ! ### How to change the search input text color ? First, you’ll have to type something in the input, then choose the desired color. Take a look at the [Screenshots](https://wordpress.org/plugins/full-screen-morphing-search/#screenshots). ### How to change the shape of New Icon/Image ? First make sure that you have used a thumbnail regenerator, see first FAQ. Then, click on the checkbox option **Icon/Image Round or Not ?!** If the new Icon/Image is already round (like the default one of category and tag), this option will have no effect ! ### Hitting Enter key doesn’t fire a search ! **As long as** the autocompletition gives results as you type, the Enter key will only work on given results. If you wish to ignore given results and fire a search query, type your search then just click on the search icon. ### Autocomplete predicts only posts and pages ! Yes, just for now ! I’ll be adding some more cool functions with time. ## Reviews ![](https://secure.gravatar.com/avatar/959edd1ede668787baecadcd03d5a209b0483c71c388d671104ab8fd7b38c41d? s=60&d=retro&r=g) ### 󠀁[Great Works!](https://wordpress.org/support/topic/great-works-21/)󠁿 [ililia](https://profiles.wordpress.org/ililia/) Ogwekkuminebiri (Ntenvu) 16, 2023 Thank you. Nice job. ![](https://secure.gravatar.com/avatar/f15f843ae99b7743319bb3fa0dbd12cffe39198e8e458340185c94464f5496a2? s=60&d=retro&r=g) ### 󠀁[Não funciona nos sistemas IOS](https://wordpress.org/support/topic/nao-funciona-nos-sistemas-ios/)󠁿 [edilson97](https://profiles.wordpress.org/edilson97/) Sseeboaseka 14, 2019 1 reply Tenho o site online mas este plugin não funciona quando o usuario utiliza o sistema opearativo IOS ![](https://secure.gravatar.com/avatar/838a9d87d4bc2a8ed929dc38e38d60010294a79db6f9c126da52622a56a659b8? s=60&d=retro&r=g) ### 󠀁[Great plugin!](https://wordpress.org/support/topic/great-plugin-13626/)󠁿 [roymckrank](https://profiles.wordpress.org/roymckrank/) Kafuumuulampawu 24, 2017 1 reply It just works and adds a great visual effect to the website [ Read all 2 reviews ](https://wordpress.org/support/plugin/full-screen-morphing-search/reviews/) ## Contributors & Developers “Full Screen Morphing Search” is open source software. The following people have contributed to this plugin. Contributors * [ LebCit ](https://profiles.wordpress.org/lebcit/) [Translate “Full Screen Morphing Search” into your language.](https://translate.wordpress.org/projects/wp-plugins/full-screen-morphing-search) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/full-screen-morphing-search/), check out the [SVN repository](https://plugins.svn.wordpress.org/full-screen-morphing-search/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/full-screen-morphing-search/) by [RSS](https://plugins.trac.wordpress.org/log/full-screen-morphing-search/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 3.5 * Updated readme file. #### 3.4 * Corrected file upload #### 3.3 * Add autoComplete.js to plugin. * Force thumbnails size. * Main JS file without jQuery only vanilla JS. * Move .morphsearch-content below autocomplete `