南市校網申請平台

無障礙校網建置
=======

<div class="card bg-light border-0 shadow-sm p-3">? 系統官方建議設定值：

<div class="d-flex flex-column gap-2"><span class="fs-5">? **預設狀態：** <span class="text-danger fw-bold">關閉</span></span> <span class="fs-5">? **區塊位置：** <span class="text-primary fw-bold">左側或右側區塊</span>（側邊欄收納首選）</span> <span class="fs-5">? **顯示頁面：** <span class="text-primary fw-bold">全部頁面</span></span></div> </div> </div> </div> </div><div class="container-fluid my-5 border-bottom pb-4"><div class="row g-4 align-items-center mb-4"><div class="col-12 col-lg-4 text-center"><div class="ck-img-block-v2">![標籤連結區塊詳細參數設定](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/261.png)</div> <small class="text-muted d-block mt-2">? 點擊圖片可放大檢視後台參數配置</small></div><div class="col-12 col-lg-8"><div class="p-4 bg-white border-start border-4 border-dark shadow-sm rounded">### ⚙️ 後台參數配置指南

管理員可於後台針對標籤整合欄位進行以下參數配置。

</div> </div> </div><div class="row g-4"><div class="col-12 col-md-6 col-lg-4"><div class="card card-equal-height bg-white border-0 shadow-sm border-start border-4 border-primary p-3">? 1. 顯示標籤（限制單選）：

系統會自動全局撈取並列出各種類型頁面已建立的標籤，\*\*此欄位僅支援「單選」機制\*\*，以便精準鎖定特定宣導主題。

</div> </div><div class="col-12 col-md-6 col-lg-4"><div class="card card-equal-height bg-white border-0 shadow-sm border-start border-4 border-success p-3">? 2. 數量（筆數配置與畫質最佳化）：

<div class="fs-6 text-muted">? **使用「下拉選單」時：** 為了避免底層連結顯示不全，**強烈建議將數量數值設定為大於該標籤實際連結的總內容數**。

? **使用其他模式時：** 請評估前台排版適量填寫即可，避免清單過長佔用大篇幅版面。

</div> </div> </div><div class="col-12 col-md-12 col-lg-4"><div class="card card-equal-height bg-white border-0 shadow-sm border-start border-4 border-info p-3">? 3. 顯示模式（三大主要風格類型）：

<div class="fs-6 text-muted">? **圖示顯示：** 限制僅用於外部連結頁面類型。

? **下拉選單：** 精簡且極度節省網頁空間的緊湊風格。

? **標準與主題選單：** 內建多款精美色調選單。  
 <span class="badge bg-warning text-dark mt-1">♿ 無障礙高對比推薦</span>  
 後台特別內建帶有 **AAA 字尾的專用高對比色彩主題**（如 `海洋藍AAA `、 `森林綠AAA ` 等），完全符合數位無障礙標章規範要求。

</div> </div> </div><div class="col-12 col-md-6 col-lg-6"><div class="card card-equal-height bg-white border-0 shadow-sm border-start border-4 border-secondary p-3">? 4 & 5. 是否顯示框線 / 圓角開關：

這兩個細緻的微調邊框開關**僅適用於「一般選單類型」**的主題風格，可依校園整體網頁視覺美感或線條語意決定是否啟用。

</div> </div><div class="col-12 col-md-6 col-lg-6"><div class="card card-equal-height bg-light border-0 shadow-sm border-start border-4 border-warning p-3">? 6. 圖示顯示行列折行計算公式：

當選擇使用「**圖示顯示**」並欲精準控制前台橫向排列行數時，行列數需交叉計算：  
 <span class="text-primary fw-bold">? 實算範例：</span>若設定**一行出現 4 個圖示**，而希望在前台完整呈現出 **2 行** 的排列效果，上方的**「數量」欄位就必須對應填寫 8**（4 × 2）。

</div> </div> </div> </div><div class="container-fluid my-5 pb-4"><div class="p-3 bg-light rounded shadow-sm mb-4 text-center">### ?️ 前台兩種核心呈現效果實體外觀對比

