search
top

WordPress必裝外掛與應用–外觀篇

  在這一節中我們來介紹讓你的網站看起來更舒服,操作更便利的外掛,善加運用這些外掛,可以讓來到網站的的網友們有更好瀏覽經驗,增加下一次再訪的動機喔。

方便行動裝置閱讀的WPtouch Mobile Plugin

  第一個要介紹的外掛就是大名鼎鼎的行動裝置閱讀外掛WP-TOUCH。現在使用行動裝置來上網的朋友們愈來愈多,行動裝置不管螢幕多大,最大就到10吋,而大部份的智慧型手機也都在5吋以下。以這樣大小的裝置來到我們的網站,如果我們的網站沒有特別留意到版面的佈置,會造成整個手機畫面密密麻麻的文字,不利閱讀。但是,如果畫面設計得太簡單,在一般電腦上呈現的內容又太少,又白白浪費了螢幕空間。兩全其美的方法,就是讓行動裝置有行動裝置專屬的頁面,而電腦有電腦的頁面。

  如果網站的內容是你自己設計的,為了達成這樣的想法,你可能要準備兩份網頁以因應不同的裝置瀏覽需求,但是在WordPress卻不用。有些佈景主題本身就提供了自動適應不同裝置的排版能力,這一類的佈景主題叫做Responsive Theme。但是,假設你的佈景主題並沒有這樣的功能,或是它的Responsive能力不符合你的需要,那就要靠WPtouch這個外掛來協助了:

ch05b3

  這個外掛的功能非常強大,不是單純把電腦版的網頁切換成手機版網頁而已,你還可以為手機版的網頁附加上更多的功能。在安裝外掛之後,可以在選單中看到以下的選項:

ch05b7

  預設是英文選項,但是我們可以先到「Core Settings」中把語言設定改為「繁體」,儲存設定之後,選單就會變成中文。以下是「What’s New」的觀迎頁面:

ch05b4

  然後是Core Settings的設定畫面:

ch05b5

  別忘了中間的選項要先改成「繁體字」,先儲存就可以看到中文的設定畫面了:

ch05c1

  在主題和擴展的設定中,還可以選擇手機頁面專用的佈景主題,不過可惜的是,除了預設的佈景之外其它都是要付費的專業版才可以選用:

ch05b6

  還有許多的設定,大家可以自己動手操作看看:

ch05b8

  另外有一點要注意的是,如果你有依照前一節的介紹為網站安裝了Hyper Cache快取外掛的話,當你發現設定之後網站並沒有改變,別忘了到Hyper Cache中按下清除快取的按鈕,讓變更可以有更新的機會:

ch05b9

  因為我們的範例網站文章太少看不太出效果,作者幫大家找了一個網站http://phd.madoupt.com,使用手機瀏覽的時候的差別。以下是用手機看電腦版網頁的樣子:

2014-09-30 23.47.31

  以下是自動切換成手機版網頁時的樣子:2014-09-30 23.47.17

  看起來差很多吧!而且,移到網頁的最下方(不管是電腦版或是手機版的網頁都有這個選項),瀏覽者也自行切換要顯示哪一個版本(英文是「Desktop」和「Mobile」,中文則顯示「電腦」和「行動」):

2014-09-30 23.47.49

提供更好的頁碼索引WP-PageNavi

  當我們的部落格文章愈來愈多的時候,當然不可能在我們的首頁中列出所有的文章或文章摘要,很多佈景主題都有提供設定首頁要顯示最多幾篇文章的地方。在顯示完這些文章之後,如果瀏覽者想要看更多的文章,一般都是移到首頁的最下方,看到前往舊文章或較新文章的連結,等於是翻上一頁和下一頁的功能:

ch05c2

  但是在這樣的介面中,瀏覽者根本看不出來全部有多少頁,如果想要和更久之前的文章,只能用搜尋的,或是一頁一頁翻。而WP-PageNavi這個外掛,則是可以把這個介面改為更美觀好用的分頁顯示功能,像是下面這個樣子:

ch05c5

  要讓我們的網站有這項功能,請安裝以下這個外掛:

