網站改版起步雜談:在篩選器與ACF外掛幫助下釐清思路

之前尋找專業等待一年半沒下文解約後,對方一度表示想繼續完成本案以示負責,但一個多月過去沒再聯繫,已退費也沒立場詢問,看來還是要決定另行委託或自己改版,於是上週請特休湊成的四天連假總算打起精神在本機用xampp安裝wordpress研究改版,一不小心又衝動購物(淚)

作為一個架站多年始終半桶水的超級業餘人士,想說目前版本是以前用免費佈景主題修改,要自己弄新版的話還是得找個順眼的theme比較有頭緒,想說我家閱讀感想較多,於是以bookstore、book review之類關鍵字搜尋,逛了幾個付費書店佈景主題後,決定挑「ChapterOne」這個排版較順眼的(販售頁範例網站)。

▼ ChapterOne主題首頁範本

▼ ChapterOne主題書籍單頁範本

實際安裝後才知道自己誤會大了,不是有「書籍封面+資訊頁」就能套用book模板讓文章自帶格式這麼簡單,選購物網站主題的我因為過於無知而做出了愚蠢行為。

我本來以為,或許能把購物車、價格等相關功能關掉,留下喜歡的版型就好,結果根本沒地方關,因為書籍資訊篩選功能是在「商品」頁面裡,要下載啟用woo commerce等多個外掛,我家感想站跟書店主題其實完全不適合(大受打擊)

就這樣白白浪費了79USD嗚嗚,人生就是不斷地後悔啊,亂買不是第一次,多年前搜尋多條件篩選功能外掛時也曾看到demo有想要的功能就衝動下單「Tag Groups Premium」,事後才發現不符需求Orz

幸好仍有好消息,沮喪地刪掉改用內建佈景主題,建立幾篇文章測試,發現了符合篩選需求的外掛!

1. WordPress Books Gallery

LINK:外掛頁面Demo

▼ 後台新增書籍欄位畫面

在後台建立文章時能直接輸入書籍資訊欄位,也能用書名、作者、類型等多項條件篩選,完全是我需要的功能,可惜只有書籍類,雖然因為還想要有電玩、影視類,加上佈景主題一致性考量,最後應該不會使用這個外掛,但很有參考價值,讓我意識到應該要好好運用自訂欄位。

2.GeeK! – Movie & Game Database

LINK:外掛頁面Demo

能在後台輸入電影或遊戲資訊建檔很方便,可惜不知為何說明描述的文字欄無法keyin,前端顯示效果也還好,這種帶入非本地他站資訊的外掛會有蠻多侷限,中文遊戲應該會找不到,測試後驚嘆了一下就移除掉。

3.Filter & Grids

LINK:外掛頁面

上圖為試做截圖,可用分類、標籤、自訂欄位等條件篩選文章,而且可以選取多個分類或標籤,大致上適用,而且還是免費外掛,是目前首選。

4.Content views pro

LINK:外掛頁面Demo

我目前網站有在使用免費版讓每個選單項目顯示該類最後更新文章縮圖,查詢發現付費版有我想要的篩選功能。

※ ※ ※

後來決定把theme換成網路能搜尋到教學的好用免費佈景主題「Blocksy」,在一小時架站Youtube教學影片「【2024年度】 Blocksy教學:想讓網站變漂亮就靠這個!」幫助下總算對wordpress區塊編輯器比較有概念。

逛完上面那些外掛後,改版方向變得更清楚,重點是要透過自訂Post Type、分類法Taxonomy和自訂欄位meta box,就能把作品類型、作者、語言、產地等全都變成資料庫裡能排序篩選的條件,為此需要研究ACF這個知名外掛。

Advanced Custom Fields

LINK:原開發團隊官網wordpress.org外掛頁面

此外掛狀似從原開發團隊手裡被wordpress.org強制接管,並於近日改名為「Secure Custom Fields」。

目前正努力爬文了解此外掛用法,再來要確認新版架構、研究怎麼改php用ACF函數在主題中載入和顯示自訂欄位組資料,為閱讀、電玩、影視等自訂Post Type製作不同版型的single.php,只要能搞定這部分(咳,CSS美化排版對我應該有點吃力),篩選就會變得很easy。

