Optional: Implementing the Search gadget
Add the Search gadget in your application to search for and then display the contents of a selected article from the search results. The Search gadget supports searching on tags and filtering by categories.
This section contains the following topics:
- Adding the Search gadget in your application
- Optional: Opening the article in a new window
- Applying custom styles to the Search gadget
Adding the Search gadget in your application
You can add the Search gadget anywhere in your application by adding the KMArticleSearchGadget section in the section where you want the gadget to appear.
- Open the section in which you want the gadget to appear, for example, pyCaseMainInner.
- In the target section, add the KMArticleSearchGadget
section, as in the following example:
- Make the section editable. When the section is editable, users can enter text
in the text boxes and select from the drop-down lists in the gadget.
- Hover over the section, and then click the Edit icon.
- In the Cell Properties window, click the Presentation tab.
- In the Edit option list, select Editable.
Optional: Opening the article in a new window
By default, when you click an article from the search results list, the article opens on the right side of the Search gadget (see the example at the end of this topic). Optionally, you can configure the gadget to open the article in a new window.
- Open the KMArticleSearchGadget section.
- In the table in the lower left under the Dynamic Layout section, click the ArticleTitle link.
- In the Cell Properties window, click the
Actions tab.The OpenArticleInGadget activity creates the ArticleGadgetPage page by using the clicked articles in pzInsKey. You can use ArticleGadgetPage as a context page and launch a harness with the ContentViewInArticleGadget section embedded in it.
Applying custom styles to the Search gadget
You can add custom styles using the CSS class in the style sheet to achieve the intended effect. The process is similar to the process for adding custom styles to other user interface elements.
- In the header of Dev Studio, click .
- On the Included styles tab, click Additional style sheets.
- Add your custom style sheet by clicking Add style sheet
as shown in the following example:
Previous topic Configuring Pega Mashup for launching service cases Next topic Optional: Implementing the Add Suggested Article gadget