- Replace the theme’s search bar with FiboSearch
- Add FiboSearch to menu
- Add FiboSearch with a shortcode
- Add FiboSearch as a widget
- Add FiboSearch to a PHP file
There are 5 ways to add FiboSearch to your website.
If FiboSearch is integrated with your theme, you can automatically replace all theme’s search bars with FiboSearch. For a list of integrated themes see: https://fibosearch.com/documentation/themes-integrations/.
Go to WooCommerce -> FiboSearch -> Starting (tab) and check the ‘Replace all <your theme’s name> search bars with the FiboSearch.’ checkbox. Save the changes.
Go to Appearance -> Menus, choose the menu you want to insert FiboSearch to, add FiboSearch to menu and save the changes. You can also change the layout of the search bar.
You can easily add FiboSearch to your website with a shortcode. There are a few configurations possible:
[fibosearch layout="icon"] will add FiboSearch as an icon
[fibosearch layout="classic"] will add FiboSearch as a search bar
[fibosearch layout="icon-flexible"] will add FiboSearch as an icon for mobile devices and as a search bar for devices with wider screens. The breakpoint can be set in WooCommerce -> FiboSearch -> Search bar (tab) -> Mobile breakpoint (the breakpoint is enabled when Layout is set to ‘Icon on mobile, search bar on desktop’).
[fibosearch layout="classic" mobile_overlay="1"] will add FiboSearch as a search bar but will open an overlay on mobile devices.
[fibosearch layout="icon" class="fibosearch "] will add a CSS class so you’ll be able to style the search bar independently.
Go to Appearance -> Widgets and add ‘FiboSearch bar’ to your website. You can choose the search bar layout:
FiboSearch can be added to your PHP files with the following code:
<?php echo do_shortcode('[fibosearch]'); ?>
You can also use parameters with the shortcode, eg.:
<?php echo do_shortcode('[fibosearch layout="icon"]'); ?>
For supported parameters, see ‘Add FiboSearch with a shortcode’.