What's an article highlight?

The Article Highlight component is a visually appealing news view that allows you to add articles to any page.  

Article highlight example

Custom Title

View All Articles
Layout illustration of a section header and card grid

Introducing the New CTA Card Component

Introducing the CTA Card—a flexible, visually engaging component designed to improve usability and emphasize key actions across your website.

4 min read
Layout illustration of a section header and card grid

Introducing the New Icon Card Component

introducing the Icon Card—a flexible, visually engaging component designed to improve usability and highlight key actions across your website.

2 min read
Brand refresh color palette

New Background Colors

We’ve expanded the background color options to provide greater flexibility and elevate the overall look and feel of our websites.

1 min read

Adding an article highlight 

  1. Click the edit link at the top of the page
  2. Move your cursor where you want to place the component.
  3. Click the plus icon.
  4. Select Article Highlight from the menu.
     

Content  

  1. Add a custom Title for your Article Highlight.
    Note: Title field text is limited to 70 characters.
  2. Optional: Feature an article at the top of the list. In the Featured article field, start typing the title. Select the title you want to feature.
  3. Optional: Filter the articles displayed in the view. In the Filter articles by field, start by typing an article type, category, topic, or tag. Select the term.
  4. Optional: Add a link to all articles. To find a list of all the articles, enter your website and add /articles/search at the end of the path (e.g. medschool.ucla.edu/articles/search).
  5. Filter the articles by categories and/ or topics.
  6. Copy and paste the filtered search URL into the URL field.
  7. Add Link Text for the URL.
    Note: Link text is limited to 45 characters. 

Save

  1. Click Save.
  2. Scroll to the top of the page and click Save.
  3. Click the Done button beside the save button.
    Note: This will display the page in the closest representation of how site visitors will view it. All links and actions that are disabled in editing mode will be functional now

One-Column Article Example

View All Articles
Layout illustration of a section header and card grid

Introducing the New CTA Card Component

Introducing the CTA Card—a flexible, visually engaging component designed to improve usability and emphasize key actions across your website.

4 min read
Layout illustration of a section header and card grid

Introducing the New Icon Card Component

introducing the Icon Card—a flexible, visually engaging component designed to improve usability and highlight key actions across your website.

2 min read
Brand refresh color palette

New Background Colors

We’ve expanded the background color options to provide greater flexibility and elevate the overall look and feel of our websites.

1 min read