在使用 Elementor Pro 3.21 後的版本開始的 WordPress 網站上，可能會注意到後台管理工具列中出現的 Elementor Notes 功能。這項功能設計為提供內部協作筆記，但如果您不需要使用，這些多餘的資源可能會佔用系統效能，導致前後台載入速度減慢。本篇文章將教您如何客製化移除 Elementor Notes，並停用其相關資源（JS 和 CSS），以提升網站效能和簡化後台管理工具列。
Elementor Notes 的功能與問題
Elementor Notes 是 Elementor Pro 引入的一個協作工具，讓團隊成員可以直接在設計介面中留下筆記。然而，如果網站沒有團隊協作需求，此功能會：
- 增加後台複雜性：管理工具列中顯示多餘的選項，干擾日常操作。
- 佔用前後台資源：會載入相關的 JavaScript 和 CSS 檔案，增加網站負擔。
若您確定不需要這個功能，可以透過以下程式碼來移除這些多餘的元素。
完整程式碼與解說
以下為完整的程式碼，包含移除 Elementor Notes 後台選項及停用相關資源。
1. 移除 Elementor Notes 從管理工具列中顯示
我們透過 admin_bar_menu 的 WordPress action，偵測工具列中是否存在 ID 為 elementor_notes 的節點，並將其移除。
function remove_elementor_notes_from_admin_bar($wp_admin_bar) {
// Check if the Elementor Notes menu exists and remove it
if ($wp_admin_bar->get_node('elementor_notes')) {
$wp_admin_bar->remove_node('elementor_notes');
}
}
add_action('admin_bar_menu', 'remove_elementor_notes_from_admin_bar', 999);運作原理：
admin_bar_menu：負責修改管理工具列的內容。get_node()：檢查是否存在指定的節點（ID 為elementor_notes）。remove_node()：移除符合條件的節點。
此部分確保在 WordPress 後台工具列中，使用者不再看到 Elementor Notes 的選項。
2. 停用 Elementor Notes 的 JS 與 CSS 資源
為了最佳化網站效能，我們需要停用與 Elementor Notes 功能相關的資源載入，避免不必要的資源浪費。
function disable_elementor_notes_assets() {
// Dequeue any Elementor JS or CSS related to the Notes feature
wp_dequeue_script('elementor-pro-notes');
wp_dequeue_script('elementor-pro-notes-app-initiator');
wp_dequeue_style('elementor-pro-notes-frontend');
}
add_action('wp_enqueue_scripts', 'disable_elementor_notes_assets', 20);運作原理：
wp_dequeue_script()：停用指定的 JavaScript 檔案。wp_dequeue_style()：停用指定的 CSS 檔案。wp_enqueue_scripts：負責控制網站前台的資源排程。
這段程式碼針對前台載入的資源進行最佳化，減少多餘的 JS 與 CSS 資源，提升網站載入速度。
如何將程式碼應用到網站
您可以將上述程式碼整合到 WordPress 的佈景主題中，方法如下：
- 使用 Code Snippets 外掛：
- 安裝並啟用 Code Snippets 外掛。
- 新增一個 Snippet，將程式碼貼入，設定為「僅作用於網站前台」。
- 儲存並啟用。
- 直接修改 functions.php：
- 進入網站佈景主題的目錄。
- 打開
functions.php檔案，將程式碼複製並貼上。 - 儲存檔案並上傳回伺服器。
建議使用 Code Snippets 外掛，因為此方法更直覺、安全，不會因佈景主題更新而導致程式碼遺失。
執行後的效果
應用程式碼後，您將會發現：
- 管理工具列中的 Elementor Notes 選項消失。
- Elementor Notes 的 JavaScript 與 CSS 資源不再載入，網站效能提升。
如果未來需要重新啟用 Elementor Notes，只需停用這些程式碼即可。
注意事項
- 備份網站：在編輯程式碼前，務必備份網站，避免操作失誤導致網站無法運作。
- 測試環境：建議在開發環境中測試程式碼，確認效果後再部署至正式網站。
- 佈景主題更新問題：若直接修改
functions.php，佈景主題更新後程式碼可能被覆蓋，建議使用子佈景主題或 Code Snippets 外掛。
移除不必要的功能和資源是維持 WordPress 網站效能的關鍵之一。通過移除 Elementor Notes 的後台選項和相關資源，您可以讓網站更加簡潔、快速。
