Component overview

This article describes the "Search" WebPart component that allows you to provide a search bar pointing to the native Office365 search results page, or to search content with different search verticals and refinements. 

This component is now obsolete and will not be available by the end of 2023. We recommend using the Mozzaik365 Search Center instead.

Add the component

1. If you are not already in edit mode, click on edit at the top right of the page.
2. Position the mouse pointer over or under an existing Web Part or under the title area and click the + button, then select the Search Web Part.
3. Click Edit Items on the left to set the options for the Web Part.

Web Part options

Type of request

The component has 3 modes of use:

• Link to the SharePoint search page
• Display of results in the component
• Link to a specified page

Result source

The options allow you to choose the source of the results:

• All sites
• The current site
• A list of sites

If the scope is different from the current site, the site of origin is displayed on the visual.

Show result sources: this option allows you to customize the result sources. The use of this option is described further below.

Page Contact: Choose the property used to display the person(s) related to the item:

• Hide
• Author
• Edit by
• Customize

Page Date: Choose the property used as the date for the element:

• Hide
• Date published
• Date modified
• Date created

Third party API (Beta)

This feature is currently in beta version and is therefore not final. It allows you to add external sources of results. You can find more information about this feature by clicking on this link: Add and use a third party API . 

Search bar

Whatever the mode of use, the search bar of the component is completely customizable as in all other components with a search bar.

• Hide the search bar
• Search bar only
• Background color (a color, an image or transparent)
• Title color.
• 3 types of search bars are possible (dark, light, grey)

View

• Display search suggestions
  
  
  
  
  
• Display all results when the user has not performed a search
• Choose to open in a new tab
• Results to be displayed per page

Refinements' panel

The refinement panel allows you to define filters that can be activated by the user. In the Refinements' Panel section of the component settings, select Show Refinements' Panel to make it appear. 

The panel has default refinements: file type, author and creation date. It is possible to disable or add new ones.

Displaying the refinement panel

Editable list of refinement panels

Creating a refinement

When adding a new refinement, indicate the desired title as displayed in the refinements' panel, then indicate the SharePoint property to which to link it.

For taxonomy properties, simply indicate that the property is a taxonomy and then choose the property from the drop-down list of taxonomies on the site. For all other properties, indicate the name of the SharePoint search service managed property (advanced user).

Result sources

The result sources allow you to define different result origins. In the SharePoint Result Sources section of the component settings, select Show Result Sources to display them.

The default result sources are: All, People, Images, Videos.

It is possible to remove or add new ones, reorder them or modify them.

The visible number of result sources is also configurable.

When adding/modifying a result source, it is possible to define:

• The title of the tab
• The result source. Set in SharePoint, it is the result source that contains the filters indicating which items are returned
• The order of the items displayed. In the form {property}:{order},{property}:{order},.... For example Title:ascending,Rank:descending will sort first alphabetically by title and then by descending rank

Visuals

As in the various Jint components that do content escalation, it is possible to choose the visual used. To do this, go to the Themes section of the component settings and choose the desired visual.

To see the advanced settings: Link to the page here. 

Example of use

Add the component on a page and select the display of the search results in SharePoint thanks to the control panel. Then indicate whether the search is performed in the current site, in the entire tenant, or on a specified collection of sites (then enter its URL) in the search scope selection box.

When the user enters a search, the native search page will be opened. Very useful to highlight the search in a site, since users would normally not think of using it.

How it works in the search center

Select the display of search results in the component. Other options are then available:

• The scope of the search, as with the previous operation, by choosing whether the search is performed in the current site, in the entire tenant, or on a specified collection of sites
• The number of results to display per page
• The visual display of the search results
• In the case where the search is done on the whole tenant, it is possible to set up search verticals. This rather technical element is explained next, but requires a good knowledge of SharePoint to set up if the display of the refinement column is desired and the refinements to use

Example of layout