WordPress blank theme and starter theme for Developers

對於開發人員,開始一個WordPress專案,依屬性的不同,開發方式會區分為「全客製」或「半客製」開發,各有優缺點,而依據開發方式的不同,開發人員必須選擇適當主題最為基礎來開始製作專案,而哪種主題適合呢?

「空白主題 blank theme」適用於全客製開發

用此種開發方式,基本上這個專案具有獨特性,非「常態性」網站,比較難用通用的樣式或版面結構去套用,自幹型網站,這種情況就適合使用空白主題 (blank theme),直接以空白主題開發,未來也需要自行維護這個主題

空白主題最大特色就是什麼都沒有,但也並非什麼都沒有,更正確的說法應該是乾淨的主題,預先建立主題檔案結構及初始程[……]

Read more

WordPress Elementor CSS breakpoint

WordPress Elementor 提供3種裝置分別是電腦、平板、手機,雖然可以用 CSS @media 比較標準的方式來判斷,但在 Elementor 中斷點的尺寸是一個參數,可以自訂義數值,此狀況若透過客製 CSS,以 @media 這種方式給予響應式的樣式,因為斷點可能會跟Elementor 編輯器產生的內容樣式有差異,除非每改一次斷點寬度,都需要再調整過所有的 CSS @media 斷點數值,或禁止主題去調整斷點寬度數值,但這主題將對 Elementor 不友善,與主題開發以最大化的開發原則背道而馳

Elementor 可以透果 body 上的 data-elementor-[……]

Read more

解決 WordPress Astra 主題修改後台編輯器樣式問題

使用 Astra 主題今天遇到了一個很怪的問題,在編輯文章的時候,不知道怎麼搞的,後台文字編輯器的標題及內文,全部都變成白色的,這給客戶肯定被打槍阿!! 花了很多時間找這個問題,並解決它了,如果你也正遇到這個問題這也許對你會有幫助

除錯開始

透過 Chrome 開發者工具,找到一串修改後台編輯器樣式的行內樣式 (inline style),就是這一串樣是在搞鬼,由 style 標籤上的 id ,「astra-block-editor-styles-inline-css」看得出來是 Astra 給的行內樣式,不過 Astra 又為什麼要給這個行內樣式呢? 找了一下資料,不知道[……]

Read more

WordPress paginate_links for Bootstrap

WordPress 有提供一個 paginate_links function 來製作頁碼,可以直接輸出html,但實務上,所輸出的頁碼 html 結構並不一定符合我們的需要,尤其我們是套前端設計師所給的 html 檔案,我們就必須忠實還原它的結構,我們以 Bootstrap 來說,它的結構就跟 paginate_links 所吐出來的 html 頁碼有很大的不同,這時我們就要部份透過客製的方法來處理。

以下方法一樣透過 WordPress paginate_links 這個方法來計算相關頁碼的數據,但回傳格式選 array,如此將會連結用陣列方式回傳,再用這些回傳的連結陣列來套用成[……]

Read more

Betheme single page header transparent

Betheme 是很優秀的 WordPress 多功能主題,他有很多預置的模板很方便,但實務上開發一個 WordPress 網站,難免需要自訂義 single page,我不知道為什麼?自訂義 single page 好像不能設定 header 透明背景的樣式,我就透過CSS的方式來設定 header 透明背景,如果你也需要這功能,可以參考下列代碼:

[……]

Read more

WooCommerce 直接登出,關閉 “您確定要登出嗎?” 訊息

WooCommerce 在登出動作非常怪,按下登出連結後,會跑出「您確定要登出嗎?」,阿不然咧?!!!!! 我就是要登出阿!不然是按好玩的嗎?!常常都按下登出後人就走了,但其實還要多一個步驟才能真正登出,這也可能會間接產生安全性問題,至少我不愛,哥教你改。

下列代碼可修正此問題:

參考資料:
https://wpglorify.com/disable-are-you-sure-you-want-to-log-out/
https://njengah.com/woocommerce-logout-without-confirmation/

[……]

Read more

WooCommerce 我的帳號刪除「下載」頁

WooCoomerce 在「我的帳號」頁面中,用頁籤的方式整合帳戶相關功能,其中有一個系載頁面比較匪夷所思,其實主要是因為 WooCommerce 的商品有虛擬商品的類型,若購買虛擬商品,則可以由這頁來下載

但大部分客戶還是以實體商品為主,所以通常不會需要虛擬商品,多出這個頁籤,點進頁面又會顯示沒有可以下載的檔案,這時業主會一直問為什麼有這頁、這頁要幹嘛、可以拿掉嗎?答案是可以的喔

方法 1 :由進階設定面板關閉

透過後臺介面,進入後台 WooCommerce > 設定 > 進階,移動至「帳號端點」區塊(這翻譯誰看得懂),將下載這個帳號端點留空即可,這個方法非常簡單,人人都可[……]

Read more