Product DocsMenu

Modifying .NET Search Interface CSS Styles

The Coveo .NET Front-End search interfaces use Cascading Style Sheets (CSS) to format the .NET search interface elements. The styles are preconfigured for out-of-the-box .NET search interfaces, but you can modify them to adjust the look and feel of the .NET search interface.

Under the hood, the .NET Interface Editor stores the search interface CSS parameters in the [.Net_Front-End_Path]\Web\Coveo\Skins\[Skin_Name]\CoveoSearch.css file, independently for each search interface.

Note: For more information about CSS styles, refer to the following website page:

To modify .NET search interface CSS styles

  1. Access the Coveo .NET Front-End Interface Editor (see Opening the .NET Interface Editor).

  2. Click the Search Interfaces tab.

  3. On the menu bar:

    1. In the Current Interface drop-down list, select the search interface that you want to modify.

    2. Click the Styles menu.

    The page presents the complete list of all CSS styles used in the search interface.

  4. In the list of styles, locate the style that you want to modify.

    Tip: Use browser developer tools to inspect the search interface element that you want to modify and get its CSS class name. In the list of styles, lookup the class name in the Current Styles column.

  5. Click Edit Style next to the style that you want to modify.

  6. In the Edit Style page for the selected style:

    1. In the available CSS parameters, enter the appropriate values for the aspects that you want to modify.

    2. In the Custom Styles box, you can type one or more valid CSS styles that are not available from the parameters of the page.

    3. Click OK.

Note: A Defaults link appears next to the Edit Style link when a style has been modified so that you can easily revert the configuration back to the default values. The default CSS values are stored in the [.Net_Front-End_Path]\Web\Coveo\Skins\[Skin_Name]\CoveoSearchDefaults.css file.

People who viewed this topic also viewed