Article listing pages with search and filtering

Article listing and Topic listing pages use components with search and/or filtering functionality, that will dynamically display all SBG Articles, SBG Files, SBG Videos, SBG Images and SBG Podcasts that are associated and published to the current channel.

A variety of different search and filtering options are available for use on the listing pages:

• Article List filter Year Topic – provides the functionality to search and filter by year and topic
• Article List 3 filter Year Topic – provides the functionality to search and filter by year and topic. This is the same as the above one, just with a different display 
• Article List filter Year- provides the functionality to search and filter by year  only
• Article List filter Topic- provides the functionality to search and filter by topic only
• Article List Search Only- provides the functionality to search only (ie has no filtering capability)
• Article Topic List filter Year – has a preconfigured Topic and provides the functionality to filter by year. The preconfigured topic is specified in the 'Heading' attribute of the component

display rules

The search and filtering components are designed to be added to a new page where the content editor would add the Page Title manually. However they can be added to an existing page, in which case the Content Editor would capture a component heading in the Component.Appearance attribute.

The display order is in descending order of the Order/Ranking date. The Release Date  is displayed on the page.

If a Topic filter is used, then on initial load, all topics are displayed and the topics checkboxes will be unchecked/ ie clear.
Users can select/toggle/detoggle an individual Topic, which will execute a new server call upon each click, refreshing the content items returned by the query and displayed on the page. Toggling another Topic will add/remove a topic from the query. Frontend will use a javascript class called ‘Set Interval’ which will allow multiple topics to be selected within a set time period before the server call to the service is made.

When a Year  filter is selected, the query is modified to include the specified Year and a server call is executed to return the new content for only that year.

When Search text is entered and the user clicks ‘enter’ OR the search icon, a search will be executed. If a user clicks on the ‘X’ in the search bar, any search terms entered will be cleared.

Clicking the ‘Clear filters’ button will uncheck ALL the Topic boxes (ie they will become clear), clear the search text and reset the ‘Year filter’ to ‘All’, reloading all the content as per on initial  page load.

Pagination is applied to all search and filtering components. The number of content items to display per page is set by the numItemsPerPage Property, which is found under the Component Presentation Properties tab. This can be configured per component by the content editors.

Component type used

A Smartlist (SL) component is used on the search and filtering pages, to configure the requirements. The actual search and filtering is accomplished using SOLR.

How to use the Search and filtering Smartlist component

• Make sure you have associated your content items to your main article listing or landing page 
• Associate the relevant (ie the ones you used to select the topic for your content) SBG Data Lists to the page or channel. They are used to generate the values for the Topic and Year Filters on your page 
• Drag and drop the relevant Smartlist component template onto the page
• Update the channel name with the exact value of the page where your article and media items are associated
• If required, change the number of articles to display - currently it is set to 9 (you can do this under the Presentation Properties tab - configure the numItemsPerPage property)
• If required, add a Component Heading (to the Component.Appearance attribute).

Refer to the individual sample pages listed above.