Replace search in The Retailer Theme

Hi @bdpt!

There are two possible ways to replace the default search with the FiboSearch on your website:

• Using a shortcode while editing the page in the visual editor
• Using PHP code while editing theme files

1. If you opt for the first option, the shortcode is as follows:

[fibosearch]

2. Using PHP code allows you to embed the search widget anywhere on the page, including replacing the form provided by the theme. Changes need to be made in two files:

• searchform.php?— allows you to replace the search form used on subpages (this can be replaced optionally)
• header_topbar.php?— allows you to replace the search form used in the top header

It is best to make changes in both files within a child theme so that your changes remain visible even after the theme is updated. If you already have a child theme installed, you can put it in the theme directory prepared by me files, which I sent here. They contain an integration to replace the default search forms, with FiboSearch.
?
Content of the header_topbar.php file:

<div class="gbtr_tools_wrapper <?php echo ( GBT_Opt::getOption( 'sticky_topbar', false ) ) ? 'sticky' : ''; ?>">
    <div class="tr_content_wrapper">
        <div class="topbar_text_wrapper">
        	<div class="topbar_text_content">
				<?php do_action( 'tr_topbar_social_media' ); ?>

				<div class="gbtr_tools_info">
					<span>
						<?php if ( !empty( GBT_Opt::getOption( 'topbar_text', esc_html__( 'FREE SHIPPING ON ALL ORDERS OVER $75', 'theretailer' ) ) ) ) { ?>
							<?php printf(esc_html__( '%s', 'theretailer' ), GBT_Opt::getOption( 'topbar_text', esc_html__( 'FREE SHIPPING ON ALL ORDERS OVER $75', 'theretailer' ) )); ?>
						<?php } ?>
					</span>
				</div>
			</div>
        </div>
        <div class="topbar_tools_wrapper">
            <div class="gbtr_tools_search <?php echo ( GBT_Opt::getOption( 'search_input_style', false ) ) ? 'open_always' : ''; ?>">
				// Adds FiboSearch
				<?php echo do_shortcode('[fibosearch]'); ?>
            </div>

		<?php if ( is_user_logged_in() ) { ?>
			<div class="logout-wrapper">
				<a href="<?php echo get_home_url(); ?>/?<?php echo get_option('woocommerce_logout_endpoint'); ?>=true" class="logout_link"><i class="logout_link_icon"></i></a>
			</div>
		<?php } ?>

		<?php $menu_to_count = wp_nav_menu( array(
			'echo' => false,
			'theme_location' => 'tools'
		));
		$top_bar_menu_items = substr_count($menu_to_count,'class="menu-item ');

		if ( $top_bar_menu_items > 2 ) :
		?>
		<div class="gbtr_tools_account_wrapper">
			<div class="top-bar-menu-trigger">
				<i class="gbtr_tools_menu_icon"></i>
			</div>

		<?php endif; ?>

			<div class="gbtr_tools_account <?php echo esc_attr($top_bar_menu_items) > 2 ? 'menu-hidden' : '';?>">
				<ul class="topbar-menu">
					<?php if ( has_nav_menu( 'tools' ) ) : ?>
					<?php
					wp_nav_menu(array(
						'theme_location' => 'tools',
						'container' =>false,
						'menu_class' => '',
						'echo' => true,
						'items_wrap'      => '%3$s',
						'before' => '',
						'after' => '',
						'link_before' => '',
						'link_after' => '',
						'depth' => 0,
						'fallback_cb' => false,
					));
					?>

					<?php else: ?>
						<li></li>
					<?php endif; ?>
				</ul>
			</div><!--.gbtr_tools_account-->
			<?php	if ( $top_bar_menu_items > 2 ) :?>
				</div>
			<?php endif; ?>
        </div>
    </div><!--.container-12-->

</div>

?Content of the searchform.php file:

<?php
/**
 * The template for displaying search forms in theretailer
 *
 * @package theretailer
 * @since theretailer 1.0
 */

// Adds FiboSearch
echo do_shortcode( '[fibosearch]' ); 

Both files should be placed in The Retailer child theme, for example: /wp-content/themes/theretailer-child/. If you are not familiar with child themes please read the WordPress handbook.

Regards,
Kris