雖然對沒有程式語法基礎的我而言不太容易,打開「wp-books-gallery」外掛試圖研究裡面的語法立刻覺得夭壽怎麼這麼多資料夾也太複雜我怎麼可能看得懂XD,總之先跟著Advanced Custom Fields官網的入門教學試試看吧。

註冊新的Post Type和Taxonomy都很簡單,再來得敲定閱讀、電玩和影視等各類作品要有哪些自訂欄位,重頭戲是改語法讓自訂欄位成功顯示以及CSS排版製作有自定義欄位的對應版型,先挑戰看看,失敗再另做打算,加油!

4 則留言

  1. 我搜尋的時候因為先找到ACF就先裝來測試了,剛剛也試了RepoRepo之前推薦的MB Custom Post Types & Custom Taxonomies,後者語系有本地化+支援導出PHP 程式碼很方便,ACF多了自訂欄位組合,Meta Box則是要透過線上產生器,不知道哪個比較適合,都來測試看看吧。

    分類超燒腦,像是:漫畫要放進書籍類還是跟網路條漫單獨列為一類?網路創作跟出版書籍的資訊欄不同但故事類型相似要分在閱讀還是單獨一類?影音類含電影、劇集、動畫、綜藝、演唱會、聲優見面會、廣播劇、歌曲會不會太雜?出版小說和原創文的類型要共用還是各自獨立,放在自訂類型還是標籤,各種難題啊Orz

    目前我最困擾的是,假設在Book這個post type建立有書籍資料自訂欄位的「特殊傳說」頁面,要怎麼在同一作品底下新增不同集數的多筆感想(沒有書籍資料欄),讓前端能依最後更新時間排序(像網路創作平台更新章節那樣),連應該要用什麼關鍵字查詢都毫無頭緒,不知道是不是要用ajax還是其他方式,只能一步步來,希望能找到好方法,感謝RepoRepo願意幫忙CSS部分,到時有需要的話再厚著臉皮請教,先來自己好好努力(握拳)

  2. 沒問題!有需要歡迎隨時私噗我唷~ 我挺喜歡弄CSS HTML之類的哈哈

    分類確實燒腦!我的blog數年前定下的分類和標籤,現在回頭看覺得有很多字眼和分法可以改進,但又懶得重新調整 orz 一開始的設計真的需要仔細思考,不然之後要把累積下來那麼多篇文章再重新分配,那工程…好大惹……

    在同一作品底下新增不同集數的多筆感想,像網路創作平台更新章節那樣,這想法好棒誒!我暫時只想到一個比較手動傻瓜的方法,就是把每集放進一個 Accordion 裡 (https://www.w3schools.com/howto/howto_js_accordion.asp),但這裡每集也會是更新在同一篇文章裡,需要手動排序

  3. 我之前查詢自訂文章自訂分類自訂欄位的前端顯示時,網路教學不知道是不是預設瀏覽者都有程式基礎,好像沒完整寫出所有步驟和程式碼,我依教學測試沒成功,比較找人客製化費用和自己製作的CP值,毅然決定買線上教學課程自己從頭努力,現在慢慢在看HTML和CSS課程,之後還有JS、PHP、wordpress客製化、ACF外掛詳細教學,希望學習後有能力自己寫佈景主題寫外掛(握拳)

    現在邊看影片教學,邊繼續燒腦分類架構,因為我有時會寫整個作品、系列或作者總感,如果要把書籍資訊作為自訂欄位,要新增沒有書籍資訊的感想就比較麻煩,感覺要嘛自訂欄位都不設必填,寫總感就把書籍資訊自訂欄位全部留空,要嘛書籍資訊變成一個可以在新增文章時選取的小工具區塊可以自由插入(暫時還不知道該怎麼做)

    不論是總感或不同集數感想,很需要讓文章變成目錄集中在同一作品底下,RepoRepo提到的Accordion對防劇透很好用,不過我廢話有時候很多,感覺好像開新頁更適合。

    隨便看了一下晉江網站,作品頁面選章節,網址會直接增加章節名,像這樣:
    https://www.jjwxc.net/onebook.php?novelid=662556
    https://www.jjwxc.net/onebook.php?novelid=662556&chapterid=1

    應該是有什麼方式能做到,總之先繼續學習,希望之後能做到類似的呈現,雖然肯定得花不少時間,現在網站18歲,看看20周年前能不能新版上線吧哈哈。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *