profile

WordPress 開發日常

WordCamp Asia in Taiwan

Published about 1 year ago • 1 min read

這禮拜最興奮的新聞莫過於在這次泰國 WordCamp Asia 的閉幕典禮上,看到明年竟然是要在台灣舉辦,超敬佩也超感謝社群夥伴們的努力,讓台灣可以再次登上世界舞台。與城市為單位的 WordCamp 不同,Asia 是跨國的大型活動,跟 WordCamp Eurpope、US 是同等級的,這代表會有更多來自全世界各地的講者分享,在這之前還有 WordCamp Taipei 會在今年回歸,如果你想要回饋社群,參與志工或是報名講者都是不錯的選擇喔~

一、WooCommerce REST API 手動指定訂單金額

之前開發的使用 ACF Form 來建立 WooCommerce 訂單的功能,客戶希望增加自訂訂單金額的欄位,也就是預設用商品售價計算,或是可以自行輸入這筆訂單的金額。在 WooCommerce REST API 的官方文件範例中,並沒有提供訂單金額的參數,於是第一個直覺就是跑去問 ChatGPT,想不到反而繞了一大圈。

它給了我兩個錯誤的參數名稱,一個是 price 另一個是 _order_total,結果完全沒有作用,後來再仔細研究官方文件提供的屬性列表,才發現到在商品屬性 line_items 裡面有一個 total 的參數,才理解原來下手的方向應該是調整商品總計進而變動訂單金額:

當然,如果你有稅或是運費計算的邏輯需要處理會麻煩些,我的情況比較單純,因此只要去動商品總計即可,只要將 line_itemstotal 欄位用 ACF 取拿資料。

當用這樣的方式去改變訂單金額時,在 WooCommerce 這邊的紀錄方式是用優惠券扣掉折扣金額去符合我們自行帶入的數字,也就是說如果商品價格是 1,000 元,我的自訂訂單金額是 100 元,那麼該訂單就會自動套用 900 元的折價券。

這樣的計算方式會延伸一些問題,我踩到的雷是電子發票的開立,由於套用折價券後會算成是兩筆商品小計,但商品名稱卻只有一個,因此會發生商品名稱的資料筆數跟小計的對不起來,造成發票無法開立的問題,這部分我是直接修改電子發票外掛來解決,但根本解可能還是要請外掛開發商將優惠券的情境考慮進去才行了。

完整程式碼:https://oberonlai.blog/woocommerce-rest-api-total/

二、WooCommerce 新增訂單狀態

原本以為是十分鐘就搞定的功能想不到被搞了五十分鐘,主要是卡在註冊文章狀態後少了一個環節。首先 WooCommerce 的訂單狀態是用 Post Status 來做的,套用到 WordPress 本身就是文章的發佈狀態,就是草稿、待審核、已發佈等等,由於訂單也是一種 Post Type,所以在勾點 init 使用 register_post_status() 來新增。

該方法帶兩個參數,第一個是訂單狀態的代稱,第二個是屬性陣列,裡面的 label 是新的訂單狀態顯示名稱,其他參數皆採用預設值即可,結果我在訂單編輯頁一直找不到新的訂單狀態,反覆檢查文件以及看其他外掛的寫法都是這樣沒錯,問了 ChatGPT 也是給我一樣的寫法,但就是無法新增成功。

後來看了另一位大大寫的程式碼,才發現我少了關鍵的一段:在註冊 Post Status 的時候我就在想,參數裡面沒提供 Post Type 的指定,我要怎麼讓 WordPress 知道這個狀態是用在訂單上面而非一般文章,於是才找到常看到的勾點 wc_order_statuses,有這個 Filter 才可以把這個狀態指定到訂單上面。

完整程式碼:https://oberonlai.blog/woocommerce-custom-order-status/

三、WordPress 取得作者頁網址的正確做法

點擊文章作者名稱連到作者個人頁的網址,一直以來我都是用 user_login 搭配 home_url 自己組出來的,我都這樣寫:<a href=’<?php echo esc_url( home_url() . ‘/author/‘ . $user_login )’>Oberon</a>,但沒想到這禮拜踩到雷。