</div><div class="row g-4"><div class="col-12 col-md-6"><div class="card card-equal-height bg-white border-0 shadow-sm p-3 text-center"><div class="ck-img-block-v2 mb-3">![下拉選單顯示模式前台範例效果](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/262.png)</div><div class="text-start px-2">▶️「下拉選單」模式

使用者點擊選單後才會向下展開完整清單。在有限的網頁側邊欄（左側或右側區塊）空間中能達到極佳的收納效果，適合用來放置連結筆數較多的標籤群組，維持頁面乾淨度。

</div> </div> </div><div class="col-12 col-md-6"><div class="card card-equal-height bg-white border-0 shadow-sm p-3 text-center"><div class="ck-img-block-v2 mb-3">![圖示顯示模式前台範例效果](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/263.png)</div><div class="text-start px-2">▶️「圖示顯示」模式

每一個標籤內容都會直接化為具備圖形化視覺的獨立橫向按鈕，配合滑鼠懸停放大效果，非常適合用於重點政令宣導專區、重要主題政策或是常用快捷入口等強烈視覺導向的網頁區塊。

</div> </div> </div> </div> </div><div aria-hidden="true" class="modal fade" id="imgNModal260" tabindex="-1"><div class="modal-dialog modal-dialog-centered modal-lg"><div class="modal-content bg-transparent border-0"><div class="modal-body p-0 text-center position-relative"><button aria-label="Close" class="btn-close btn-close-white position-absolute top-0 end-0 m-3" data-bs-dismiss="modal" type="button"></button>![放大圖片260](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/260.png)</div> </div> </div> </div><div aria-hidden="true" class="modal fade" id="imgNModal261" tabindex="-1"><div class="modal-dialog modal-dialog-centered modal-lg"><div class="modal-content bg-transparent border-0"><div class="modal-body p-0 text-center position-relative"><button aria-label="Close" class="btn-close btn-close-white position-absolute top-0 end-0 m-3" data-bs-dismiss="modal" type="button"></button>![放大圖片261](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/261.png)</div> </div> </div> </div><div aria-hidden="true" class="modal fade" id="imgNModal262" tabindex="-1"><div class="modal-dialog modal-dialog-centered modal-lg"><div class="modal-content bg-transparent border-0"><div class="modal-body p-0 text-center position-relative"><button aria-label="Close" class="btn-close btn-close-white position-absolute top-0 end-0 m-3" data-bs-dismiss="modal" type="button"></button>![放大圖片262](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/262.png)</div> </div> </div> </div><div aria-hidden="true" class="modal fade" id="imgNModal263" tabindex="-1"><div class="modal-dialog modal-dialog-centered modal-lg"><div class="modal-content bg-transparent border-0"><div class="modal-body p-0 text-center position-relative"><button aria-label="Close" class="btn-close btn-close-white position-absolute top-0 end-0 m-3" data-bs-dismiss="modal" type="button"></button>![放大圖片263](https://schoolweb.tn.edu.tw/uploads/tad_book3/image/263.png)</div> </div> </div> </div>

若帳密正確卻無法登入，Chrome 請按 Ctrl + Shift + N 用「無痕視窗」試試。

請點此觀看解決辦法。

對每個網站都有用喔！

登入後始可申請（僅限台南市資訊組長）。
申請網站數量不拘，方案空間總和不超過50G即可。
特色：
- 一套程式共用，每個站至少節省200M空間
- 一鍵安裝，省卻繁雜安裝流程
- 支援 IPv6
- 支援 HTTP/2
- 一鍵套用Let's Encrypt SSL安全憑證，瞬間提昇網站安全性
- 自動更新，不用擔心升級
- 支援客製模組、佈景，可自行安裝模組、佈景
- 每六小時備份一次，可追朔三天資料，資料不流失！並可提供備份報表下載。
- 享有比釋出版還要新的模組，第一步搶先使用新功能。
- 若遇到使用問題，亦可於第一時間排除

南市校網申請平台

主內容區域

MarkDown

左邊區域內容

右邊區域內容

頁尾區域