Site Search Button Implementation in SuiteCommerce

The Site Search button offers SuiteCommerce users a straightforward way to access the Site Search input bar, improving navigation on the platform. This feature, visible by default in the SuiteCommerce Base Theme, enhances the user experience across both desktop and mobile templates.

How to Implement the Site Search Button

To implement the Site Search button in your SuiteCommerce theme, you will need to add specific code snippets to the appropriate templates.

Desktop Implementation

For desktop users, you can integrate the Site Search button using the following HTML code:

<div class="header-menu-search" data-view="SiteSearch.Button"></div>

• Base Theme Module: Header
• Base Theme Template: header_menu.tpl

Mobile Implementation

For mobile compatibility, use the following HTML snippet:

<div class="header-menu-searchmobile" data-view="SiteSearch.Button"></div>

• Base Theme Module: Header
• Base Theme Template: header.tpl

This coding approach ensures backward compatibility with any Commerce themes created prior to the 2018.2 release.

Best Practices for Usage

• Ensure the button is prominently displayed to increase user interaction.
• Test the functionality on both desktop and mobile views to maintain a seamless user experience.

Incorporating the Site Search button into your SuiteCommerce environment facilitates smoother navigation and enhances the overall usability of your site, ultimately leading to improved customer satisfaction.