Add Content Search to a Site in Oracle Content Management

You can add content search to an Oracle Content Management site with a search page and search field.

To add content search to a site:

1. Add a Search Page to the Site

2. Add a Search Field to the Theme

Add a Search Page to the Site

You can add a search page to a site and a Content List component to the search page.

Add the search page:

1. Add a page to the site and set it as a search page.

2. Add a Content List component to the search page.

3. Set Content Type to the page index content type created previously.

Add a Search Field to the Theme

To make a search field show on every page of a site, you can add the search field to the theme’s layout HTML page.

For example:

<div align="center">
<input  id="searchonpage" type="text" size="30" placeholder="Search on page. . ."/>
</div>

1. Add the input field :

   <script>
       // Get the search field element
       const node = document.getElementById('searchonpage');
       // Get the search string from the url if it exists
       var params = (new URL(document.location)).searchParams;
       var defaultStr = params && params.get('default');
       if (defaultStr) {
           if (defaultStr.lastIndexOf('*') === defaultStr.length - 1) {
               defaultStr = defaultStr.substring(0, defaultStr.length - 1);
           }
           // Display the search string in the search field
           node.value = defaultStr;
       }
       // When enter from the search field, go to the site search page with the search string
       node.addEventListener('keydown', function onEvent(event) {
           if (event.key === "Enter") {
               var inputElem = event.srcElement || event.target;
               var siteSearchPageUrl = 'search.html';
               var searchUrl = SCSRenderAPI.getSitePrefix() + 
                   siteSearchPageUrl + 
                   '?contentType=indextype&default=' + inputElem.value + '*';
               window.location = searchUrl;
           }
       });
   </script>
   

2. Add the JavaScript at the end of the HTML body.