Mac 限定 WordPress 外掛搜尋引擎
 |
如果你有在用這幾年出的 Mac 軟體，應該對於啟動器 ( Launcher ) 不陌生，只要輸入快速鍵 Command + K，就會出現一個很像 Google 首頁的搜尋框，或是 MacOS 內建的 Spotlight。
這個搜尋框可以輸入關鍵字進行相關資訊的搜尋，並且將結果顯示在啟動器的下方，就能用鍵盤上下鍵去切換要進一步查看的內容，選定後才會開啟瀏覽器前往頁面或執行特定動作，這對於很懶得用滑鼠的我來說超方便。
而這功能在今年也流行到 WordPress 生態圈，在更新 6.3 版本後多了「命令選擇區」，它也是類似的功能，可以在搜尋框輸入相對應的關鍵字，像是新增頁面或新增文章，點擊後就會自動進入該頁面，就不用操作滑鼠點選新增文章的按鈕。
關於命令選擇區在 2023 WordCamp Taiwan 將有一個專門的議程來介紹，主講者是非常資深的 WordPress 工程師昱程大大，想要了解這個功能可以對於網站管理員帶來什麼改變的話，鎖定 10/14 下午三點二十分的議程「如何使用命令選擇區 (Command Palette)來提升網站使用者體驗？」就沒錯了！
而我之所以會迷上啟動器這個功能，完全是因為 Raycast 這個工具，我之前有撰文「跟 MacOS 的 Dock 說再見，向 Raycast say Hi」介紹過，它早已成為我每天工作不可獲缺的功能，但就是有個小遺憾，那就是它沒有搜尋 WordPress 外掛的工具。
於是我就趁著夜黑風高的夜晚跳坑了…
 |
靠著 Raycast 優異的開發體驗以及瘋狂的煩 ChatGPT 問 React.js 怎麼寫，總算生出了第一版，主要功能介紹如下：
一、常用目錄列表
如果要進 .org 的頁面去找佈景主題或外掛，我的流程是這樣：開啟瀏覽器 → 開啟空白分頁 → Google 搜尋 WordPress plugin → 找到搜尋結果點擊進入，因為記不得網址只好透過搜尋引擎來找，為了讓自己可以更偷懶連瀏覽器都不用開，我第一個整合的功能就是目錄列表：
 |
啟用 Raycast 後搜尋關鍵字 WordPress Plugins 點擊 Enter，可以看到三個網址的連結，分別是外掛、佈景主題以及區塊版面配置，選擇好輸入 Enter 後就會直接在瀏覽器對應的頁面。
二、關鍵字搜尋
如果要找特定外掛的話，在上述頁面直接搜尋關鍵字即可，像是如果我要尋找 LINE Pay 相關的外掛，輸入關鍵字後就可以看到搜尋結果：
 |
使用上下鍵可以切換搜尋的結果，右邊則會顯示外掛的說明，可以大概先了解一下外掛的主要功能，其次是外掛的相關資訊，以我自己的習慣而言，我找外掛第一個會先看上一次更新時間，因此外掛資訊的第一欄放的是前次更新時間。
另外還有啟用數與安裝數、評價一顆星數與所有評價數、已解決問題與所有問題，透過這些資訊可以初步判斷該外掛是否還有在維護，避免用了之後出問題找不到人求救。如果要查看外掛的頁面選定後按 Enter 就會開啟瀏覽器連到外掛頁面，用 Cmd+Enter 複製外掛頁面網址。
三、直接下載或是線上測試
我在本機開發時習慣下載外掛的 zip 檔來自行安裝，所以右下角有 Download Zip 的功能可以直接下載主程式到本機，省去開瀏覽器的時間：
 |
另外我還整合了 TasteWP 跟 InstaWP 的測試連結，點過去後就可以直接得到安裝好該外掛的 WordPress 測試站，因為這兩個服務都有建立網站的額度限制，所以想說兩個都放，就能在其中一個額度用完時改用另一個替代。
四、AI 翻譯外掛說明
Raycast 目前是完全免費，付費功能主要是多了 AI，因為我自己有訂閱，所以就想說可以整合一下，我整合的功能是協助英文苦手的朋友可以直接把外掛的說明頁用 AI 進行翻譯，使用方法為輸入快捷鍵 Cmd + Shift + Enter，或是在 Actions 裡面找到翻譯功能：
 |
翻譯出來的結果如下：
 |
要使用這功能前記得必須要有付費訂閱 Raycast 才能使用。
-
在撰文的當下已提交 Raycast 進行上架審核，但稍早搜尋它們的 Store 竟然意外發現在一小時前有一支 WordPress 搜尋外掛工具上架，不知道是老天爺在告訴我趕快去弄 WordCamp 簡報，還是注定就是要白忙一場，尤其我在開發前已確認過沒有相關的工具所以才進行開發，想不到就在送審之際被捷足先登，只好安慰自己學了不少 React 的知識，並且感受到什麼叫做優秀的開發者體驗。
不得不說 Raycast 對於開發者來說實在太方便了，從一開始的範本建立、複製程式碼、到格式整理以及提交發布，有很多 WordPress 可以學習的地方。而我已經做好審核不會過的心理準備了，如果你不嫌棄還是願意用我的版本的話，安裝步驟如下：
- 開啟 Raycast 輸入 Create Extension
- 看到相關欄位隨便輸入
- 重點在 Location 的地方選擇一個本機資料夾輸入 Cmd+Enter
 |
