ALL POST

如何指定某些商品不能一起加入購物車中？(免外掛)

2022-08-10 尚無留言

簡介

這個需求滿常見的，有時候因特殊情境需求，例如A商品與B商品有不同的運費，所以不能一起被加入購物車結帳，這樣的功能一般都要找特殊的外掛或付費式的外掛才能達成，而這樣的外掛好像也不好找。

運用範圍

1、有可能是有多個不同頁面或重類的「一頁式購物」，所以購物車中只能存在「當下這一頁式購物中所開放購買的商品」。

2、有些是低溫運送與常溫運送的商品，因運費不一樣所以須分開下單。

3、有些是特殊優惠商品，不能與一般商品一起下單。

4、有些是可寄海外、有些只寄國內的商品，所以要分開下單結帳。

5、有些是虛擬商品(例如課程)、有些是實體商品，所以分開下單結帳。

範例

請至範例網站測試 :

前往範例

原理與思路

免外掛，主要是在購物車頁與結帳頁寫了一篇jQuery程式，來判斷指定的商品是否有被「一起加入購物車中」，有的話會跳出警告，並暫時把結帳按鈕禁用，等訪客有刪除部分指定商品後，警告才會消失並才可以結帳。

在程式原始碼中，你可以先填入幾個不能與一般商品加入購物車的商品分類名稱，例如”冷凍食品的分類“、”預購商品的分類“預先設定好後，這二個分類的商品就不能與其它分類商品一同被加入購物車中。

另這個作法唯一有一個限制，就是Woocommerce內建的「購物車」流程仍需存在，也就是在訪客加入購物車後，在結帳過程中仍需出現「購物車明細」才能讓程式產生判斷的作用。

只要貼上本篇介紹之程式碼，即可運作。

實作

付費內容，需支付 : 999 個學習幣

您須先登入會員以使用學習幣與發問功能。

總結

本篇作法適用於各種Woocommerce版本，且這個需求滿常見的，只是本篇程式不見得適用於每種情境，建議先看一下本篇的範例網站多做幾遍測試，真的符合需求再使用本篇的作法。

[細論][標題]調製不同樣式的「標題」

2022-08-10 尚無留言

簡介 :

在Elementor中我們可以做出不同樣式的標題，甚至要做出不同樣式的標題，也不一定要拉「標題」元素來做，也可以拉其它元素來做調製，可做出不同樣式的標題喔。

範例 :

像下列這幾個範例就是用Elementor不同的元素工具來做的，以下用到「標題」、「按鈕」來分別達成不同樣式標題的需求，而且僅是使用到免費版的Elementor。

網站測速

使用說明

實作 :

此篇僅先建立文章標題或部分文字，教學內容待補上。

如何只靠Elementor而不靠其它外掛來自製麵包屑(Breadcrumbs)以強化SEO效用？

2022-08-09 尚無留言

簡介

為了增加SEO效果與使用者體驗(讓訪客知道目前位於哪一頁)，在設計網頁時常會在每一篇上方適當位置中加入「麵包屑(Breadcrumbs)」。

一般都是靠佈景主題內建的麵包屑(Breadcrumbs) 或 SEO外掛或麵包屑(Breadcrumbs)外掛來達成。

最常見的作法是靠SEO外掛就帶有麵包屑(Breadcrumbs)功能，但有些SEO外掛並不內建此功能(或是買Pro版才有)，但也沒關係，我們可以利用Elementor Pro的模版功能來自製且更彈性，且不需再安裝任何外掛。

運用範圍

任何網站類型的每一篇文章、每一頁面、甚至每一商品都適用。

範例

用Elementor Pro做出以下範例的麵包屑(Breadcrumbs) :

這可不是寫死的文字，而是網頁載入時會自動根據這一頁的分類位置而自動出現相對應的分類與位置路徑。

原理與思路

用Elementor Pro的動態欄位對應來達成製作麵包屑(Breadcrumbs)的目的，所以我們一般會在「單篇文章」或「單篇頁面」或「單篇商品」的模版製作時，使用三組標題或文本或圖示列表來指定動態對應。

而範例中的「>」也是我們手動加的，它就不需要動態對應，僅是一個寫死的符號，你也可以改換成別的符號。

這麵包屑(Breadcrumbs)組好後，可以直接做在單頁模版中或另存成版型反覆插入套用喔。

實作

