> For the complete documentation index, see [llms.txt](https://bai-da-shuspersonal-organization.gitbook.io/2025wmg/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bai-da-shuspersonal-organization.gitbook.io/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/3.0-sai-hui-xiao-xi/3.1-zui-xin-xiao-xi-lie-biao.md).

# 3.1-最新消息(列表)

### Meta Data設定

<table><thead><tr><th width="171">項目</th><th width="438">內容</th><th>備註</th></tr></thead><tbody><tr><td>頁面簡述</td><td>列出世壯運賽事各分類最新訊息列表</td><td></td></tr><tr><td>網址URL<br></td><td>/news</td><td></td></tr><tr><td>【頁籤名稱】 網址</td><td>Ｘ 無頁籤</td><td></td></tr><tr><td>Page Title</td><td>最新消息列表｜2025雙北世界壯年運動會</td><td></td></tr><tr><td>Page Description</td><td>在2025年世界壯年運動會最新消息列表頁面中，您可以隨時獲取賽事的最新動態與公告。頁面提供消息不分類的切換功能和關鍵字搜尋，方便使用者快速找到所需資訊，確保不錯過任何重要更新。</td><td></td></tr><tr><td>OG Image設定</td><td>使用全站用<a href="/2025wmg/fu-lu-qing-dan/quan-zhan-meta-data-she-ding-qing-dan.md#og-image">OG:Image</a></td><td></td></tr></tbody></table>

{% hint style="info" %}
完整清單，請點選前往[全站Meta Data設定清單](https://docs.google.com/spreadsheets/d/1mbYNsNVQGtUAlDKejE4DphAiQwHbe40KvPUrDCuWGIw/edit?gid=150750486#gid=150750486)
{% endhint %}

***

### 功能簡述

{% hint style="info" %}

* 透過列表形式，彙整2025世壯運賽事活動的各種類最新訊息，使用者可以瀏覽列表，並點選特定訊息進入瞭解更多詳細內容
  {% endhint %}

### 設計規格

<figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FxAVu6Zo7pSlptZHNdgkH%2FFrame%20627160.png?alt=media&amp;token=4febe4ae-0f12-4189-a8a9-f1320c0030da" alt=""><figcaption></figcaption></figure>

1. **篩選＆搜尋功能列**

   <figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2F3jjXDRdfVsTeAZEsoeGR%2FFrame%20627197.png?alt=media&amp;token=c9f2a3a4-8f3d-4274-8132-fa8ce1a2efb5" alt=""><figcaption></figcaption></figure>

   1. 針對所有『最新消息』中消息分類欄位，進行篩選分類
   2. 當選擇特定消息分類下拉選單後，列出該消息分類的最新消息元件列表
   3. 消息分類下拉選單
      1. 項目內容：
         1. 全部
         2. 競賽資訊
         3. 贊助資訊
         4. 新聞稿
         5. 活動資訊
         6. 其他
      2. 預設項目：全部
   4. 關鍵字搜尋列
      1. 搜尋範圍：
         1. 以最新消息元件中的「標題文字」為搜尋範圍，進行模糊比對搜尋
         2. 符合結果的消息元件顯示於下方列表
      2. 若搜尋關鍵字無相符內容時，顯示[搜尋無符合結果狀態頁面](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/3.0-sai-hui-xiao-xi/3.1-zui-xin-xiao-xi-lie-biao/zui-xin-xiao-xi-lie-biao-sou-xun-wu-fu-he-jie-guo-zhuang-tai.md)
   5. 篩選結果數：
      1. 列出符合篩選條件的總數，如：共45則
   6. 主要規格，請參照[篩選＆搜尋功能列](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/quan-yu-xing-gong-neng/shai-xuan-sou-xun-gong-neng.md)<br>
2. **最新消息元件**

   <figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FIiDisKnojUGFW4RdQhW1%2FFrame%20627161.png?alt=media&amp;token=63cb8b27-52ce-4553-a24e-4c7cd1fcd6b4" alt=""><figcaption><p>最新消息元件＆縮圖墊檔圖</p></figcaption></figure>

   1. 元件組成：
      1. 消息縮圖：帶入文章的縮圖圖片，若後台無上傳，自動帶入墊檔圖片
      2. 分類標籤：帶入文章所屬消息分類
      3. 發布日期：顯示年月日，如：2024.03.27
      4. 標題文字：
         1. 標題文字超過指定行數，顯示「...」\
            桌機版＆手機版指定兩行
   2. 點擊元件前往相對應[3.1.1-最新消息內頁](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/3.0-sai-hui-xiao-xi/3.1-zui-xin-xiao-xi-lie-biao/3.1.1-zui-xin-xiao-xi-nei-ye.md)
   3. 訊息元件列表排序，依據 『發佈日期』 ，由最新至最舊排序<br>
3. **頁次切換列**
   1. 每頁最多**9**則最新消息訊息，超過9則可切換次頁
   2. 相關規格，[參照頁次切換列規格](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/quan-yu-xing-gong-neng/ye-ci-qie-huan-lie.md)

### 連結設定

<table data-full-width="true"><thead><tr><th width="177">區塊</th><th>連結圖片示意</th><th>開啟形式<select><option value="s30xPWWMdFV6" label="同頁開啟" color="blue"></option><option value="fBJ57gNPKSqQ" label="另開新頁" color="blue"></option></select></th><th>連結設定</th><th>備註</th></tr></thead><tbody><tr><td>消息元件</td><td><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FgtDJPVPgmxJmgqsgq7Cq%2F%E6%88%AA%E5%9C%96%202024-11-19%2014.12.31.png?alt=media&amp;token=2e591a30-8d02-4c68-8999-05643ef2982d" alt="" data-size="original"></td><td><span data-option="s30xPWWMdFV6">同頁開啟</span></td><td>連結至相對應消息內頁<br>/news/<mark style="color:red;">{yyyymmdd}</mark></td><td>前往<a href="/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/3.0-sai-hui-xiao-xi/3.1-zui-xin-xiao-xi-lie-biao/3.1.1-zui-xin-xiao-xi-nei-ye.md">3.3.1-最新消息內頁</a></td></tr></tbody></table>

{% hint style="info" %}
完整連結(含無障礙設定)，請參考[3.1-最新消息列表連結設定](https://docs.google.com/spreadsheets/d/1mbYNsNVQGtUAlDKejE4DphAiQwHbe40KvPUrDCuWGIw/edit?gid=1873817107#gid=1873817107)
{% endhint %}

### UI設計檔

{% embed url="<https://www.figma.com/design/GO84awYAhcTLDEkhRZCfXm/2025%E4%B8%96%E7%95%8C%E5%A3%AF%E5%B9%B4%E9%81%8B%E5%8B%95%E6%9C%83%E5%AE%98%E7%B6%B2_%E5%AE%A2%E6%88%B6%E6%8F%90%E5%A0%B1%E4%BD%BF%E7%94%A8?node-id=7101-208005&t=62dZpnUGpA4NzNe1-1>" %}

***

### 修訂記錄

<table data-full-width="false"><thead><tr><th width="79" data-type="number">序號</th><th width="121">修訂時間</th><th width="300">主要修改內容</th><th width="142">修訂來源</th><th>備註</th></tr></thead><tbody><tr><td>1</td><td></td><td></td><td></td><td></td></tr></tbody></table>