News search and filter

Using this component

Do

• Use on landing pages to list large amounts of news articles with the ability to search and filter them.
• Limit other components on your page. The page should mostly be dedicated to the News search and filter component. If you add other elements to the page, such as a summary or call out, position the News search and filter component last on the page.

Don’t

• Add more than 1 News search and filter component to your landing page.

How to add the component to your landing page

To add the News search and filter component to your landing page:

1. Create a new full width section and click Add block.  
2. In the Choose a block screen, search for News Search & Filter and select the component from the search results. The Configure block screen will open and you can adjust the settings.
3. Title field: this can be left with the default text or customised. The title won’t be visible publicly.
4. General accordion:
   • The Filter title will appear at the top of the left side column above any other filter categories that turn on.
   • Tick the Show images checkbox to have all of the news articles listed with their accompanying images. You can still choose to show images, even when not all of your news articles have images attached as this component will adapt. 
5. Result listings accordion:
   • The Results display can be left with the default text of ‘Showing {RANGE} of {TOTAL} results,’ which will display as ‘Showing 1 - 10 of 540 results,’ for example. It will show at the top of the news listings results.   
   • The No Results Message can be customised or you can leave the default message.
   • In Content types tick the checkboxes for all the types of articles that you would like to be captured in your news listing.
   • In the Agency field you can either leave this field blank or add an agency to show articles from that agency.
   • In the Topic field you can either leave this field blank or add topic to show articles tagged with that topic. If you add both an agency and a topic this will limit the search results to only articles that include both tags – articles with only one of the tags will not be shown.
6. Keyword accordion:
   • The Keyword Label can be customised or remain with the default text. It will appear at the top of the left side as a search field for customers to search articles by keyword.
   • The Input placeholder is where text can appear within the search bar, for example ‘search for news articles’. It can remain blank.
7. Content type filter accordion:
   • By ticking the Show content type filter checkbox, you will enable the filter option of article type. You should tick at least 2 article types in this section and in the above Result listings accordion if you enable this filter option.
8. Tag filters accordion:
   • If your news articles have been tagged with additional tags you can add an additional filter option in this section. For example, if your news articles have used the Category tag field, available in the new article template, you can add this as a filter option. In the Vocabulary field you would search for the tag ‘Category.’
   • In the Terms field search and select the tags that you added to your news article. For example if you used the ‘Category’ tag field in your news articles and applied the tag ‘Awards and events’ you would add this in the Terms field.
   • You can add more tag filters.
9. Date range accordion:
   • By ticking the Show date range checkbox a date range selector will automatically populate as a filter option with a To and From fields with a calendar selector option.  
10. The Node field can be left on the default setting.
11. Click the Update button.

How this component displays 

Live agency news pages

• NESA news page
• Ministerial media releases

Example of the component

The example below shows how the News search and filter component displays with the following filters applied:

• images set to display
• the agency set to Department of Customer service
• the date filter turned on
• all article types selected to be shown
• all article types set to be included as a filter option.