待補上。

影片

待補上。

總結

一般在「首頁」或「一頁式網頁」時可不用置入麵包屑(Breadcrumbs)，比較不會破壞頁面設計的版型。

剩下的任何一頁可以考慮都置入麵包屑(Breadcrumbs)，以強化SEO效果與使用者體驗。

麵包屑(Breadcrumbs)可以靠外掛來達成，但我覺真的覺得可以少裝一個外掛就盡量少裝一個，對整體維護與效能上有較大的助益。

如何讓會員登出後自動轉址到首頁?(方法2)

2022-08-09 尚無留言

簡介

讓會員登出後自動轉址到首頁或其它指定頁，也可以用PHP一段小語法來達成，也是非常方便省事。

運用範圍

只要有會員功能的網站都可以使用。

範例

請自行創一個測試網站測試一下。

原理與思路

略。

實作

你也必須先製作好「登出」的連結或按鈕喔，不然完成下方步驟後仍看不到效果。

1、Code Snippets(自訂片段程式碼)

須安裝「Code Snippets(自訂片段程式碼)」外掛。

2、新增程式碼

貼上下列程式碼後勾選「執行於前端」即可。

				
					//■ 登出後轉址至首頁
add_filter( 'logout_redirect', function() {
    return esc_url( home_url() );
} );

3、如何在登出後不要轉至首頁而是重導向其它頁面或外面的網址？

這個需求的話需要小改上面的程式碼，並不是把 home_url()改掉而已，請參考付費內容裡的程式碼，一樣是複製貼上即可。

付費內容，需支付 : 100 個學習幣

您須先登入會員以使用學習幣與發問功能。

總結

這段程式碼，已成為我必備之程式碼，只要是製作具有會員登入的網站，例如部落格、電商(Woocommerce)，我就會用到，建議您也收藏下來!

[外掛]301轉址-Redirection

2022-08-09 尚無留言

外掛資訊

【外掛名稱】 : Redirection
【費用】: 免費版
【官方網址】: 點此
【簡介】: 自動偵側永久連結的異動與重導向、自動偵側舊網址被修改後的自動轉址、有條件的轉址。

說明

這外掛最基本功能，就是偵測每一篇網址若被異動(包含永久連結的格式異動)，就會自動做新舊網址的對應，以減少404錯誤，有助SEO分數。

另一個功能就是可以手動指定任一頁重新導向至另一頁，這常運用在網站改版或搬移。

除了直接的 URL 匹配之外，您還可以根據其他條件進行重定向：

登錄狀態 – 僅在用戶登錄或註銷時重定向
WordPress 功能 – 如果用戶能夠執行特定功能，則重定向
瀏覽器——如果用戶正在使用某個瀏覽器，則重定向
來源導向——如果用戶從另一個頁面訪問了鏈接，則重定向
Cookies – 如果設置了特定的 cookie，則重定向
HTTP 標頭 – 基於 HTTP 標頭的重定向
自定義過濾器——根據您自己的 WordPress 過濾器重定向
IP 地址 – 如果客戶端 IP 地址匹配，則重定向
服務器 – 如果也託管在此服務器上，則重定向另一個網域

另很多人都以為它這是一支單純做轉址用的功能而已，很少想到它也可以用來做簡單的會員功能，例如不同角色登入就被導向去不同想給他看的頁面，或未登入的人會自動轉址去會員登入頁，或會員登出後自動導向至首頁等等…，可以發揮巧思就能做多重運用喔!

▼初始設置

▼基本用法

▼其它進階用法(即有條件的轉址，可參考官方說明)

總結

它對我已是每個新網站剛產生時的必裝外掛之一。

如何讓會員登出後自動轉址到首頁?(方法1)

2022-08-08 尚無留言

簡介 :

本文是要做到「讓會員登出後自動轉址到首頁」，一樣是靠這「Redirection」外掛即可，不用再安裝其它外掛，這樣可以讓外掛少裝一支，讓後台更乾淨。

運用範圍 :

只要是需要會員登入登出的網站，都完全適用。

範例 :

可試點一下會員登出的連結，如下 :

https://smallway.com.tw/wp-login.php?action=logout

它會自動偵側到登出後立即轉址到首頁。

說明 :

一般做會員登出，我們會在主選單中置入一個自訂連結名稱為「登出」，然後設置登出的連結為「 /wp-login.php?action=logout」，這樣就可以讓會員按一下登出了。

