WordPress 開發人員最常犯的 10 個錯誤

已發表: 2022-03-11

我們只是人類,而人類的特徵之一就是我們會犯錯誤。 另一方面,我們也在自我糾正,這意味著我們傾向於從錯誤中吸取教訓,並希望因此能夠避免兩次犯同樣的錯誤。 我在 WordPress 領域犯的很多錯誤都源於在實施解決方案時試圖節省時間。 但是,當由於這種方法而出現問題時,這些通常會抬起頭來。 犯錯誤是不可避免的。 但是,從其他人的疏忽中學習(當然還有您自己的疏忽!)是您應該主動採取的道路。

工程師看起來像超級英雄,但我們仍然是人類。 向我們學習。
鳴叫

常見錯誤 1:關閉調試

當我的代碼運行良好時,為什麼要使用調試? 調試是 WordPress 內置的一項功能,它將導致顯示所有 PHP 錯誤、警告和通知(關於不推薦使用的函數等)。 關閉調試時,可能會生成我們從未見過的重要警告或通知,但如果我們不及時處理它們可能會導致以後出現問題。 我們希望我們的代碼能夠很好地與我們網站的所有其他元素一起使用。 因此,在向 WordPress 添加任何新的自定義代碼時,您應該始終在打開調試的情況下進行開發工作(但請確保在將站點部署到生產環境之前將其關閉!)。

要啟用此功能,您需要編輯 WordPress 安裝根目錄中的wp-config.php文件。 這是一個典型文件的片段:

 // Enable debugging define('WP_DEBUG', true); // Log all errors to a text file located at /wp-content/debug.log define('WP_DEBUG_LOG', true); // Don't display error messages write them to the log file /wp-content/debug.log define('WP_DEBUG_DISPLAY', false); // Ensure all PHP errors are written to the log file and not displayed on screen @ini_set('display_errors', 0);

這不是可以使用的配置選項的詳盡列表,但是這個建議的設置應該足以滿足大多數調試需求。

常見錯誤 2:使用wp_head Hook 添加腳本和样式

將腳本添加到我的標題模板有什麼問題? WordPress 已經包含大量流行的腳本。 儘管如此,許多開發人員仍會使用wp_head掛鉤添加其他腳本。 這可能導致多次加載相同的腳本,但版本不同。

在這裡排隊可以拯救,這是向我們的網站添加腳本和样式的 WordPress 友好方式。 我們使用入隊來防止插件衝突並處理腳本可能具有的任何依賴項。 這是通過使用內置函數wp_enqueue_scriptwp_enqueue_style分別對腳本和样式進行排隊來實現的。 這兩個函數的主要區別在於wp_enqueue_script我們有一個額外的參數,允許我們將腳本移動到頁面的頁腳。

 wp_register_script( $handle, $src, $deps = array(), $ver = false, $in_footer = false ) wp_enqueue_script( $handle, $src = false, $deps = array(), $ver = false, $in_footer = false ) wp_register_style( $handle, $src, $deps = array(), $ver = false, $media = 'all' ) wp_enqueue_style( $handle, $src = false, $deps = array(), $ver = false, $media = 'all' )

如果腳本不需要渲染首屏內容,我們可以安全地將其移動到頁腳以確保首屏內容快速加載。 在入隊之前先註冊腳本是一個很好的做法,因為這允許其他人通過他們自己插件中的句柄取消註冊您的腳本,而無需修改插件的核心代碼。 除此之外,如果已註冊腳本的句柄列在另一個已入隊的腳本的依賴項數組中,則該腳本將在加載突出顯示的入隊腳本之前自動加載。

常見錯誤 3:避免使用子主題並修改 WordPress 核心文件

如果您打算修改主題,請始終創建子主題。 一些開發人員會對父主題文件進行更改,只是在升級到主題後才發現他們的更改已被覆蓋並永遠丟失。

要創建子主題,請將style.css文件放在子主題文件夾的子目錄中,內容如下:

 /* Theme Name: Twenty Sixteen Child Theme URI: http://example.com/twenty-fifteen-child/ Description: Twenty Fifteen Child Theme Author: John Doe Author URI: http://example.com Template: twentysixteen Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-sixteen-child */

上面的示例基於默認的 WordPress 主題Twenty Sixteen創建了一個子主題。 這段代碼中最重要的一行是包含單詞“Template”的那一行,它必須與您要從中克隆子主題的父主題的目錄名稱相匹配。