透過以上步驟就可以建立本機的開發環境，然後透過以下連結下載我的版本：
https://oberonlai.blog/wp-content/uploads/wordpress-plugin-raycast/wordpress-directory.zip
解壓縮後放在上面指定的資料夾，這樣應該就能在啟動 Raycast 時找到 「Search WordPress Plugins」的選項。如果你有想到什麼功能可以加入再跟我說，在確認審核結果前我要放飛自我了~~~
WordPress 開發日常
每次遇到想要跟我學習 WordPress 外掛開發的朋友來信，總是只能丟些教學文件給他們，畢竟我也不知道他們想做什麼東西，只能提供官方文件給他們參考，雖然這幾年來也寫了不少，但好像都缺少比較完整的開發教學。 想到之前為了教老婆開發而整理出的一套課程大綱，似乎有這個契機可以把它發展下去，但如果只是講理論而沒應用好像無法立即派上用場，於是想到可以整合之前寫過的小工具作為內容，就可以設計出真的能做出東西的教材。 剛好上週為了除錯的事情順手寫了一支日誌外掛，整合理論與實務的教學計畫如下： -- 前言 日誌紀錄是開發者與網站維護人員最重要的好夥伴，除了可以在開發當下輸出執行結果來確認程式的邏輯外，當網站發生錯誤時也能從紀錄中去檢查問題所在原因。查看 WooCommerce 的日誌紀錄步驟為：進入後台側選單 > 點選 WooCommerce > 狀態 > 日誌紀錄 > 選擇日誌檔 > 查看，就會顯示相關的資訊。 一、WooCommerce 內建日誌紀錄的問題 WooComerce 內建的日誌有以下幾個痛點： 選單的目錄層級過多，日誌檔太多時東西不好找...
上週五工作到一半，家裡的門鈴響起，開門後是衛生局的人員通報說社區附近出現登革熱案例，需要整棟樓進行消毒，正當我想著那我就不要出門就好，結果想不到對方說連屋內都要消毒時，我一整個傻眼，家裡這麼多吃的穿的睡的，全部都要暴露在殺蟲劑下，一想到頭就暈。 第一時間先上網查一下這是不是新型態的詐騙手法，才知道原來對臺南人來說這已是司空見慣的作業流程，還查到「養生膠帶」這個神器，它可以把大型傢俱鋪上一層塑膠袋作為防護，於是當晚趕快去水電行買了兩捲，想說隔天早上再蓋就好。 到了隔天一早九點，大樓就傳來噴藥機的巨大聲響，衛生局人員敲每戶的門，說要開始進行消毒了，那時候我們才剛吃完早餐，一整個被殺個措手不及，只好趕快把養生膠帶鋪上，但因為太趕，很多傢俱都沒有鋪到，就這樣半推半就的被請出家裡。 坐進電梯前看到消毒人員拿著在戶外消毒水溝的大型噴藥機直接在家裡面狂噴，不知為何有種荒謬感，好像我家是喪屍病毒外洩的實驗室必須徹底消毒一番，然後跟著鄰居們一起被迫撤離家園，似乎也拉近了鄰居之間的距離(?)...
這兩週在忙著準備 WordCamp 簡報以及擺攤相關事宜，雖然既累人又噴錢，但過程還是充滿了樂趣，我弄了宣傳 DM、易拉展、桌上立牌，以及手工裁切貼紙，好久沒做平面設計了，光設計一份 DM 就搞了五小時。 我是用 Figma 做的，由於它是專門用來做介面設計的，因此色彩模式並沒有 CMYK，所以只能用 RGB 輸出，為了要精準還原電腦上的顏色，前前後後不曉得打樣了多少次，最後還是睜一隻眼閉一隻眼讓它過了，不然可能花上七天七夜還搞不定… 明天就是期待已久的 WordCamp Taiwan，我覺得身為聽眾真的超幸福，只要人到屁股坐下，就能獲得這些講者們累積好多年的經驗與知識，會後還能去扒著他們不放問問題，光這樣想就覺得值回票價，我想分享一下身為開發者的我會去聽哪幾場，以及我是如何認識這些大大的： 上午 9:30 - WordPress 社群中的成長旅程 by Eric 在 WordCamp Keynote 由台灣人主講印象中這還是頭一次，我覺得這超棒的，以往的 Keynote 都是由 WordPress 官方代表來負責，通常會宣傳新的功能或是官方想要傳達的主題，這次是由 Eric...