可是按了登出後，預設登出後會自動跳轉至WordPress預設的後台入口頁，

有時候為了資安考量，不想把真正後台的入口頁曝露出來，所以我們會讓一般會員登出後不要跳轉至後台的入口頁，所以一般會透過外掛或其它方式來設定這件事。

實作 :

1.外觀/選單 : 先在主選單中建立一個「登出」的選項，並加上登出網址為「 /wp-login.php?action=logout」。

2.設定路徑 : 後台/工具/Redirection

3.新增一轉址規則。

如下圖設定即可 :

圖②記得勾正規表達式，而圖①的內容貼上這段語法 :

				
					/wp-login.php\?loggedout=true.*

影片 :

無。

付費影片 :

無。

總結 :

以上的方式可以讓你在做會員功能時少裝一個外掛，而且上述的方式還可以再進階設定，「Redirection」外掛可以讓你也能根據會員角色來決定是否轉址，或轉址至哪一頁。

概說

2022-08-08 尚無留言

一般轉址，我們最常聽到的是「301轉址」或「302轉址」，301與302轉址時的效果都是一樣的，都是把網頁重新導向至另一頁，但其背後意義的話，就是用301與302來區分了。

名稱	定義
301轉址	是永久性轉址，將舊網頁流量與權重完全轉移到新網頁，搜尋引擎會視為同一頁面，例如有些頁面或文章的網址有修改但內容不變，若不做301轉址的話，若原本網址有被分享或被搜尋引擎收錄的話，有人點原網址就會失效，故必須做301轉址，讓舊網址的流量可以直接導向新的網址。
302轉址	是暫時性的轉址狀態，因而會被搜尋引擎視為兩個獨立存在的頁面，這樣就會有重複內容的問題，因此302轉址通常用於網站臨時維護的暫時性轉址，例如先轉去粉專或另一頁暫時性的公告頁面。

在WordPress其實不會刻意把這兩種分太細，一般最常用的就是301轉址為主。基本上你大概知道定義的區別就可以了，

本專題講的轉址，大都靠這支免費版的「Redirection」外掛，部分需求會靠jQuery來做轉址。

[Wordfence]如何開啟登入後台時配合手機動態密碼二階段驗證？

2022-08-08 尚無留言

簡介 :

讓管理員或特定人員登入後台時，可以有第二階段的動態密碼驗證，減少被駭的機會。

運用範圍 :

所有WordPress網站均適用，建議最好打開。

範例 :

輸入帳密碼，會再要求輸入第二組動態驗證碼。

原理與思路 :

這個也有單獨的外掛可以做，但若有安裝Wordfence防火牆的話，就不用再另裝外掛了。

實作 :

用想要打開二階段登入驗證的帳號登入網站後台，一般是管理員帳號或最高權限帳號。

1、下載【Google Anthenticator 】APP

2、打開Wordfence的二階段登入驗證

編輯個人資料，再點擊「Actibe 2FA」如下圖，

▼準備做掃瞄

3、第一次掃瞄

打開【Google Anthenticator 】APP按下「+」來掃瞄該上圖的QRcode③後會得到一個動態驗證碼，把該六碼驗證填入第2點的④處即可。

若出現下圖這個，這是你以後手機不在身邊時，可以用這個緊急備用驗證碼登入，可以先下載回來存在本機電腦中。(其實若沒有這個備用驗證碼，也可以從FTP登入網站外掛資料夾把Wordfence停用亦可，就能登入後台了，登入後再取消二階段驗證與重新再激活一次二階段驗證)

4、未來的登入方式

一樣照一般的方式登入後台，輸入帳密成功後會轉至二階段驗證，然後直接打開【Google Anthenticator 】APP查看最新的驗證碼即可，不用再掃QRcode了。

▼最新的驗證碼會一直在變化，要以下當下的為主

總結 :

除了demo用的網站，我每個網站都有打開，只要被駭一次你就會知道這有多重要!

常見的資安插件有哪些？我該如何選擇？

2022-08-08 尚無留言

簡介 :

每個網站，我強烈建議真的要安裝一套資安插件來擋掉一些常見的攻擊或入侵，不過也僅安裝一套就夠了，安裝超過二套以上反而會對網站效能產生負面影響。

運用範圍 :