主要問題出在有一位使用者在註冊的時候,使用的 user_login 中間有空格,因此當連到他個人頁時會出現 404,我試著進資料庫把他 user_login 裡面的空格移除掉並且重新產生永久連結,結果還是無法排除這個問題,爬了一下文件才知道應該要用 get_author_posts_url( $user_id ) 才對。

在取得正確的作者頁網址後,發現到它是用 user_nicename 加橫線來作為網址,研判可能是因為 user_login 帶有空格因此使用帶有橫線的 user_nicename 來替代,之後就學乖一律改用 get_author_posts_url() 來取得作者頁網址比較保險。

四、產品更新

WooCommerce 推播通知外掛的 LINE 登入功能有個狀況,有位客戶反應他的顧客都是年長者,在他們的那個年代電子郵件還沒普及,現在有了 LINE 之後只要有電話號碼就可以註冊,因此很多會員在使用 LINE 登入時無法取得電子郵件,不是他們不提供,而是根本沒有 > <

雖然我有做一個功能是判斷如果沒有從 LINE 那邊取得電子郵件時,會跳出一個表單請他們輸入,但對於沒有電子郵件的人這步驟會阻礙他們加入會員,因此為了提升會員註冊數,先用假的電子郵件來完成會員註冊。

雖然在實務上我還是會建議顧客去申請一組電子郵件以作為日後的聯繫管道,但改變他人的使用習慣可不是件容易的事,因此這禮拜我在外掛中多加入了一個功能,那就是可以讓管理員選擇是用讓使用者強制輸入電子郵件還是用 ID 自動產生假的,具體畫面如下:

我多設計了一個當未取得電子郵件的處理方式,直接使用 User ID 自動產生電子郵件,這樣當註冊會員後會產生如下圖的結果:

我覺得比較好的做法還是在顧客成功註冊會員後,請他們修改電子郵件,避免日後的訂單通知或是客服回覆因為顧客沒收到訊息而造成糾紛,除非管理員有完整的配套方案可以只透過 LINE 作為與顧客間的唯一溝通管道。

五、跟 MacOS 的 Dock 說再見,向 Raycast say Hi 👋

上圖是我現在的 MacOS 的桌面,最底下的超小 Dock 不是因為我把截圖的比例縮小,而是因為我現在完全沒有用到它但又沒辦法移除,只能使用自動隱藏並且把尺寸縮到最小,讓我平常的工作可視範圍不會受到 Dock 的佔據。

之所以不用用到 Dock 是因為我習慣使用 Cmd + Tab 切換應用程式,另外再搭配 Raycast 來啟動應用程式,它有點像是 MacOS 內建的 Spotlight,可以用快速鍵來呼叫視窗,只要在輸入欄中打入關鍵字,就可以跳出對應的搜尋結果,像是我要啟用 VSCode,只要輸入 vs 再按下 Enter,就可以省去使用游標移到 VSCode 圖示上點擊下去的時間,重點是不用從鍵盤轉換到滑鼠或是觸控板,使用上會非常直覺。

當然,它能做的事情遠遠不止於啟動應用程式,像是開網頁、找文件、計算機、查字典、安裝軟體,任何只要靠輸入文字就能達成的事它幾乎都辦得到,再加上它的 API 很完整,開發者或是第三方服務可以整合,像是專門做 Emoji 或是 Icon 服務的整合後就能不用開瀏覽器,直接在 Raycast 輸入關鍵字搜尋圖標,並且一鍵複製 svg。

除了啟動應用程式,我自己最常用的功能如下:

  • Clipboard History - 不用重新複製,可以搜尋之前複製過的文字或圖片
  • Unsplash - 不用開瀏覽器就能找免費圖庫
  • Github - 不用開瀏覽器就能瀏覽存放庫
  • Speedtest - 不用開瀏覽器就能測網速
  • Quicklinks - 不用開瀏覽器就能以關鍵字做特定網站的站內搜尋

你可以到這個網頁去查看你常用的服務有沒有整合進 Raycast 之中:https://www.raycast.com/store

近期他們也推出了 AI 功能,可以用自然語言去執行相對應的動作,也可以像 ChatGPT 一樣問它問題,甚至還可以自行設計 AI 的工作流程,也有提供 API 來整合相關功能,只是現在還是封測中,非常期待實際使用的體驗!

忘了說,Raycast 個人使用是完全免費的,趕快去載來玩看看吧~

