移除隱藏WordPress後台「個人資料」頁面欄位

WordPress客製化, 程式碼片段 /

這篇文章介紹如何移除或隱藏WordPress編輯使用者個人資料頁面不希望出現的預設欄位，甚至在安裝了一些外掛之後，也會出現額外的欄位，像是WooCommerce的帳單地址與寄送地址。

隱藏跟移除的差異

先解釋一下我這裡提到的「隱藏」與「移除」的定義：
「隱藏」是指程式會將欄位放入網頁原始碼裡頭，我們則是透過Javascript或是CSS的方式讓它看不見，實際上網頁原始碼還是有那些東西。
「移除」是告知程式不需要產生欄位，所以網頁原始碼不會有相關的資料存在。
一般來說，如果可以用「移除」的方式，我會優先使用。

程式碼片段放哪裡？

本文提到的程式碼片段(snippet)，可以透過幾種方式來放在WordPress網站：

  1. 做成外掛，然後安裝。(Must use plugin也屬於這種)
  2. 放在使用中佈景主題的functions.php檔案裡頭
  3. 透過外掛。例如：Code Snippets

如果不是一定要做成外掛才能生效的情況，我會建議用Code Snippets。
(之前有一篇關於使用Code Snippets製作短代碼的教學，可按此前往觀看。)

CSS的隱藏語法

以隱藏視覺化編輯器為例：

tr.user-rich-editing-wrap {
    display: none;
}

以隱藏姓氏為例：

tr.user-last-name-wrap {
    display: none;
}

但在新增使用者的頁面，由於他的欄位沒有加上CSS的class，所以用上述CSS隱藏的方式就不適合，可參考下一個方式用jQuery隱藏。

jQuery的隱藏語法

這個方式可同時隱藏新增使用者欄位與編輯現有使用者欄位，下方若有不需要隱藏的欄位可自行註解或刪除。

jQuery(document).ready(function(){
		jQuery('#rich_editing').parents('tr').remove(); //視覺化編輯器
		jQuery('#syntax_highlighting').parents('tr').remove(); //語法醒目提示	
		jQuery('#comment_shortcuts').parents('tr').remove(); //鍵盤快速鍵
		jQuery('#url').parents('tr').remove(); //網址
		jQuery('#last_name').parents('tr').remove(); //姓氏
		jQuery('#locale').parents('tr').remove(); //選擇語言
		jQuery('#role').parents('tr').remove(); //角色
	});

移除「管理後台色彩配置」

這也可以用上述的CSS或jQuery隱藏，但可以的話優先使用移除。

remove_action("admin_color_scheme_picker", "admin_color_scheme_picker");

移除「個人聯絡資訊」欄位

這段snippet可移除如下圖中AIM、Yahoo IM、Jabber 等欄位：
移除個人聯絡資訊欄位

function edit_contactmethods( $contactmethods ) {
  unset($contactmethods['yim']);
  unset($contactmethods['aim']);
  unset($contactmethods['jabber']);
return $contactmethods;
}
add_filter('user_contactmethods','edit_contactmethods',10,1);

新建立使用者時取消勾選寄通知信

這段是透過jQuery在新建立使用者時取消勾選寄通知信，如果有大量手動增加使用者，又不希望寄送通知信的時候很有用。也可以取消勾選後隱藏或不取消勾選直接隱藏。

add_action( 'user_new_form', 'dontchecknotify_register_form' );
function dontchecknotify_register_form() { 
    echo '<scr'.'ipt>jQuery(document).ready(function($) { 
        $("#send_user_notification").removeAttr("checked"); 
    } ); </scr'.'ipt>';
}

移除WooCommerce顧客帳單(運送)地址

若是有寄送實體商品的商店，帳單地址或運送地址要留一種，看你目前使用者哪一種地址是沒有資料的，表示沒在用，就可以移除。像優易教學網這種賣資訊商品的網站，用不到地址，兩種都可以移除。

add_action( 'user_new_form', 'dontchecknotify_register_form' );
add_filter( 'woocommerce_customer_meta_fields', 'my_remove_shipping_fields' );
function my_remove_shipping_fields( $show_fields ) {
    unset( $show_fields['shipping'] );
    unset( $show_fields['billing'] );
    return $show_fields;
}

相關外掛

  1. Edit Profile Fields：這套外掛可以做到上述提到的移除「個人聯絡資訊欄位」(AIM、Yahoo IM、Jabber)、以及移除「管理後台色彩配置」。另外也可以增加自訂的欄位，功能算是簡單，若是不想使用Snippets，也剛好只要移除這幾項，可以用這套。
  2. Profile & Dashboard fields [Modify/Disable/Remove]：這套外掛設計的角度比較特別，它對管理員是不隱藏或移除欄位，只對使用者介面做調整。若有這種需求的話，這套是不錯的選擇。
  3. 其他：有幾套外掛都太多年沒更新，就不建議安裝使用了。像是「Hide User Profile Fields」9年，「Simple User Profile」8年。雖然說這種外掛的功能很簡單，不太需要更新什麼，但作者也可以只更新相容WordPress版本，連這種更新也沒有的話，比較會讓人有所顧慮。

教學影片

[membervimeo id=”566002765″]
[freeyoutube id=”xOY44JT9s2M”]
訂閱我們的YouTube頻道並開啟小鈴鐺即可獲得最新更新通知。

相關文章

返回頂端