Set Custom Search Widget Options

Prev Next

This article will show you how to create a custom search widget to use on a page.

Who can use this feature?

System Administrators | Owners

Instructions

  1. Navigate to Modules > Site Tools > Design Center Modules and site tools, design center.

  2. Select Widget Manager Widget manager option.

  3. Select Search Select the Search option.

  4. Click the + icon Select the plus icon.

  5. Type in the name for your option set Type the name for your option set.

    Note:

    We recommend that you name based on where you plan on using it. For example, Home - Search..

  6. Select Create Option Set Create option set button.

  7. The Search Widget option box will appear for customization

    • Header Header option.

      • Display Header: Check this if you would like the header to be displayed

      • Text: This allows you to set the header text

      • Image: Choose the image you would like to appear in the header

    • Box Box option.

      • Helper Text: This will display in the search box until someone starts typing

      • Helper Text Color: This allows you to customize the color

      • Search Box Text Color: This allows you to customize the text color

      • Styles: This allows you to set the style in the box using CSS

    • Button Button option.

      • Text: This allows you to customize the text on the button

      • Image: This allows you to choose a search image

      • Hover Image: This allows you to choose the search image that appears when you hover over the search

      • Position: This Allows you to choose where the search button appears in the search box

      • Styles: This allows you to set the style in the button using CSS

    • Behavior Behavior option.

      • Enable Department-Only Search: This allows an option to search by department

      • Label Color: This allows you to customize the color of the search

      • Label Offset: This allows movement of the widget display

      • Styles: This allows CSS

  8. Click the Save button:Save button.