凡是惡意攻擊、暴力登入、有害插件、植入有害代碼、全站掃描、事件通知等等，均可以讓資安外掛來負責處理。

實作 :

只要安裝一套就可以了，多裝無益。

整理幾套常見的，裝好後就做完基本設定後，就可以讓它常駐了!

名稱	評論	備註
*【Wordfence】	老牌，最多人使用，Wordfence常能掃出他牌不見得掃的到資安問題，但就是肥大了點，但我喜歡!	有二階段登入。須用Email註冊免費序號，這邊提供一組 : 點擊複製
【Pareto Security】	較輕盈。
【NinjaFirewall】	也是多人的選擇性之一。	有二階段登入。
【Jetpack – WP 安全性、備份、速度和成長工具】	很多人用，且它也內建其它功能。	有二階段登入。
*【iThemes Security】	也是滿多人推薦的，介面簡單。	有二階段登入。文件更改檢測。每日自動掃瞄兩次。
【MalCare WordPress Security Plugin – Malware Scanner, Cleaner, Security Firewall】	不愛用，每次安裝要填很多註冊資料。
【BBQ Firewall 】	輕量、安裝後完全不需要設定，就可以擁有非常好的防護效果。

總結 :

目前Wordfence雖是稍嫌肥大的一套，不過由於已經使用它好幾年，而且防範效果真的很不錯，就一直幫客戶還有自己的網站都用這套，暫時沒有再去安裝別套做防範效果測試!

▼Wordfence可以掃出有感染毒的檔案並一鍵清除

概說資安

2022-08-08 尚無留言

主機端，有主機商的資安防護，這是主機商該做的事，而我們網站端的資安防護，除了個人要有良好的使用習慣之外，也須安裝一套資安插件來協助保護網站。

例如你不小心從路上下載來路不明的外掛，造成資安上有所疑慮或可能的因此外掛有問題而造成你網站被駭，此時主機端的防範並不會知情也不會發現你網站被駭，因主機端在資安上所防範的並不是這類的事件，所以你網站端上的資安防範，仍然要做，不可有那種我主機商很強，我網站一定是安啦的錯誤認知!

在WordPress網站端中最常見的資安作法，就是安裝「資安相關」的插件，但「資安相關」的插件選擇性上也很多，除了慎選一套防範功能不差、不拖緩過多網站效能之外的插件，再來就是設定或運用資安插件中所附帶的功能。

有時候我們尚須怎樣應變已經被駭或出現資安問題的網站，當網站真的被駭時，首先會運用資安外掛來掃瞄與修復，如果真的修復不了，可能要人工去檢查研究出問題的檔案可能在哪個路徑，反覆對照與測試，再不行可能就要走上「還原」的方式(所以主機商有沒有每日備份的功能超重要)。

我們都不是網路安全這方面領域工程師出身的，所以在網站被駭時我們能處理的方式有限，當覺得所有能做的都做過了，最後一途就是「還原」了，但是在我接案七年多來的心得，只要主機端、網站端的基本資安防範都有先做到，加上良好的網站使用習慣，網站很少出現被駭被入侵的情況，也正因我七年來遇上的情況並不多，所以這個專題的文章量可能比僅記錄我遇過或比較常用的方式，預計篇數不會太多。

簡介

運用範圍

範例

原理與思路

實作

付費內容，需支付 : 999 個學習幣

總結

簡介 :

範例 :

實作 :

簡介

運用範圍

範例

原理與思路

實作

影片

總結

簡介

運用範圍

範例

原理與思路

實作

1、Code Snippets(自訂片段程式碼)

2、新增程式碼

3、如何在登出後不要轉至首頁而是重導向其它頁面或外面的網址？

付費內容，需支付 : 100 個學習幣

總結

外掛資訊

說明

總結

簡介 :

運用範圍 :

範例 :

說明 :

實作 :

影片 :

付費影片 :

總結 :

簡介 :

運用範圍 :

範例 :

原理與思路 :

實作 :

1、下載【Google Anthenticator 】APP

2、打開Wordfence的二階段登入驗證

3、第一次掃瞄

4、未來的登入方式

總結 :

簡介 :

運用範圍 :

實作 :

總結 :

章節

1 個成員 正在線上

5 個訪客 正在線上

4 個檢索機器人 正在線上

1 個成員正在線上

5 個訪客正在線上

4 個檢索機器人正在線上