Timeline Express 時間軸製作 沿革 年表

Timeline Express 時間軸 製作 沿革 年表 教學目的:

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

2.學習Timeline Express建立方式

歡迎回到鵠學苑—WordPress網頁設計超詳細攻略 ––Timeline Express 時間軸 製作 沿革 年表!今天的教學外掛,主要的功能是為網站附上事件時間軸的功能,具體來說,通常會應用在顯示公司沿革上,在哪些時間點,公司有了哪些創新商品,或者成立了分公司等這些重大歷史事件,在網站上讓使用者能更清楚明瞭公司的發展狀況,可以說是一項相當重要的功能,之所以說很重要,因為對使用者而言,企業公司或電子商務網站,具有歷史年份的沈澱累積,在品牌形象上面會越有加分的效果,通常也越容易為使用者(消費者)建立信心。

對於這個外掛的功能而言,如果說是專門用來製作歷史沿革的外掛,就定義上來說太狹隘了,其實這個外掛還有許多延伸的功能,也可以在網站上建立未來事件的時間軸,比如每個月的課程表外掛製作,或者商品活動特價時間等等,讓使用者對於網站所想表達的事物能直接一目了然,所以這一篇Timeline express 時間軸的外掛教學,我相信能帶給各位不小的幫助!接下來跟著鵠學苑的腳步,讓我們開始學習~

(小提醒:鵠學苑的所有教學均是以Apple Mac OS X系統 做步驟示範!)

外掛下載點:https://tw.wordpress.org/plugins/timeline-express/

 

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

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

Timeline Express 時間軸 製作 沿革 年表

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

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

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

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

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

Timeline Express 時間軸 製作 沿革 年表

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

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 時間軸 製作 沿革 年表

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

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

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

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

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

Timeline Express 時間軸 製作 沿革 年表

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

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

結語:

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

今天的WordPress外掛教學到此告一段落了!大家要持續追蹤鵠學苑,才能掌握WordPress教學最實用外掛的即時資訊喔!我們下週的教學見拉!

WordPress 外掛教學相關文章:

網站架設知識推薦閱讀:

WordPress 介紹 – 全球市佔率達三成,遠超其他CMS管理系統

免費網頁空間 架站平台比較 – WordPress,Wix,Weebly,Blogger

WordPress 市佔率再創新高,2019 年成長至 33.4%!

分享在 facebook
Facebook
分享在 skype
Skype
分享在 pinterest
Pinterest
分享在 email
Email
鵠學苑

鵠學苑

我們是由一群熱愛 WordPress 網站架設的同好所組成的團隊,希望可以將這套 頂尖的 CMS 管理系統推廣給想要架站的朋友們,並且能夠在過程中互相交流心得,讓網站架設過程變得更有效率!

訂閱電子報

立即訂閱鵠崙設計(鵠學苑)!我們將不定期發送架站教學文章、最新網站版型介紹以及網頁設計最優惠價格!

熱門文章

最新文章

相關文章

標籤雲

Sign up for our Newsletter

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit

Scroll to Top