> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# News List

> Configure the News List component to display image-text materials. Learn where to find the feature, switch component styles, adjust the title bar, and configure content.

## 1. Overview

Upload image-text materials and display them as a news list.

## **2. Feature Entry**

\[Select any app] — \[Edit portal] — \[News List component]

## **3. Setup Steps**

Configure the following component attributes to adjust how the component looks and behaves. After adding a news list to your portal, you can:

### 3.1 Switch Component Style

Click **Switch appearance style** to change the component style as needed. Two display styles are currently supported.

### 3.2 Adjust the Title Bar

Control whether to show the title, change the title name, set help tips, and toggle the **View more** option. Once enabled, you must set the redirect URL for **View more**.

### 3.3 Configure Content

Configure the data source for the news list. Two data source types are supported: dynamic and static.

<table>
  <tr>
    <td rowSpan={9}>Dynamic data source</td>
    <td><ul><li>Content source: Select a form under a specific app.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Image: Map to a field in the associated source form, such as the news image.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Main title: Map to a field in the associated source form, such as the main title.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Subtitle: Map to a field in the associated source form, such as the subtitle.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Author: Map to a field in the associated source form, such as the author name.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Date: Map to a field in the associated source form, such as the date.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Link: Map to a field in the associated source form, such as the link.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Filter: After selecting a form, set the data filter for that form.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Number of items: Set the maximum number of news items visible in real time. To view the full list, click **More**.</li></ul></td>
  </tr>

  <tr>
    <td rowSpan={6}>Static data source</td>
    <td><ul><li>Image: Upload a custom image.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Main title: Enter a custom main title.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Subtitle: Enter a custom subtitle.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Author: Enter a custom author name.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Date: Enter a custom date.</li></ul></td>
  </tr>

  <tr>
    <td><ul><li>Link: Set a custom link type. You can open an internal page or an external link.</li></ul></td>
  </tr>
</table>