ch05c3

  這個外掛支援繁體中文,所以在設定上非常地方便:

ch05c4

在側邊欄顯示隨機文章的Advanced Random Posts Widget

  當文章愈來愈多的時候,由於文章在首頁顯示的順序預設是以時間為前後來排列,因此有些年代比較久遠的文章有時候被埋沒到文章堆中,沒有機會出頭天。為了能夠讓以前寫的文章有機會再獲得網友的青睞,部落客們會用兩種方法,第一種就是在網站的側邊欄加上一個隨機文章工具,把整個網站中的文章隨機挑選一些出來展示,每一次進首頁的時候都會有不同的隨機文章列表,增加被舊文章被再次發現的機會。另外一個則是下一節要介紹的相關文章。隨機文章最好用的,就是這一個:

ch05c8

  安裝之後,直接到外觀/小工具處,直接把Random Posts拖曳到側邊欄中,馬上會出現這麼多選項可以設定,如下所示:

ch05c9

  第一個要設定的當然是標題Title,另外這個標題也可以另行設定連結網址,讓你有機會把它連結到別的網站。此外,左邊欄的最下方可以讓你設定要顯示在隨機文章列表之前和之後的HTML代碼,不錯喔。中間就是可以設定要顯示的文章列表數以及是否要限定顯示的類別,另外,也可以在右側欄做一些和外觀有關的設定。全部設定完畢按下儲存之後,再回到網站上就可以看到側邊欄出現的成果囉。

ch05d1

自動幫讀者建議相關文章的外掛nrelated Related Content

  (PS.這個外掛似乎是退役找不到了。相關文章功能,請直接使用Shartaholic外掛所附加的相關文章功能就可以囉!2015/6/22更新)

  讓你的讀者閱讀網站上更多文章的方法,另外一個就是使用相關文章外掛。讓系統自動在每一篇文章的後面加上3到5篇和本文主題相關的文章,使用者如果看完了主文發現還意猶未盡的話,就可以馬上選擇下面建議的文章繼續閱讀。而提供這個功能的外掛,就是這一節中我們要介紹的nrelated Realted Content外掛:

ch05d2

  這也是一個有很多功能的外掛,但是對於大部份的站長來說,其實是不用去調整的,它的主控台如下:

ch05d3

  一開始安裝完之後並不會馬上有作用,既然是相關文章的推薦功能,所以總要給它時間去讀取你的網站中所有的文章,然後再做出索引,才有辦法給建議。因此這個設定頁面的最上面的一大串英文字的目的,主要就是在提醒站長,做索引是要花時間的(15-120分鐘)。此外,每一個建議的文章都會有一個縮圖,可是有些文章本身是沒有圖形檔可以用來製作縮圖的,它提供你一個設定,可以自製一些縮圖備用,但是製作好的縮圖檔案位置也要在設定的欄位中列出來才能夠有所作用。一開始我們先都不要管,直接按下「Save Changes」即可。

ch05d4

  按下Save Changes的按鈕之後,出現上述的文字看起來很恐怖,其實不用擔心,它只不過是告訴你,如果對於設定有任何調整的話,要按下「Re-Index button」連結,再讓系統重新索引一次,就這樣而已。當一切都設定完畢而且也索引完成之後,你的網站每一篇文章之後,就都會有一些建議的相關文章了,如下所示:

ch05d5

  不過,可能是因為繁體中文的關係,所以它的相關準確度,其實也沒有那麼高啦!

(3820)

No Responses to “WordPress必裝外掛與應用–外觀篇”

Trackbacks/Pingbacks

  1. WordPress全新教材,開放免費線上閱讀 | eBook Store - […] 第5章 外掛與應用 5.1 什麼是外掛 5.2 天字第一號外掛 Jetpack 5.3 必裝外掛與應用--賺錢篇 5.4 必裝外掛與應用--訪客篇 5.5 必裝外掛與應用--社群篇 5.6 必裝外掛與應用--系統篇 5.7 必裝外掛與應用--外觀篇 […]

發表迴響

top
%d 位部落客按了讚: