by Rain Chu | 3 月 28, 2023 | PHP, woocommerce, wordpress, 程式
許多擁有會員的 wordpress 用戶都希望在用戶登出後能將他們重新定位到特定的頁面,此功能在提供用戶的體驗流程時候非常好用,在登入的時候,以下將提供方法,方便大家可以使用此功能
在 functions.php 撰寫程式碼
可以直接在佈景主題下的 functions.php 中把登出後的導向頁面程式碼加入,加入方法如下
1.找到 wp-content 然後 themes 和你現在在使用的主題文件夾
2. 編輯 functions.php
3.加入以下代碼
3.1 登出後直接導引到首頁
add_action('wp_logout','auto_redirect_after_logout');
function auto_redirect_after_logout(){
wp_safe_redirect( home_url() );
exit();
}
3.2 登出後導引到特定頁面
add_action('wp_logout','auto_redirect_external_after_logout');
function auto_redirect_external_after_logout(){
wp_redirect( 'https://www.yourwebsite.com' );
exit();
}
3.3 採用 add_filter 來實作導引到特定頁面
function custom_logout_redirect($logout_url) {
$redirect_page = 'https://yourwebsite.com/your-redirect-page/';
return add_query_arg('redirect_to', urlencode($redirect_page), $logout_url);
}
add_filter('logout_url', 'custom_logout_redirect');
其中 yourwebsite.com 要置換成你自己想要導引過去的頁面
4.將 functions.php 存檔並且關閉
之後就可以自定義客戶登出的行為了
參考資料
by Rain Chu | 3 月 21, 2023 | PHP, wordpress, 程式
想要客製化會員登入 WordPress 後的行為,例如說要跳到某一個指定的網頁,其實有很多個外掛可以使用,例如:https://www.paidmembershipspro.com/ ,但麻煩的就是常常會跟其他的會員外掛衝突,而且為了一個小功能,要一個龐大的會員系統來支撐,不太划算,建議可以自行寫寫看。
佈景主題 Functions.php
其實只要找到佈景主題下的 functions.php 然後加入以下程式碼即可
function my_login_redirect( $redirect_to, $request, $user ) {
//檢查是否有建置會員制度
if (isset($user->roles) && is_array($user->roles)) {
// 檢查是否為管理者
if(in_array('administrator', $user->roles)){
// 每次當入都到 woocommerce 的管理頁面中
$redirect_to = home_url('wp-admin/edit.php?post_type=shop_order');
}
//確認是不是訂閱會員
else if (in_array('subscriber', $user->roles)) {
// 導向指定頁面,程式範例是導向會員專屬頁面。
$redirect_to = home_url();
}
}
return $redirect_to;
}
add_filter( 'login_redirect', 'my_login_redirect', 10, 3 );
區分權限
管理員登入 WordPress 後,預設會到 /wp-admin 中,一般的使用者登入後通常是引導到首頁,或是他自己的介紹頁,要區分管理員或是一般使用者則可以使用 in_array(‘administrator’, $user->roles) 做判斷
// 判斷是否為管理員
in_array('administrator', $user->roles)
自己寫就是有一個好處,可以完全客制使用者行為,也比較輕量,真的有問題就問 ChatGPT 4 大神吧
參考資料
by Rain Chu | 2 月 14, 2023 | CSS, Divi, woocommerce, wordpress, 設計
如果你有需要想要讓 WordPress 的 Woocommerce 在手機版本的商店頁面中顯示兩欄的商品,那最好的方法要自訂 CSS ,我在這邊展示的是用 DIVI 佈景主題來做自訂CSS,如果你是別家的也是都一樣的方法。
只要把下面的CSS複製起來
@media only screen and (max-width:768px) {
.woocommerce-page ul.products{
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
flex-flow: row wrap;
}
.woocommerce-page ul.products li.product{
flex: 0 0 50%;
-webkit-box-flex: 0;
padding: 10px;
}
}
貼到你的佈景主題中的自訂CSS的位置上就可以了
by Rain Chu | 8 月 4, 2022 | wordpress, 未分類
Divi 真的是一個很好用的佈景主題,其實他的英文介面我已經看了很習慣了,但還是有太多的名詞,對於剛接觸的編輯來說,摸不著頭緒,所以就有了要找中文化的需求,網路上用Divi的人很多,可以很快的鎖定幾個解決方案,目前用起來最佳解釋採用Make9大大的版本。
安裝說明
下載zip檔案後,分別把 corelang, lang, languages, 複製到 Divi 佈景主體下,並且合併 functions.php 即可,操作如下:
1.解開壓縮檔後,會看到這些資料
2.複製目錄到 Divi 佈景主體的目錄下
sudo cp -R ~/Make9_Divi_zhtw_20220412v22/corelang/* /var/www/wordpress/wp-content/themes/Divi/corelang/
sudo cp -R ~/Make9_Divi_zhtw_20220412v22/lang/* /var/www/wordpress/wp-content/themes/Divi/lang/
sudo cp -R ~/Make9_Divi_zhtw_20220412v22/languages/* /var/www/wordpress/wp-content/themes/Divi/languages/
sudo chown -R www-data:www-data /var/www/wordpress/.
3.整合你的 functions.php,將下面的程式碼複製到你原本的 functions.php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
load_theme_textdomain( 'Divi', get_stylesheet_directory() . '/lang' );
load_theme_textdomain( 'et-core', get_stylesheet_directory() . '/corelang' );
load_theme_textdomain( 'et_builder', get_stylesheet_directory() . '/languages' );
下載點
https://drive.google.com/file/d/1fozK6-0dRTgOzbMOse6DoyesJUzsdMPa/view?usp=sharing
參考文章
近期留言