找我們做網站
↑
Wordpress · WordPress 外掛推薦

Timeline Express 教學:WordPress 時間軸外掛製作公司沿革年表

WordPress 外掛推薦發布 2018.03.24更新 2026.10.02閱讀約 8 分鐘
Timeline Express 教學:WordPress 時間軸外掛製作公司沿革年表

重點整理
Timeline Express 讓 WordPress 網站顯示事件時間軸,適合公司沿革、歷史年表,也能做課程表或活動時程。外掛裡每個時間點是一則 Announcement;本文示範安裝、Settings 各選項的意思與建立時間軸的步驟。

Timeline Express 時間軸 製作 沿革 年表!今天的教學外掛,主要的功能是為網站附上事件時間軸的功能,具體來說,通常會應用在顯示公司沿革上,在哪些時間點,公司有了哪些創新商品,或者成立了分公司等這些重大歷史事件,在網站上讓使用者能更清楚明瞭公司的發展狀況,可以說是一項相當重要的功能,之所以說很重要,因為對使用者而言,企業公司或電子商務網站,具有歷史年份的沈澱累積,在品牌形象上面會越有加分的效果,通常也越容易為使用者(消費者)建立信心。
對於這個外掛的功能而言,如果說是專門用來製作歷史沿革的外掛,就定義上來說太狹隘了,其實這個外掛還有許多延伸的功能,也可以在網站上建立未來事件的時間軸,比如每個月的課程表外掛製作,或者商品活動特價時間等等,讓使用者對於網站所想表達的事物能直接一目了然,所以這一篇Timeline express 時間軸的外掛教學,我相信能帶給各位不小的幫助!
(小提醒:鵠學苑的所有教學均是以Apple Mac OS X系統 做步驟示範!)

透過WordPress後台安裝 Timeline Express時間軸以及外掛設定(Timeline Express)

第一步:進入到WordPress後台,在側邊工具欄點選外掛>安裝外掛,右上角搜尋欄內輸入Timeline Express,點擊搜尋。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

第二步:外掛圖示是火箭圖示,依序點選安裝、啟用。有關外掛的安裝,可以參考之前的文章:WordPress 教學 基礎介紹六(外掛)。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

第三步:可以在後台的側邊工具欄找到Timeline Express的選項, 時間軸這個外掛本身也有付費及免費版的差異,端看個人需求,在下圖的畫面中有外掛的使用流程解說。另外在選項中有New Announcement及ALL Announcement,Announcement翻譯中文是”公告“的意思,在外掛裡一個時間軸的項目就是一個公告,因此整個時間軸可以自行配置公告的數量。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

第四步:接下來點擊Settings,進入外掛設定的部分,下面跟大家解說每一個選項設定的意思。

Timeline Express 時間軸 製作 沿革 年表
1.Time Frame:設定顯示哪些時間的公告,未來/過去/或兩者同時顯示。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

2.Display Order:設定公告顯示的排序,升序或降序依據的是公告日期。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

3.Announcement Excerpt Length:在公告上顯示內容摘錄的長度,最小長度25個字符。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

4.Date Visibility:設定公告的日期是否顯示,Visibility為顯示,Hidden為隱藏。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

5.Read More Visibility:設定”閱讀更多”按鈕是否顯示,Visibility為顯示,Hidden為隱藏。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

6.Default Icon:設定時間軸線上顯示的圖示,在建立公告的編輯頁面也可以自行設定,這裡是預設公告顯示的圖示。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

7.Color:
(1)Default Announcement Color:公告的預設顏色,可以在新增公告內調整。
(2)Announcement Container Background:公告內容的背景顏色。
(3)Announcement Shadow Color:公告內容區域內陰影效果的顏色。
(4)Background Line Color:時間軸線條顏色。
Timeline Express 時間軸 製作 沿革 年表

8.No Announcements Message:在這個選項內設定的文字會顯示在所有公告上,如果公告訊息沒有設定,所有公告的內容文字會全部顯示一樣的內容。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

9.Exclude Announcements from Site Searches:如果設定Ture,在網頁內搜尋不會顯示公告,設定Fale就可以在網站內搜尋的到。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

10.Disable Timeline Animations及Delete Announcements On Uninstall:
(1)Disable Timeline Animations:設定具有時間軸的頁面,當畫面向下滾動時公告從右至左進入的動畫效果是否顯示。
(2)Delete Announcements On Uninstall:勾選的話在解除安裝外掛時會刪除所有公告的數據資料,如果是要進行網站除錯,可以先做備份。

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

