共同工作空間初體驗


自從全職接案以來,我都是習慣在家工作,雖然書桌旁邊有 PS4、Switch,但我早已練就工作時可以不受娛樂的誘惑,上下班時間也非常固定,對於工作與休息的界線,在「家」這個空間中我可以劃分的非常清楚,因此就算我成立公司之後,也完全沒有想要在外面租辦公室的念頭,在家工作就是我效率最高的場域。

而我後來才了解這是因為有老婆陪我一起在家工作的緣故,由於她當成人美語老師的時間比較彈性,我們可以一起吃三餐,晚上還有時間去公園散步或是追韓劇,工作時她也會跟我聊天打屁講些五四三的,就好像我有同事一樣,而且是可以非常輕鬆自在聊天的好麻吉。

但有時候她當天上課時數比較長,家裡就會變得很安靜,雖然我還是一樣在 Coding,但就是會覺得少了些什麼,如果時間再久一點就會覺得寂寞空虛冷,這讓我想起還沒結婚前也有一段自己在家工作的經驗,很容易因為在工作上遇到困難而讓自己的情緒不穩定,像是解決一個難題就會超 High 的鬼吼鬼叫,卡關的時候就會三字經連發…

我一直跟老婆說如果她去當上班族的話我一定沒辦法一個人在家工作,花錢租辦公室可能才不會讓自己瘋掉,但有時候也會想跟夥伴可以一起面對面工作,交換彼此的工作心得與更新專案進度,這時就會覺得有個辦公室好像也不錯。

於是這禮拜我就約夥伴一起出來 Co-working 一下,上網找了一下有沒有合適的場所,可以有網路、咖啡、茶水、廁所、能待上一整天的地方,查到的結果發現到原來現在有不少的共同工作空間,除了提供公司行號月租辦公室以外,還有單日租用的方案。

最後我選擇了這一間,原因是他們可以直接線上刷卡預定,卡座座位方案適合兩個人,一天 500 元使用時間為 9:00~19:00,地點在台北車站南陽街,坐捷運走路五分鐘可以到。整個空間不算大,一共有四個樓層,單日券的開放空間在三樓,樓梯有點抖不太好走:

卡座座位還算寬敞,我跟朋友兩個人身高超過 180cm 公分也可以坐得很舒適,只是因為我靠牆側坐一直不小心把電源線給踢掉,如果插座的位置是在桌上或是高一點的話可能會比較好。

在他們網站上預約付款完成後,會收到一封信,信裡面有入場用的 QRCode,要進場需要使用它掃描門鎖,整體的使用流程還滿順暢的,硬說說缺點的話就是空間比較小,交談的內容很容易讓其他桌的人聽到,因為有幾位一人工作者在那邊工作,我都覺得我們交談的音量會吵到他,開放共享工作空間可能還是比較適合一個人,下次要 Co-working 我應該還是會選擇咖啡廳了。

偶爾能跟夥伴面對面交流開發心得、腦力激盪真的十分爽快,先從跟彼此介紹最近在忙什麼案子,到近期業界的活動,然後討論專案的進度,討論完就開始動手解決問題,這是平常遠端工作沒辦法體會到的,有時候還真的會因爲這個好處想弄間辦公室上班,只是晚上到家覺得好累,這樣高密度的工作好像不太適合我,看來在老婆還願意陪我待在家裡上班前,我還是乖乖待在家裡好了。

WooCommerce 建立訂單時取得金流回傳資料的勾點

這週遇到一個狀況時我需要在訂單成立的時候取得第三方金流回傳的資料,我之前的處理方式是使用 woocommerce_order_status_changed 來做,但如果是剛成立的訂單且訂單狀態還停留在等待付款中時,這個勾點就不會觸發到。

我首先嘗試使用 woocommerce_new_order 這個勾點可以在訂單建立時觸發,但我卡在客戶的網站有使用第三方金流,我需要在訂單建立時就能取得第三方金流所回傳的付款資訊,像是 ATM 虛擬帳號或是付款結果。

