Build a Search Page and Configure Modules

The main page of the Site Search app is the Search page. During development of a search app, perform searches on this page to see what results the searches return. Then tune the configuration and try again, until searches return the results you want.

You can change the content, layout, and appearance of the Search page:

  • Result templates – Control what contents appear on the Search page, and the layout of the page contents.

  • Logo – Brand your search app with a logo.

  • Modules – Arrange and configure modules to specify what functionality is present in the Site Search app.

    To provide Site Search functionality on your website, you embed modules in web pages.

For all development and management tasks other than searching, display the Site Search menu. In the upper left corner, click Edit.

Before you begin

Before you design the Search page, you must:

  1. Create datasources.

  2. Map fields. This is one of the steps in creating a data source.

Use result templates

Result templates control what contents appear on the Search page, and the layout of the page contents.

These are the types of result templates:

Result Template Description

Webpage

Web pages (file type html or htm) that a Web crawler data source indexes

File

A result template that contains fields for typical file metadata

Person

Files that contain information about people

Generic Item

Files that are indexed, but that don’t use other result templates. Files that a CSV (file type csv) or JSON (file type json or jsn) data source indexes use this result template by default.

Note
Add and configure data sources before working with result templates.

Select result templates for data sources

Site Search chooses the best result template based on your data source. If you want to choose a different result template, you can.

Tip
For a data source that contains information about people, you must choose the People result template manually.
To select a result template for a data source
  1. In the Site Search menu, click the data source.

  2. Click the Display tab.

  3. Choose a result template.

    In the space below the Edit Template button, you see how a search result appears using the selected template. Click Next and Prev to view different search results.

Tip
If this space is empty, you must either select a different result template, or you must make other choices for elements and custom fields and/or map fields differently.

Edit result templates

Edit result templates to change the appearance of result lists.

To edit a result template
  1. Open the Site Search menu – In the upper left corner of Site Search, click Edit.

  2. Click Result Templates. An example of a search result is in the center of the page. Click Next and Prev to view other examples.

    Tip
    If this space is empty, you must either select a different result template, or you must make other choices for elements and custom fields and/or map fields differently.
  3. Click a result template.

  4. Specify the document elements and custom fields to display.

    Elements and custom fields

    Setting Description

    Elements

    Names of fields that Site Search has chosen for you to include in search results. You can unselect the field names to exclude the fields.

    Custom fields

    Names of other fields that you can choose to include in search results

  5. Change the appearance of fields. Hover over the field and click Edit field]. Available settings differ based on the type of field. Settings are:

    Setting Description

    Label

    An optional label for a field

    Field Style

    Select appropriate styling for the field. For a label field, select Label Left, Label Above, or Label Inline. Or select Description, Title, URL, or Image.

    Image Position

    Whether an image is displayed Inline or floats to the Right or Left.

    Date Format

    Format for a date field

    Number Format

    Format for a numeric field

    Max Characters

    Maximum number of characters

    Default Value

    Default value to display when a field lacks a value

    URL Field

    Name of a field that contains a URL

    Add a query filter when the field is clicked

    Add a query filter when the field is clicked.

    For example, if the result template includes the field language and the checkbox for this setting is selected, then a user can click a language value in a result. Doing so adds a query filter for that language to the query, which filters the result list by that value. A breadcrumb is added for the clicked value, if the Results module is configured to show breadcrumbs.

    Note
    This setting has no effect for fields with the field style URL.
Note
The Display tab for a data source has an Edit Template link that brings you to the page for editing the result template for the data source.

Lay out the Search page

Choose among several page layouts for the page that displays a list of search results.

Page layout

To lay out the Search page
  1. In user mode, search for something. The Search page appears.

  2. Open the Site Search menu – In the upper left corner of Site Search, click Edit.

  3. Hover over the page.

  4. At the bottom of the page, click Page Settings.

  5. Select a column layout.

  6. Click Apply.

Tip
You can change the page layout after adding modules. If you do, you might need to move modules.

The Site Search app uses the Lucidworks logo by default. To brand your Site Search app, you can specify a different logo.

Tip
Site Search scales the image you provide to fit in the upper left corner of the page. A logo with pixel dimensions of 440 pixels wide x 64 pixels high works well. Logos that have approximately the same aspect ratio (6.875:1) will also work. Site Search scales images that are roughly square to have a 64-pixel height. Scaling doesn’t always preserve the aspect ratio of the source image.
To specify a logo
  1. In the Page Builder, hover over the page.

  2. At the bottom of the page, click Page Settings.

  3. Click the Look and Feel tab.

  4. Under Logo, click Choose File. Navigate to the file you want to use, and choose it.

  5. Click Apply.