學習Timeline Express時間軸建立方式

第一步:在 Timeline express的選項中選擇New Announcement,會進入下圖畫面,首先輸入公告名稱,在顏色的部分可以自行重新選擇,或著是使用在第一小節中預先設定的顏色。
Timeline Express 時間軸 製作 沿革 年表

第二步:公告圖示也是一樣,可以做更改或使用預設圖示。
Timeline Express 時間軸 製作 沿革 年表

第三步:日期直接點選日歷即可,如下圖所示。
Timeline Express 時間軸 製作 沿革 年表

第四步:Announcement Banner是指在公告頁面中顯示與公告主題相關的圖片,如WordPress在媒體庫內上傳圖片的操作方式一樣,見下圖。
Timeline Express 時間軸 製作 沿革 年表

Timeline Express 時間軸 製作 沿革 年表
Timeline Express 時間軸 製作 沿革 年表

第五步:在頁面的選項新增一個名為鵠學苑課程表的頁面,可以注意到在文章編輯器上方的設定按鈕中,多了一個橘色火箭的圖示,點擊圖示後會自動生成[timeline-express]的一段簡碼,可以自行設定簡碼的位置,接著發布頁面。
Timeline Express 時間軸 製作 沿革 年表

第六步:檢視課程表的頁面,就會出現如下圖一樣的時間軸樣式,我在這個範例建立了四個公吿,各位同學可以自行設計或因網站需求不同而更改公告數量。
Timeline Express 時間軸 製作 沿革 年表

不想用 Timeline Express,還有哪些做法?

如果擔心外掛久未更新,可以考慮以下方式:

  • 頁面編輯器的時間軸元件:若網站已經使用頁面編輯器,先查它本身或擴充套件有沒有時間軸元件,就不必多裝一個外掛。
  • 用區塊自己排:沿革年表項目不多時,用區塊編輯器的「欄」或「群組」區塊排出年份與說明,再加上框線,維護最單純。
  • 換其他時間軸外掛:到外掛目錄搜尋 timeline,挑選近期仍有更新、相容目前 WordPress 版本的外掛。

不論選哪種,換之前先記下原本每個時間點的日期與內容,搬移時比較不會漏。

常見問題

Timeline Express 現在還能用嗎?

還能從 WordPress.org 下載安裝,但外掛最後更新在 2023 年 3 月,相容測試只到 WordPress 6.2。新網站使用前建議先在測試站確認畫面正常,長期使用則要評估改用仍有維護的方案。

做好的時間軸要怎麼放到頁面上?

在頁面或文章插入短代碼 [timeline-express]即可顯示所有時間點(Announcement)。顯示順序、只顯示過去或未來的事件、日期與「閱讀更多」是否出現,都在外掛的 Settings 統一設定。

時間軸可以用來做課程表或活動時程嗎?

可以。Settings 的 Time Frame 能設定只顯示未來、只顯示過去或兩者都顯示,把每堂課或每檔活動建成一則 Announcement 並填上日期,就能當成課程表或活動時程使用。

結語

在這次時間軸(沿革)的教學中,應該對各位同學有不小的幫助,既然使用WordPress來架站,當然要好好的運用其附加的支援功能,外掛就是很重要的資源,Timeline express時間軸其實是很簡單上手操作的外掛,今天的教學也講解了每一個設定功能所代表的意義讓同學們知道,相信只要多加練習,一定能很快的運用自如的!這個外掛也有付費版本,當然我們是要以最小的資源,發揮最大的效益,但其中有些外掛功能,是比較單一性的,各位同學可以自行斟酌是否付費使用喔!今天的WordPress外掛教學到此告一段落了!大家要持續追蹤鵠學苑,才能掌握WordPress教學最實用外掛的即時資訊喔!我們下週的教學見拉!

鵠學苑・鵠崙設計鵠崙設計 2014 年成立,專注 WordPress 網站開發,400 多個網站在我們自己的主機上運作。鵠學苑的文章由團隊實際操作後整理,工具與外掛的功能以撰文當時為準。
鵠崙設計

不想自己摸索,
就交給我們做。

外掛設定、主機效能、改版搬家,這裡寫的每一件事,都是我們每天在客戶網站上做的工作。留下需求,1 個工作天內回覆。