爬了 WooCommerce 的程式碼之後發現到類別 WC_Order_Data_Store_CPT 裡面有幾個訂單資料寫入的方法,像是 create()、update(),後者裡面有一個 woocommerce_update_order 勾點,看起來是會在訂單寫入相關資料後進行觸發。

因為我需要當金流外掛將回傳資料寫入後進行觸發,因此覺得 woocommerce_update_order 就是我所需要的,嘗試之後果然沒錯,有成功拿到我需要的資料並且是在訂單建立時就會觸發。但,這個勾點會在每更新一次訂單資料的時候觸發,也就是說如果你的訂單有 100 筆資料要更新,那麼勾點就會觸發 100 次,我在測試的時候差點把 API 打到掛掉 > <

於是我繼續搜尋還有沒有跟訂單狀態有關的勾點,也思考著是不是要尋找 PHP 的非同步解決方案,等待金流回傳資料寫入完成後再做事情,但光想就覺得燒腦,後來念頭一轉,要能夠在訂單資料建立且拿到回傳資料,這不就是前台結帳會發生的流程?

想通之後就不再拘泥於訂單的勾點,而是改用 woocommerce_thankyou 勾點來進行觸發,這樣就能實現在訂單狀態不改變的情況下,拿到第三方的回傳資料。

WordPress 表單推播外掛

歷經了一年的調整,WooCommerce 推播外掛在上個月月底總算正式推出 1.0 版,在這一年中很感謝各位大大提供了許多寶貴的建議,讓我知道該把哪些功能整合進去,也逐漸摸索出整個程式碼架構該如何規劃才能因應未來的擴充需求,這些都是在一般專案中無法得到的寶貴經驗。

1.0 版我把程式碼進行重構,主要的重點有三個:

  1. 抽象化推播方式
  2. 增加訊息參數對於第三方外掛的支援
  3. 增加觸發推播事件勾點

這一年來最常遇見的需求是支援新的推播通知管道,像是增加不同的簡訊商、LINE Notify,之前為了求快都直接將相同的程式碼複製貼上,然後修改成對應的 API,結果後來要改裡面的東西時,有幾個推播管道我就要改幾次,想當然就會發生漏改的情況。

我的作法是把推播管道相同的程式碼拉出來做成抽象類別,然後每個管道去繼承這個抽象類別來修改成他們自己的推播方式,未來要新增時就會方便許多,不用再複製貼上一大堆相似的程式碼,維護上也只要修改抽象類別就能同時對所有推播管道產生作用。

其次是訊息內文參數,隨著使用場景的增加,有客戶希望可以支援特定外掛的參數,像是金流或是物流相關的資訊,以便讓顧客收到通知時能看到物流單號或是 ATM 轉帳帳號,這部分的擴充機制也於 1.0 版完成,可以讓第三方外掛進行整合。

增加觸發推播事件是比較困難的部分,因為會關係到第三方外掛的勾點設計以及資料取得方式,目前已整合的事件有五種,除了與 WooCommerce 訂單、商品到貨通知事件外,其他是三款不同表單外掛的通知,分別是 Elementor Form、Gravity Form 以及 Fluent Form。

在客戶的實務應用中,觀察到表單送出後的通知也是有滿多的需求,常見的像是課程報名表單填寫完成後,可以讓學員透過 LINE 或是簡訊收到上課通知,或是預約某項服務時能確認服務時間,多種通知管道是這些表單外掛比較不會著重的功能。

於是某天跟一位朋友聊到,他問我說會不會出一個精簡的版本只支援表單外掛推播,這句話炸開了我的腦洞,我一直想推出免費的版本但不知道該如何切割功能,如果是拔掉 WooCommerce 只支援表單外掛並且維持其他功能,似乎就能服務到沒使用 WooCommerce 的網站,抱持著這個想法讓我決定要開始進行開發。

拜重構所賜,把原本的外掛拔掉 WooCommerce 相關功能非常容易,不到一個禮拜的時間就搞定了,我把該外掛的功能簡單介紹一下:

Form Notify 表單推播外掛

該外掛可以協助有使用表單外掛的站長,讓填表者送出資料後,能夠在 LINE 官方帳號、手機簡訊以及電子郵件中收到相關的填寫結果資訊,而管理員也能在 LINE Notify 中接收到通知,以便做後續的追蹤與管理。

