News list

Use the news list when visitors need grids, simple lists, or tag-driven story browsing.

AEM publisher guidelines

View the component in Figma

Live demo

News List component is not configured.

Readers get a scannable index of articles with optional filters and search so they can narrow by topic, date, or keyword. Content authors choose the list source (curated pages or rules-driven search), the layout, and display options such as cards versus compact rows, “more stories” links, and pagination. The same component supports keyword search that can switch to the site’s search appliance when visitors type a query.

Behaviour

  • Format changes the overall shell: grid, vertical list, faceted sidebar, or landing promo blocks.
  • Search and manual modes pull items differently; limits and grid size interact (see Code).
  • Faceted hubs load mode-specific filters (for example years, authors, or program-specific tags).

Anatomy

  1. Chrome for the chosen format (toolbar, optional search, “more” link).
  2. Story items (cards, rows, or landing tiles) depending on Display as.
  3. Pagination or RSS when enabled.

News list formats (placeholder)

Replace with grid, list, and faceted examples.

Content guidelines

  • Pick Format first; it changes which dialog sections apply.
  • Align search path and tags with how authors tag stories in the repository.

Best practices

Do

  • For Grid, decide Card versus Item based on density and imagery.

Don't

  • Don't enable debug on publish (forced off in script).

When to use

  • News hubs, tagged listings, blog indexes, landing hero blocks, faceted hubs (GradProSkills, JMEC, etc.).

When not to use

  • Single story pages; use the News story template.
  • Events; use Calendar or Featured events.

CRXDE Lite query

Use this query in CRXDE Lite to find instances of this component.

/jcr:root/content//*[@sling:resourceType = 'concordia/components/news-events/news-list/news-list.jsp']

Design and layout options

These map to dialog.xml on the component. The Format field drives which fieldset is relevant; the dialog script manageFieldsNewsList shows or hides Grid options, List options, Faceted search options, and Landing page options.

Build list using

Value Authoring tabs Behaviour
Search Search tab Query searchPath (default /content/shared/en/news if empty), tags (audiences, categories, topics, units), match any tag versus all tags, authors, news types (accolade, blog, article, digest, item, notice, release, story), filter by age (last N months).
Manual list Fixed list tab Ordered pages multifield (paths under /content/shared). Ignores the generic Limit number field in favour of the number of pages picked (see dialog field description).

Format (top-level layout)

Format Output wrapper (key) Role
Grid c-news-list__grid Responsive card or compact item grid; optional toolbar (more link, RSS, show or hide filters).
List c-news-list__list Vertical stack of stories; Display as chooses row template.
Faceted search Faceted layout in format_faceted_search.jsp Sidebar filters depend on Mode (GradProSkills, Public Scholars, etc.).
News landing page c-news-list__landing Hero-style landing blocks (Top news versus More news templates).

Grid format

Field Purpose
Display as news_card (label Card) or news_item (label Item). Options come from grid-scripts/listitem_*.jsp (griddisplayoptions.json.jsp).
Hide date Suppresses date in list item output.
Show label Checkbox; applies to cards only (field description in dialog).
Grid size Columns × rows; sets how many cells are rendered (overrides the generic Limit).
Link page / Link text Optional top-right “more” link (moreLinkPage, moreLinkText).
Search field Shows keyword input in the grid chrome.
Search text Placeholder for that input.
Years dropdown / Months dropdown / Categories dropdown Optional filter controls (months and sort order interact with Thunderstone query params in news-list.jsp).
Sort order dropdown Only when using Thunderstone (field description).

Toolbar: format_grid.jsp can show More link, RSS, and Show filters / Hide filters when any of the search or dropdown options are enabled.

List format

Field Purpose
Display as latest_news, popular_news, or announcements (list-scripts list items; labels Latest news, Popular news, Announcements).
More text Label for the secondary link (default More).
More link Path to “see all” page.

Faceted search format

Field Purpose
Mode Chooses which facet definitions and filter JSPs load: GradProSkills (gps), Public Scholars (authors), Generic (years) (years), JMEC-English / JMEC-French (jmec-en, jmec-fr), CHRCS (chrcs), CTL (ctl).
Tag Path (per mode) When a mode needs a fixed tag root (for example Public Scholars, JMEC), the matching pathfield is shown.

News landing page format

Field Purpose
Display as top_news or more_news (Top news / More news from landing-scripts).
Link text / Link page Bottom-right more link (landingMoreText, landingMoreLink).

Shared (all formats)

Field Purpose
Limit Number of items (1–100); ignored for Grid (grid size wins) and Manual list (per dialog description).
Enable feed / Feed title / Feed URL RSS / Atom hooks.
Show pagination Delegates to pagination.jsp when applicable.
CSS class additionalClass on the outer instance wrapper.

Implementation anatomy

  1. Outer wrapper: div with instanceId and optional additionalClass.
  2. Query layer: JCR QueryService, manual pages, or Thunderstone XML when query is present.
  3. Format shell: One of c-news-list__grid, c-news-list__list, c-news-list__landing, or faceted layout.
  4. List items: grid-scripts/listitem_${gridDisplayAs}.jsp, list-scripts/listitem_${listDisplayAs}.jsp, landing-scripts/listitem_${landingDisplayAs}.jsp.

Instances in the codebase

LocationNotes
apps/concordia/components/news-events/news-list/news-list.jspMain controller.
format_grid.jsp, format_list.jsp, format_landing.jsp, format_faceted_search.jspLayout shells.
grid-scripts/, list-scripts/, landing-scripts/List item templates.
pagination.jspShared pagination.
dialog.xmlAll authoring options above.
ItemLocation
Mainapps/concordia/components/news-events/news-list/news-list.jsp
Display option JSONgriddisplayoptions.json.jsp, listdisplayoptions.json.jsp, landingdisplayoptions.json.jsp (scan listitem_*.jsp and jcr:title on each script).

Thunderstone: If request.getParameter("query") is non-empty, news-list.jsp builds a search.concordia.ca URL with pr, rpp, order, tags, show_on, site id, etc., then parses XML into Page objects.