Customise a search result for multiple content types

Managed by | Updated .

Prerequisites

Objective

Customise a search result to have a different display for each content type. In this example we will customise the result for a page Page, Profile and FAQ view.

Steps

1. Upload result.ftl

  1. Load the Funnelback administration interface and select the the collection (search interface) you would like to customise.    
  2. Open the file manager.                
    1. Select Administer tab > Browse Collection Configuration Files
  3. Upload result.ftl file.                
    1. Under Presenation (preview) section select Choose File and select the result.ftl file saved on your computer.                        

2. Import Result Template into Simple.ftl

  1. Under Presenation (preview) section select simple.ftl for editing.
    This is the main search template file which handles the display of the entire search interface.        
  2. At the top of the file add this line after the existing imports.
    <#import "result.ftl" as Result/>
    This imports our new template libaray into the current file.    
  3. Locate the results block (the code between <@s.Results> and </@s.Results>).
    Tip: To quick find the result block click within the file edit and press Ctrl(control)+f or mac ⌘(command)+f and search for s.Result.        
  4. Delete all the code within
    <li data-fb-result=${s.result.indexUrl}>
    and replace with the following code.
    <@Result.ResultRoute />
    This code calls the ResultRoute marco provided within result.ftl.    
  5. Click Save and publish.    
  6. Open the search page result and see how the result view has now changed and displays the text "Customise your result format for each content type!" repeated for each result.    

The provided result.ftl includes a few pre implemented macros;

  • IsContentType - This is used to test the condition for the result content type.
    Note: i have this mapped to the metadata field contentType but this could be set to any metadata field required to test against.        
  • Result Route - This is an empty marco which you will configure in the next set "Define your result formats". This marco will be used to define the conditional logic for which result format to display.        
  • Page,Profile, FAQ - These are the result formats that will be used when the matching condition is met within the ResultRoute macro.        

3. Define your result formats

  1. Under Presenation (preview) section select result.ftl for editing.    
  2. Replace the code within the ResultRoute marco with the following.
    <#-- Page -->
    <@IsContentType name="Page">
    <@Page />
    </@IsContentType>

    <#-- Profile -->
    <@IsContentType name="Profile">
    <@Profile />
    </@IsContentType>

    <#-- FAQ -->
    <@IsContentType name="FAQ">
    <@FAQ />
    </@IsContentType>
    This code will route the search result for to use the correct display for the corresponding content type.        
  3. Click Save and publish

4. View & Test

  1. Go to the result page an view the new result format for results.    

Working Example

See end result..

Was this artcle helpful?

Tags
Type:
Features: Frontend > Templating Frontend > Freemarker

Comments