目前支援的表單外掛如下:

  • Elementor Form
  • Fluent Form
  • Gravity Form

目前支援的推播管道如下:

  • LINE 推播
  • LINE Notify
  • 電子郵件
  • Every8d 簡訊
  • 三竹簡訊
  • easyGo 簡訊

為了提供 LINE 推播功能,該外掛也支援 LINE 登入以取得會員的 LINE User ID 來進行推播,以下就實際的使用場景來進行相關設定說明。情境是我們需要讓訪客在填寫表單前先登入會員,並且在送出資料後於 LINE 官方帳號內提醒他於表單內選擇的上課時間,步驟如下:

一、安裝表單推播外掛

先前往此處下載外掛主程式:https://oberonlai.blog/form-notify.zip

從後台進行上傳並點選啟用,啟用後會在後台側邊欄看到「表單推播通知」的選單:

二、設定 LINE Login 與 LINE Channel

點選表單推播通知 > 設定,點選第二個 LINE Channel 頁籤:

在這邊要在 LINE 的開發者後台取得 LINE Login 與 LINE Messaging API 的 Channel 資訊,相關設定教學可參考以下文章:

三、設計登入頁與表單欄位

新增一個頁面來加入 LINE 登入按鈕,或是你也可以在文章中的任何一處使用區塊編輯器來加入。如果是在區塊編輯器中,輸入斜線打 LINE Login,就可以找到 LINE Login Button 的小工具,或是透過左上角的加號新增,找到小工具的類別:

加入後可以透過右側的區塊設定來進行按鈕樣式的調整:

如果你用的不是區塊編輯器,也可以用短代碼的方式加入登入按鈕,使用方式如下:

[linelogin text='快速登入' size='m' lgmode='true']

短代碼名稱為 linelogin,設定參數說明如下:

text – 按鈕的文字名稱

size – 按鈕的尺寸,可選參數有 f、 l、m、s 四種尺寸,f 為滿版按鈕

lgmode – 跳轉的模式,設定 true 時會重新導向回原頁面,設定網址時會重新導向至該網頁

align – 對齊方式,可選參數有 left、center、right

如果是在會員已登入的狀態下,前台頁面會不顯示該按鈕。

表單的部分這邊用 Elementor Form 做示範,我們先設計三個欄位:姓名、Email 以及場次的單選方塊:

四、編輯推播通知內文

進入後台表單推播通知 > 新增,輸入頁面標題,事件的地方選擇「 Elementor Form 表單送出後」,表單區塊選擇剛剛新增的表單,然後點選下方通知方式的新增按鈕:

下一步通知加入訊息內文,先選擇類型為 LINE 推播,內文的部分從右側欄「可帶入參數」複製需要的資料,然後在自訂接收推播欄位貼入 Email,程式會自動判斷如果該 Email 是經由 LINE 登入且帶有 LINE User ID 時,就會將訊息推播到他有加入的 LINE 官方帳號內:

五、測試接收通知

在前台使用 LINE 登入後填寫表單,確保 LINE 有收到相關報名資訊:

設定功能

WordPress 表單推播外掛提供以下功能:

  • LINE Login、LINE Notify 與 LINE Messaging API 的憑證設定
  • 簡訊服務的憑證設定
  • LINE 登入功能設定,包含是否在 WordPress 的登入表單中顯示 LINE 登入按鈕,以及設定登入後的重新導向網址、客戶角色與未取得電子郵件授權時的處理。
  • 查看歷史推播紀錄,可依照週、月篩選

以上是 WordPress 推播外掛的功能與操作教學,如果你有常用的表單外掛卻沒在列表中,或是你希望你的會員是可以從 Slack、Telegram 收到通知都可以跟我說,我非常樂意整合這些功能,希望這支外掛可以更實用,幫助到更多人!

再次附上 WordPress 推播外掛的下載連結,我已經有提交上架 .org,但最近審核人力似乎不足,可能有得等了~

