Comment to 'Search field Needed for Integrating Desktop Search Functionality'
  • Hello. You need to add custom CSS for 'bx-ti-search-box' and 'bx-ti-search-button' classes.

    • This modification can be done manually by editing the JavaScript code in the _header_js_custom.html file,

      // Check the screen width when the page loads
      if (window.innerWidth >= 768) {
          // Function to be called when the page is fully loaded on large screens
          function bx_site_search_page_load() {
              // On large screens, display the search box implicitly and remove the button
              $(document).ready(function() {
                  var $box = $('.bx-ti-search').find('.bx-ti-search-box');
                  $box.addClass('bx-tis-box-shown');
                  $('.bx-ti-search-button').remove();
              });
          }
      } else if (window.innerWidth < 768) {
          // On small screens, define the original function
          function bx_site_search_show(oButtom) {
              var oButton = $(oButtom).parents('.bx-ti-search-button');
              oButton.addClass('bx-tis-button-hidden');
      
      
              var oBox = oButton.parents('.bx-ti-search').find('.bx-ti-search-box');
              oBox.addClass('bx-tis-box-shown');
      
      
              setTimeout(function () {
                  $(document).on('click.bx-site-search-phone touchend.bx-site-search-phone', function (event) {
                      if ($(event.target).parents('.sys-search-results-quick,.bx-ti-search-box,.bx-ti-search-button').length || $(event.target).filter('.sys-search-results-quick,.bx-ti-search-box,.bx-ti-search-button').length)
                          event.stopPropagation();
                      else {
                          bx_site_search_close_all_opened();
                          oBox.removeClass('bx-tis-box-shown');
                          oButton.removeClass('bx-tis-button-hidden');
                      }
                  });
              }, 10);
          }
      }
      

      But it would be preferable if this could be implemented in the admin panel for easier management and accessibility, have a dedicat Search Module:

      Controlling Search Functionality from the Admin Panel:

      Empowering administrators to control the display of the search icon or box directly from the admin panel offers significant advantages. This feature enables administrators to set conditions based on factors such as screen size and user type.

      Enhancing Customization Options:

      Providing customization options allows users to tailor the search box to their preferences. This flexibility ensures that each user can personalize their search experience according to their preferences.

      Adapting to Various Screen Sizes and User Types:

      The feature should accommodate different screen sizes (desktop, mobile, tablet, or app) and user types. This allows administrators to define unique conditions for each scenario, ensuring optimal display based on the device being used and the user type accessing the platform.

      Flexible Preference Configuration:

      Users should have the flexibility to mix and match preferences to meet their specific needs. This capability enables each user to configure the search functionality according to their individual requirements.

      Accessible and Flexible Customization:

      Making these customization options accessible to everyone through the admin panel enhances the accessibility and flexibility of the search feature. It empowers users to create a search experience that seamlessly aligns with their workflow and preferences.

      Control from Admin Panel:

      Administrators should have the ability to control the display of the search icon or box directly from the admin panel. This feature would allow them to set conditions based on factors such as screen size and user type.

      Customization Options:

      By enabling customization options, users can tailor the search box according to their preferences. Providing this flexibility ensures that everyone can personalize their search experience to their liking.

      Screen Size and User Type:

      The feature should accommodate various screen sizes (desktop, mobile, tablet, or app) and user types. This allows administrators to set different conditions for each scenario, ensuring optimal display based on the device being used and the type of user accessing the platform.

      Mix and Match Preferences:

      Users should be able to mix and match preferences according to their specific needs. This ensures that each user can configure the search functionality to best suit their individual requirements.

      Accessibility and Flexibility:

      Making these customization options accessible to everyone through the admin panel enhances the accessibility and flexibility of the search feature. It empowers users to create a search experience that aligns perfectly with their workflow and preferences.

      Additionally, implementing this functionality through the admin panel opens up possibilities for further enhancements. For example, administrators could control filters or integrate third-party modules if the search functionality become a dedicated module. This extends the capabilities of the search feature, allowing for more advanced customization and integration with other tools or services.