WPSniper Logo

LearnDash 結業證書怎麼設定?用 Noto Sans TC 製作中文 PDF 證書

LearnDash 要產生可以交給學員的繁體中文 PDF 證書,除了上傳中文字型,還要替文字保留安全位置。只確認中文沒有變成問號,還不能算完成。

下面使用 LearnDash 5.0.3.1、Certificate Builder 1.1.5 與 Noto Sans TC 示範。證書採用無文字背景、A4 橫式版面、260px 空白間隔與動態資料,最後再用學員帳號下載真實 PDF 驗收。

完成後,PDF 會顯示證書標題、學員姓名、課程名稱與完成日期,文字不會壓住背景或邊框。

開始前先準備

  • 一門已經可以正常完課的 LearnDash Course。
  • 已安裝並啟用官方 Certificate Builder。
  • Google Fonts 的 Noto Sans TC TTF 字型。
  • 一張 A4 橫向比例的 JPG 背景,中央不要放文字或高對比裝飾。
  • 一個可以完成課程並下載證書的學員帳號。

背景先保持簡單。證書標題、姓名與課程名稱交給 Certificate Builder 產生,不要先把這些文字做進背景圖,否則動態內容很容易重疊。

1.下載 Noto Sans TC TTF

先到 Google Fonts 的 Noto Sans Traditional Chinese 頁面確認字型,再從官方 Noto Sans TC TTF 目錄下載並解壓縮。Certificate Builder 要使用 TTF 檔,不能直接貼 Google Fonts 網址。

2.把 Noto Sans TC 上傳到 Certificates

到 LearnDash LMS → Certificates → Fonts,Label 填入 Noto Sans TC,Regular 選擇剛下載的 TTF,再按 Save Changes。

Certificate Builder Fonts 表單已選 Noto Sans TC TTF 並紅框標示 Save Changes
Label 填 Noto Sans TC、Regular 選 TTF,再按 Save Changes。

示範使用的 TTF 約 11.9MB。儲存失敗時,先比較字型檔案大小與主機的上傳限制,再請主機商協助調高;不要一直重傳同一個檔案。這項設定只影響 Certificate Builder 與 PDF,不會改掉一般網站頁面的字型。

3-1.新增一張 Certificate

回到 Certificates 清單,點 Add New Certificate。

LearnDash Certificates 清單紅框標示 Add New Certificate
從 Certificates 清單新增一張 Certificate。

3-2.切換到 Certificate Builder

進入編輯畫面後,點 Use Certificate Builder。中文字型、背景與 PDF 版面都在 Builder 裡設定。

LearnDash Certificate 編輯頁紅框標示 Use Certificate Builder
在新 Certificate 畫面切換到 Certificate Builder。

4-1.輸入後台辨識用的證書名稱

輸入「在家手沖咖啡中文結業證書」。這個名稱用來在後台找證書,不是 PDF 裡顯示的證書標題。

Certificate Builder 編輯器紅框標示證書標題欄
輸入後台辨識用的證書名稱。

4-2.選擇無文字的證書背景

在 Certificate Background 選擇準備好的 JPG。示範背景只有淺色底、雙邊框與小型裝飾,中央留給動態文字。

WordPress 媒體視窗已選無文字的 A4 橫式證書背景並標示選取按鈕
選取中央無文字的新版 JPG 證書背景。

5.套用中文字型與 A4 橫式版面

選取 LearnDash Certificate Builder 根區塊,在右側設定開啟 Use custom font,Font family 選 Noto Sans TC。示範值為 Container Size 76%、Spacing 0、PDF Page Size A4、PDF Page Orientation Landscape。

Certificate Builder 新版背景與右側設定顯示 Container 76%、A4 Landscape、Noto Sans TC
示範值為 Container 76%、Spacing 0、A4 Landscape 與 Noto Sans TC。

76% 是配合示範背景實測的內容寬度,不是所有證書都要照抄。背景不同時,先調整整組內容寬度與上下留白,不要逐行堆位置補丁。

6-1.在清單檢視展開 Certificate Builder

打開清單檢視,找到 LearnDash Certificate Builder,點左側箭頭展開。後面的 Spacer 與 Shortcode 都要放在這個根區塊裡面。

WordPress 清單檢視紅框標示 LearnDash Certificate Builder 的展開箭頭
先在清單檢視展開 LearnDash Certificate Builder,再處理裡面的 Shortcode。

6-2.在 Builder 裡加入 260px 空白間隔

從 Builder 內部的新增區塊位置加入 WordPress 原生 Spacer,Height 設為 260px。這段空白會把整組文字移到證書中央,不要把 Spacer 放成 Builder 外層的同層項目。

Certificate Builder 內部插入器搜尋空白間隔並標示空白間隔區塊
從 Certificate Builder 內部加入 WordPress 原生空白間隔。

6-3.在 Spacer 下方加入 Shortcode

在 Spacer 下方加入 WordPress 原生 Shortcode。Shortcode 必須和 Spacer 一樣位於 Certificate Builder 裡面,放在 Builder 外層不會進入 PDF。