同樣的原則也適用於 WordPress 核心文件:不要通過修改核心文件來走捷徑。 通過使用 WordPress 可插入功能和過濾器來防止您的更改在 WordPress 升級後被覆蓋,從而付出額外的努力。 可插拔函數可以讓你覆蓋一些核心函數,但是這種方法正在慢慢被淘汰並被過濾器取代。 過濾器實現相同的最終結果,並插入到 WordPress 函數的末尾以允許修改其輸出。 一個技巧是在使用可插入函數時總是用if ( !function_exists() )包裝你的函數,因為多個插件試圖在沒有這個包裝器的情況下覆蓋相同的可插入函數會產生致命錯誤。

常見錯誤 4:硬編碼值

通常,在代碼中的某處硬編碼一個值(例如 URL)看起來更快,但是在調試和糾正由此產生的問題上花費的時間要長得多。 通過使用相應的函數動態生成所需的輸出,我們大大簡化了後續代碼的維護和調試。 例如,如果您將站點從測試環境遷移到使用硬編碼 URL 的生產環境,您會突然發現站點無法正常工作。 這就是為什麼我們應該使用下面列出的函數來生成文件路徑和鏈接:

 // Get child theme directory uri stylesheet_directory_uri(); // Get parent theme directory get_template_directory_uri(); // Retrieves url for the current site site_url();

硬編碼的另一個不好的例子是編寫自定義查詢時。 例如,作為一項安全措施,我們將默認的 WordPress 數據表前綴從wp_更改為更獨特的東西,例如wp743_ 。 如果我們移動 WordPress 安裝,我們的查詢將失敗,因為表前綴可以在環境之間更改。 為了防止這種情況發生,我們可以引用wpdb類的表屬性:

 global $wpdb; $user_count = $wpdb->get_var( "SELECT COUNT(*) FROM $wpdb->users" );

注意我沒有使用值wp_users作為表名,而是讓 WordPress 解決它。 使用這些屬性生成表名將有助於確保我們返回正確的結果。

常見錯誤 5:不阻止您的網站被索引

為什麼我不希望搜索引擎為我的網站編制索引? 索引很好,對吧? 好吧,在構建網站時,您不希望搜索引擎索引您的網站,直到您完成構建並建立永久鏈接結構。 此外,如果您有一個測試站點升級的登台服務器,您不希望像 Google 這樣的搜索引擎將這些重複頁面編入索引。 當有多個無法區分的內容時,搜索引擎很難確定哪個版本與搜索查詢更相關。 在這種情況下,搜索引擎將懲罰具有重複內容的網站,您的網站將因此而在搜索排名中受到影響。

如下圖所示, WordPress 閱讀設置有一個複選框,上面寫著“阻止搜索引擎索引此站點”,儘管它下面確實有一個重要的注意事項,即“由搜索引擎來支持此請求”。

WordPress 閱讀設置

請記住,搜索引擎通常尊重此請求。 因此,如果您想可靠地阻止搜索引擎為您的網站編制索引,請編輯您的.htaccess文件並插入以下行:

 Header set X-Robots-Tag "noindex, nofollow"

常見錯誤 6:不檢查插件是否處於活動狀態