Colors and logo

Manage modules

In this section, we explain how you can place modules on the Search page and configure them.

You can embed modules in the web pages of your websites.

The starting point for managing modules is the Page Builder. In the upper left corner, click Edit.

Types of modules

Modules are the UI components that display search results, as well as other results that are not based directly on a search, for example, recommended documents. Some modules let users interact with results. For example, the Facets module lets the user facet search results.

You can use these types of modules on the Search page:

Module Description

Results

Display a list of results from the current search.

Facets

Let users select subsets of the search results. Facets are field-based groups of search results. For example, if the department field is chosen as a facet, then users can click the facets computers, appliances, and so forth to view those subsets of search results.

Search Box

Users enter search queries in search boxes.

Topic Tabs

Display a tabbed navigation element based on topics.

More Like This

Display search results that are similar to the top result. This is a smart panel that adds intelligence to search and browsing experiences.

Note
To use a More Like This smart panel, the data source must have a description field (or a field that you map to description).

Add modules

Add modules you want to the Search page.

Module choices

To add modules
  1. In the Page Builder, hover over the page.

  2. At the bottom of the page, click Add module.

  3. Drag a module to where you want it to be on the page. A gray box appears. Drop the module in the box.

    If a gray box doesn’t appear, you might need to change the layout of the Search page.

Configure modules

You can configure modules. The configuration settings differ from module to module. For example, in a Facet module, you can specify the facet field or fields, display names, and advanced options.

Module configuration has two parts:

  • Edit Module – In the Page Builder, hover over the Search Box module, and then click Edit module.

  • Embed Module and editing the embedded code – In the Page Builder, hover over the module you want to embed. Click Embed Embed module. Copy the embeddable code as indicated in the dialog box.

These are the configuration settings for Edit Module. For Embed Module configuration settings, see Embed modules.

Module Configuration settings

Search Box

Show Suggestions?

Show suggestions below the Search Box while users type queries. Choose among showing Documents, Query Completion, and No Suggestions. Site Search finds suggestions by autocompleting what the user types and using those terms as queries.

Search Box

Default Search Language

Default language in which to search if no search language is specified in a Search Box embedded module.

Search Box

Action

URL of page on which to display search results (if a different page). When an embedded Search Box module obtains results, Site Search redirects to this page.

Topic Tabs

Tabs present, their order, and optionally the tab names

Results

Results per page

Results

Show Breadcrumbs?

When enabled, Site Search displays breadcrumbs at the top of the result list – one breadcrumb for the search query and additional breadcrumbs for selected facets. We recommend that you enable breadcrumbs. With breadcrumbs enabled, a user can easily deselect facets (by clicking those breadcrumbs) and/or return to all search results (by clicking the breadcrumb for the search query).

Results

Show Spellchecking?

When enabled, Site Search displays Spellchecking and Did You Mean results after a user searches.

Results

Display as Cards

Select a number of cards per row to display results as cards.

Facets

Facet field names and optional display names. Advanced configuration settings include:

  • Show – Number of facets to show initially. This is a maximum. If there are fewer facets, then only those are displayed.

  • Show More – Number of additional facets to show when a user clicks the Show more control

  • Show More Label – Label that the user clicks to show more facets. The default is Show more.

  • Show Less Label – Label that the user clicks to display fewer facets. The default is Show less.

More Like This

Results To Show

To configure modules (Edit Module part)
  1. In the Page Builder, hover over a module on the page. The Edit Embed Delete Move control appears at the upper right of the module.

  2. Click Edit module.

    For a Facets module, you can also click this image, which is present when facets haven’t been configured:

    Configure facets

To configure modules (Embed Module part)

Modify the code that you embed in web pages. For more information, see Embed modules in web pages.

Move modules

Move modules around on a page to redesign the page.

To move modules
  1. In the Page Builder, hover over a module on the page.

  2. Click-and-hold Move module.

  3. Drag the module to where you want it to be. A gray box appears. Drop the module in the box.

    If a gray box doesn’t appear, you might need to change the layout of the Search page.

Delete modules

Delete modules that you no longer need.

To delete modules
  1. In the Page Builder, hover over a module on the page.

  2. Click Delete module.

  3. Click Delete to confirm the deletion.

Next steps