-

一直還沒有時間看 WordCamp Asia 的影片,這個週末可以來追一下了,我們下週見!

WordPress 開發日常

Read more from WordPress 開發日常

每次遇到想要跟我學習 WordPress 外掛開發的朋友來信,總是只能丟些教學文件給他們,畢竟我也不知道他們想做什麼東西,只能提供官方文件給他們參考,雖然這幾年來也寫了不少,但好像都缺少比較完整的開發教學。 想到之前為了教老婆開發而整理出的一套課程大綱,似乎有這個契機可以把它發展下去,但如果只是講理論而沒應用好像無法立即派上用場,於是想到可以整合之前寫過的小工具作為內容,就可以設計出真的能做出東西的教材。 剛好上週為了除錯的事情順手寫了一支日誌外掛,整合理論與實務的教學計畫如下: -- 前言 日誌紀錄是開發者與網站維護人員最重要的好夥伴,除了可以在開發當下輸出執行結果來確認程式的邏輯外,當網站發生錯誤時也能從紀錄中去檢查問題所在原因。查看 WooCommerce 的日誌紀錄步驟為:進入後台側選單 > 點選 WooCommerce > 狀態 > 日誌紀錄 > 選擇日誌檔 > 查看,就會顯示相關的資訊。 一、WooCommerce 內建日誌紀錄的問題 WooComerce 內建的日誌有以下幾個痛點: 選單的目錄層級過多,日誌檔太多時東西不好找...

6 months ago • 1 min read

上週五工作到一半,家裡的門鈴響起,開門後是衛生局的人員通報說社區附近出現登革熱案例,需要整棟樓進行消毒,正當我想著那我就不要出門就好,結果想不到對方說連屋內都要消毒時,我一整個傻眼,家裡這麼多吃的穿的睡的,全部都要暴露在殺蟲劑下,一想到頭就暈。 第一時間先上網查一下這是不是新型態的詐騙手法,才知道原來對臺南人來說這已是司空見慣的作業流程,還查到「養生膠帶」這個神器,它可以把大型傢俱鋪上一層塑膠袋作為防護,於是當晚趕快去水電行買了兩捲,想說隔天早上再蓋就好。 到了隔天一早九點,大樓就傳來噴藥機的巨大聲響,衛生局人員敲每戶的門,說要開始進行消毒了,那時候我們才剛吃完早餐,一整個被殺個措手不及,只好趕快把養生膠帶鋪上,但因為太趕,很多傢俱都沒有鋪到,就這樣半推半就的被請出家裡。 坐進電梯前看到消毒人員拿著在戶外消毒水溝的大型噴藥機直接在家裡面狂噴,不知為何有種荒謬感,好像我家是喪屍病毒外洩的實驗室必須徹底消毒一番,然後跟著鄰居們一起被迫撤離家園,似乎也拉近了鄰居之間的距離(?)...

6 months ago • 1 min read

這兩週在忙著準備 WordCamp 簡報以及擺攤相關事宜,雖然既累人又噴錢,但過程還是充滿了樂趣,我弄了宣傳 DM、易拉展、桌上立牌,以及手工裁切貼紙,好久沒做平面設計了,光設計一份 DM 就搞了五小時。 我是用 Figma 做的,由於它是專門用來做介面設計的,因此色彩模式並沒有 CMYK,所以只能用 RGB 輸出,為了要精準還原電腦上的顏色,前前後後不曉得打樣了多少次,最後還是睜一隻眼閉一隻眼讓它過了,不然可能花上七天七夜還搞不定… 明天就是期待已久的 WordCamp Taiwan,我覺得身為聽眾真的超幸福,只要人到屁股坐下,就能獲得這些講者們累積好多年的經驗與知識,會後還能去扒著他們不放問問題,光這樣想就覺得值回票價,我想分享一下身為開發者的我會去聽哪幾場,以及我是如何認識這些大大的: 上午 9:30 - WordPress 社群中的成長旅程 by Eric 在 WordCamp Keynote 由台灣人主講印象中這還是頭一次,我覺得這超棒的,以往的 Keynote 都是由 WordPress 官方代表來負責,通常會宣傳新的功能或是官方想要傳達的主題,這次是由 Eric...

7 months ago • 1 min read
Share this post