另外這邊先打個預告:今年即將於十月在台北國際會議中心舉辦的 WordCamp Taiwan 2023,我已經報名講者來分享這支外掛的開發秘辛,但前提是我的講題要有入選才行XD,今年報名很踴躍,整個議程感覺十分精彩,還沒購票的朋友趕快去搶票吧:https://taiwan.wordcamp.org/2023/tickets/

WordPress 開發日常

Read more from WordPress 開發日常

最近常用 AI 產生程式碼,結果一堆程式自己都看不懂,只有錯誤發生時才會回頭研究到底寫了什麼。想說乾脆寫篇文章記錄一下,當作學習筆記。本篇主題是 OpenAI API 與 WordPress 的整合,讓 AI 能直接操作 WordPress。 初探工具請求(Function calling) 像 GPT 這類自然語言模型是靠訓練資料回應問題,但資料若過時,或想取得即時資訊,模型本身無法處理。這時可以透過「工具請求(Function calling)」來解決。 原理是:先告訴 AI 有哪些工具可用,當對話中出現相關需求,AI 就能自動判斷是否要使用某個工具。這些工具可以是 WordPress 的函式(如 WP_Query 查文章),也可以是外部 API(例如 Google 搜尋),執行後把結果再交給 AI 處理並產出回應,自然語言化地回答使用者。 適用場景 1. 整合客服機器人 如果你想設計聊天介面給其他人使用,像是客服機器人外掛,就很適合採用這個技術來取得網站內的資訊,像是讓客人查詢商品、訂單相關資訊、搜尋產品使用說明文件,或是讓管理員查詢營業額、網站瀏覽數據。...

過去我一直覺得,接收管理員通知用 Email 就夠了。如果訂單量不大,靠主機或第三方發信服務,其實也能運作得很順利。但後來與客戶訪談時發現,很多老闆根本不會用 Email,就算有,也常被廣告信和雜訊淹沒。 我自己試過很多收信軟體,試圖藉由工具來過濾重要訊息,但過不了多久,「重要信件」又變得滿天飛。雖然我會每天安排時間檢查,但有些緊急事件,例如新訂單通知,我希望能即時知道。 手機上的 App 通常只能根據「有新郵件」來推播,還找不到能針對「特定寄件者」推播的服務。因此我預設會把 App 的通知功能關掉,避免不緊急的訊息干擾我。 用 LINE 收通知也一樣,目前沒辦法只針對特定對象推播,只能全開或全關。這讓我想過是不是該換個沒那麼常用的通訊軟體來接收通知,但又懶得裝新 App,只好……自己開發一個外掛來解決了(?) 實機展示 要能在手機上接收到訂單通知,有三個關鍵技術:Web Push、Service Worker,以及 Progressive Web App,這邊先跳過他們,如果你也想在手機上收到訂單通知可以參考以下步驟: 1. 下載 DWP 網站助理...

創業的時光真是飛快得不可思議。明明才剛寫完第一個月的回顧,怎麼一下子又到了第二個月。這個月我全力投入開發新產品,原以為靠 AI 協助,兩週內就能搞定,沒想到一弄就是一整個月,還卡關連連,導致原本預定的行銷工作停滯不前。但我真的很喜歡開發產品的過程,彷彿在解謎闖關,每解開一個難題就多學一點新知,形成一種自我成長的良性循環。 工作佔比 四月份總工作時數為 65.64 小時,比三月增加了 24 小時。各類工作佔比如下: 行銷:30% 產品更新:7% 產品研發:63% 其中一個週末我整整兩天都在工作,有幾天甚至加班到晚上七點多。比較難統計的是晚上洗完澡到就寢前,還是會用平板跟 AI 討論白天卡住的問題,甚至請它幫我先寫好隔天要用的功能。若將這些時數也納入,總工時應該超過 70 小時。 我覺得比較理想的工作狀態是一個月大約 50 小時。像加班的那個週末,一直卡關讓我很煩躁,為了突破瓶頸逼自己解完才能休息,結果越急越解不開。後來乾脆休息一天,結果回來上工十分鐘就解決了。 所以還是得適時讓自己充電,給大腦一點空白,真正需要動腦時才有空間處理複雜問題。 行銷 內容行銷...