如果我的插件總是打開,我為什麼要檢查插件功能是否存在? 可以肯定的是,您的插件有 99% 的時間都處於活動狀態。 但是,那 1% 的時間由於某種原因被停用了呢? 如果發生這種情況,您的網站可能會顯示一些難看的 PHP 錯誤。 為了防止這種情況,我們可以在調用它的函數之前檢查插件是否處於活動狀態。 如果通過前端調用插件函數,我們需要包含plugin.php庫以便調用函數is_plugin_active()

 include_once( ABSPATH . 'wp-admin/includes/plugin.php' ); if ( is_plugin_active( 'plugin-folder/plugin-main-file.php' ) ) { // Run plugin code }

這種技術通常非常可靠。 但是,可能存在作者更改了主插件目錄名稱的情況。 更健壯的方法是檢查插件中是否存在類:

 if( class_exists( 'WooCommerce' ) ) { // The plugin WooCommerce is turned on }

作者不太可能更改插件類的名稱,因此我通常建議使用此方法。

常見錯誤 7:加載太多資源

為什麼我們應該選擇性地為頁面加載插件資源? 如果該插件未在用戶導航到的頁面上使用,則沒有正當理由為該插件加載樣式和腳本。 通過僅在必要時加載插件文件,我們可以減少頁面加載時間,從而改善最終用戶體驗。 以 WooCommerce 網站為例,我們只希望將插件加載到我們的購物頁面上。 在這種情況下,我們可以有選擇地刪除所有其他網站頁面上加載的任何文件,以減少臃腫。 我們可以將以下代碼添加到主題或插件的functions.php文件中:

 function load_woo_scripts_styles(){ if( function_exists( 'is_woocommerce' ) ){ // Only load styles/scripts on Woocommerce pages if(! is_woocommerce() && ! is_cart() && ! is_checkout() ) { // Dequeue scripts. wp_dequeue_script('woocommerce'); wp_dequeue_script('wc-add-to-cart'); wp_dequeue_script('wc-cart-fragments'); // Dequeue styles. wp_dequeue_style('woocommerce-general'); wp_dequeue_style('woocommerce-layout'); wp_dequeue_style('woocommerce-smallscreen'); } } } add_action( 'wp_enqueue_scripts', 'load_woo_scripts_styles');

腳本可以使用函數wp_dequeue_script($handle)通過它們註冊的句柄來刪除。 同樣, wp_dequeue_style($handle)將阻止加載樣式表。 但是,如果這對您來說太難實現,您可以安裝插件管理器,它提供了根據某些條件(例如帖子類型或頁面名稱)有選擇地加載插件的能力。 禁用任何緩存插件(如 W3Cache)是個好主意,您可能已打開這些插件以阻止您必須不斷刷新緩存以反映您所做的任何更改。

常見錯誤 8:保留管理欄

我不能讓所有人都能看到 WordPress 管理欄嗎? 好吧,是的,您可以允許您的用戶訪問管理頁面。 但是,這些頁面通常不會在視覺上與您選擇的主題集成,並且不提供無縫集成。 如果您希望您的網站看起來更專業,您應該禁用管理欄並提供您自己的前端帳戶管理頁面:

 add_action('after_setup_theme', 'remove_admin_bar'); function remove_admin_bar() { if (!current_user_can('administrator') && !is_admin()) { show_admin_bar(false); } }

上面的代碼,當複製到你的主題的functions.php文件時,只會為站點的管理員顯示管理欄。 您可以將任何 WordPress 用戶角色或功能添加到current_user_can($capability)函數中,以阻止用戶查看管理欄。

常見錯誤 9:不使用 GetText 過濾器

我可以使用 CSS 或 JavaScript 來更改按鈕的標籤,這有什麼問題? 嗯,是的,你可以。 但是,您添加了多餘的代碼和額外的時間來呈現按鈕,此時您可以使用 WordPress 中最方便的過濾器之一,稱為gettext 。 結合插件的textdomain ,確保 WordPress 可以區分所有加載的翻譯的唯一標識符,我們可以使用gettext過濾器在頁面呈現之前修改文本。 如果您搜索函數load_plugin_textdomain($domain)的源代碼,它將為您提供我們需要覆蓋相關文本的域名。 任何有信譽的插件都會確保插件的textdomain是在插件初始化時設置的。 如果您要更改主題中的某些文本,請搜索load_theme_textdomain($domain)代碼行。 再次以 WooCommerce 為例,我們可以更改出現在“相關產品”標題中的文本。 將以下代碼插入主題的functions.php文件中:

 function translate_string( $translated_text, $untranslated_text, $domain ) { if ( $translated_text == 'Related Products') { $translated_text = __( 'Other Great Products', 'woocommerce' ); } return $translated_text; } add_filter( 'gettext', 'translate_string', 15, 3 );

只要通過上述textdomain設置了文本域,這個過濾器鉤子就會通過國際化函數__()_e()應用於翻譯的文本。

 _e( 'Related Products', 'woocommerce' );

在您的插件中搜索這些國際化功能,以查看您可以自定義哪些其他字符串。

常見錯誤 10:保留默認永久鏈接

默認情況下,WordPress 使用帶有帖子 ID 的查詢字符串來返回指定的內容。 但是,這對用戶不友好,用戶在復制 URL 時可能會刪除 URL 的相關部分。 更重要的是,這些默認的永久鏈接不使用搜索引擎友好的結構。 啟用我們所謂的“漂亮”永久鏈接將確保我們的 URL 包含來自帖子標題的相關關鍵字,以提高搜索引擎排名的性能。 不得不追溯修改您的永久鏈接可能是一項非常艱鉅的任務,特別是如果您的網站已經運行了很長一段時間,並且您已經有數百個帖子已被搜索引擎索引。 因此,在您安裝 WordPress 之後,請確保您及時將永久鏈接結構更改為對搜索引擎更友好的內容,而不僅僅是帖子 ID。 我通常為我構建的大多數網站使用帖子名稱,但您可以使用可用的永久鏈接結構標籤將永久鏈接自定義為您喜歡的任何格式。

WordPress 固定鏈接設置

結論

本文絕不是 WordPress 開發人員所犯錯誤的詳盡列表。 但是,如果您應該從本文中學到一件事,那就是永遠不要走捷徑(在任何開發平台中都是如此,而不僅僅是在 WordPress 中!)。 現在通過糟糕的編程實踐節省的時間將在以後再次困擾您。 歡迎在下方發表評論,與我們分享您過去犯下的一些錯誤——更重要的是,從中吸取教訓。

相關:我的五個最糟糕的 WordPress 開發錯誤