Certificate Builder 內部插入器搜尋 Shortcode 並標示原生 Shortcode 區塊
在 Spacer 下方加入 WordPress 原生 Shortcode。

6-4.貼上證書文字與動態資料

把以下內容貼進 Shortcode。父層統一處理置中、行高與文字顏色,姓名是第一個視覺重點,課程名稱排在第二層。

<div style="width:100%;margin:0 auto;text-align:center;line-height:1.4;color:#2f2925">
<div style="font-size:30px;font-weight:700;letter-spacing:0.08em;margin:0 0 12px">課程結業證書</div>
<div style="font-size:18px;margin:0 0 6px">茲證明</div>
<div style="font-size:42px;font-weight:700;color:#754c2f;margin:10px 0 16px">[usermeta field="display_name"]</div>
<div style="font-size:18px;margin:0 0 6px">已完成課程</div>
<div style="font-size:30px;font-weight:700;margin:0 0 20px">[courseinfo show="course_title"]</div>
<div style="font-size:16px">完成日期:[courseinfo show="completed_on" format="Y-m-d"]</div>
</div>
WordPress 內容總覽顯示 Shortcode 巢狀位於 LearnDash Certificate Builder 內,畫布顯示證書內容
內容總覽確認 Spacer 與 Shortcode 都位於 Certificate Builder 之內。

7.發布 Certificate

確認背景、字型與 Builder 內部結構後,按右上角的發佈。證書發布後才能指派給 Course。

Certificate Builder 顯示新版證書並標示發佈按鈕
新版背景與內容完成後,按發佈。

8-1.打開 Course 的 Settings

打開要發證書的 Course,點上方的 Settings。

LearnDash 在家手沖咖啡 Course 編輯頁紅框標示 Settings
打開在家手沖咖啡 Course 的 Settings。

8-2.找到 Course Certificate

往下找到 Completion Awards,點 Course Certificate 搜尋欄。

LearnDash Completion Awards 紅框標示 Course Certificate 搜尋欄
在 Completion Awards 找到 Course Certificate。

8-3.選擇剛發布的 Certificate

搜尋「在家手沖咖啡中文結業證書」,選擇畫面中唯一的同名結果。

LearnDash Course Certificate 搜尋結果只有一個在家手沖咖啡中文結業證書選項
搜尋並選擇唯一的在家手沖咖啡中文結業證書。

8-4.儲存 Course 設定

確認 Course Certificate 已選好,再按儲存。

LearnDash Course 已選中文結業證書並紅框標示儲存按鈕
Course Certificate 選好後按儲存。

9-1.確認未完課時沒有下載入口

用尚未完課的學員帳號打開 Course。示範課程顯示 0% COMPLETE 與 0/6 Steps,這時不會出現證書下載入口。

LearnDash 在家手沖咖啡課程顯示 0% COMPLETE 與 0/6 Steps
學員尚未完成課程時顯示 0% COMPLETE,沒有證書下載入口。

9-2.完成課程並下載 Certificate

完成所有必要 Lesson、Topic 與 Quiz 後回到 Course。看到 100% COMPLETE、COMPLETE 與 Download Certificate,再點按鈕下載 PDF。

LearnDash Course 顯示 100% COMPLETE 並紅框標示 Download Certificate
所有必要內容完成後,Course 才出現 Download Certificate。

9-3.檢查下載後的中文 PDF

打開 PDF,逐一檢查證書標題、學員姓名、課程名稱與完成日期。除了確認中文沒有變成問號,也要看文字是否重疊、裁切、貼邊,姓名與課名能不能快速辨認。

LearnDash 中文 PDF 證書完整顯示咖啡學員、在家手沖咖啡與完成日期
真實下載的中文 PDF 完整顯示證書文字、學員姓名、課程名稱與完成日期。

常見問題

Noto Sans TC TTF 無法儲存怎麼辦?

先比較 TTF 檔案大小與主機的 upload_max_filesize、post_max_size。示範檔約 11.9MB,主機限制較小時要先請主機商調高,重複上傳不會解決。

為什麼 LearnDash PDF 的中文會變成問號?

先確認 Noto Sans TC 已上傳、Use custom font 已開啟,而且 Font family 選到 Noto Sans TC。字型正常後,還要繼續檢查內容位置,中文存在不等於版面已經完成。

為什麼完課後沒有 Download Certificate?

先確認 Course 已指派已發布的 Certificate,而且學員完成所有必要 Lesson、Topic 與 Quiz。只要還有必要內容未完成,Course 就不會顯示 Download Certificate。

完成後先檢查這五件事

  • 背景中央沒有預先做好的標題或姓名。
  • Certificate Builder 已套用 Noto Sans TC、A4 與 Landscape。
  • Spacer 與 Shortcode 都在 Certificate Builder 裡面。
  • Course 已指派剛發布的 Certificate。
  • 學員完課後能下載 PDF,而且中文、動態資料與整體版面都正常。

學員還沒走過完整上課流程,可以先看學員從註冊、加入課程到完課的操作。

照著做如果畫面跟這裡不一樣,或者不確定證書該怎麼設定、想連整個網站外包給我們製作,歡迎與我們聯絡。