最常見的 WordPress 主題開發錯誤（以及如何修復它們）

已發表: 2019-05-14

將主題提交到 WordPress.org 主題目錄是分享您的工作並為 WordPress 社區做出貢獻的好方法。目前，該目錄中有超過 7000 個主題，其中最受歡迎的主題超過 300,000 個活躍安裝。（不包括與 WordPress 一起打包並安裝數以百萬計的 20____ 主題。）

在將您的主題提交到目錄之前，首先了解審核過程很重要，因為如果您的主題不符合這些要求，它可能會被當場拒絕。

具有 3 個或更多不同問題的主題可能會因未獲批准而關閉。但是，主題作者可以在糾正問題後重新提交主題。
https://make.wordpress.org/themes/handbook/review/required/

審閱者站在您這邊，希望看到您的主題上線，只要它符合要求的標準。如果您的主題只有小問題阻止它被包含在目錄中，您的審閱者將與您一起修復這些問題。

不幸的是，如果您的主題有太多問題，它將被視為未獲批准而關閉。如果您決定解決問題，您可以再次上傳主題 - 但它將加入隊列的後面。

根據我審查 100 多個主題的經驗，我已經能夠確定阻止主題獲得批准的最常見問題。通過在本文中與您分享這些內容，我希望可以幫助您避免陷入隊列或被拒絕。

上傳您的主題

當您上傳主題時，它會加入要審核的隊列。平均而言，您的主題需要兩個月的時間才能排到隊列的最前面並獲得第一次審核。所有審稿人都是志願者，可用於完成審稿的時間有限。多種因素會影響等待時間。當更多人自願審查主題時，隊列會迅速移動。相反，當提交有很多問題的主題時，它會減慢隊列。

通過提交滿足所有要求的主題，它會使審核過程更加順暢，最終您的主題將更快上線。在本指南中，我們將探討最常見的問題，這些問題會使您的主題排在隊列中並阻止其獲得批准。

注意：具有提交無問題主題記錄的主題作者可以申請成為“受信任的作者”。

命名問題

當您上傳主題時，執行的第一個檢查是查看名稱是否已被佔用。即使您在目錄中看不到具有該名稱的主題，您經常會被告知您選擇的名稱已被佔用。

怎麼可能？原因是測試不只是檢查目錄，而是檢查整個 WordPress 生態系統。如果某個主題已在任何地方（Github、ThemeForest 等）發布並且有超過 50 個活動安裝，則該名稱將無法使用。

注意：如果您在其他地方發布了您的主題並累積了 50 次以上的安裝，您仍然可以在目錄中使用該名稱。

未轉義的輸出

主題審閱者非常重視安全性，甚至還有專門的資源。可以寫一篇關於編寫安全主題的整篇文章，但在本節中，我們將探討一個方面：轉義輸出。

未轉義的輸出會使您主題的用戶面臨風險。下面是一個非轉義值 ($title) 的示例：

 $title = get_option('my_custom_title');
迴聲'<h2>'。 $標題。 '</h2>';

上面的問題是，雖然我們知道 $title應該是什麼類型的值，一個字符串，但我們沒有檢查是否是這種情況。

如果黑客設法更改了數據庫中“my_custom_title”的值，您的主題將輸出該值。這帶來了巨大的風險，因為他們可以用內聯 Javascript 替換預期的輸出：

 alert('這很危險');

解決方案是轉義所有輸出以確保它只包含我們期望的數據類型。

我們的示例可以這樣修復：

 $title = get_option('my_custom_title');
迴聲'<h2>'。 esc_html($title)。 '</h2>';

使用 esc_html 的缺點是它會去除所有 HTML 標籤。如果 $title 包含粗體或斜體，例如：

 $title = '這篇文章<strong>非常</strong>有用';
迴聲 esc_html( $title );

“very”這個詞在前端不會加粗；相反，它會輸出代碼<strong>very</strong>。

這說明了為什麼對上下文使用正確的轉義函數很重要。如果我們期望輸出中有一些 HTML，我們最好使用 wp_kses_post() 或 wp_kses() 並設置 $allowed_html 參數。

輸出的函數也需要轉義：

 <a href="<?php echo esc_url(get_permalink()); ?>">

例外是名稱中包含“the_”的 WordPress 核心函數，這些函數通常已經被轉義。

 函數 the_permalink( $post = 0 ) {
    /**
     * 過濾當前帖子的永久鏈接的顯示。
     *
     * @since 1.5.0
     * @since 4.4.0 添加了 `$post` 參數。
     *
     * @param string $permalink 當前帖子的永久鏈接。
     * @param int|WP_Post $post 帖子 ID、WP_Post 對像或 0。默認為 0。
     */
    echo esc_url(apply_filters('the_permalink', get_permalink($post), $post));
}

無法翻譯的文本

要被目錄接受，所有主題都必須 100%“準備好翻譯”。這意味著您的主題輸出的每個文本字符串都必須是可翻譯的。

WordPress 已經擁有處理翻譯過程的系統和功能，您只需要確保您的字符串使用正確的功能。

雖然實現起來很簡單，但由於它與人們編寫 HTML 的方式背道而馳，因此經常被忽視。

通常，您可能會執行以下操作：

 <h1>404 - 未找到</h1>

為了使其可翻譯，您需要添加一些 PHP：

 // __ 函數是本地化的基礎。
<h1><?php echo __( '404', 'text-domain' ); ?>

// _e 函數回顯該值。
<h1><?php _e('404', '文本域'); ?>

// 轉義並回顯字符串。
<h1><?php esc_html_e('404', 'text-domain'); ?>

// 本地化和變量。
<h1><?php _n('一個帖子', '%s 個帖子', $count, 'text-domain' ); ?>

函數輸出的字符串也必須準備好翻譯：

 // 未準備好翻譯 :-(
<?php next_posts_link('舊條目'); ?>

// 翻譯就緒 :-)
<?php next_posts_link( esc_html__( '舊條目', '文本域' ) ); ?>

提示：codex.wordpress.org 中的很多代碼示例不使用翻譯功能，因此在復制和粘貼時要小心。

不正確地排隊資源

您的主題使用的 .css 和 .js 文件必須使用正確的函數進行排隊：wp_enqueue_style() 用於 CSS 和 wp_enqueue_script() 用於 Javascript。

一個常見的錯誤是將腳本和样式直接硬編碼到 <head> 或 </body> 之前。這種方法有兩個問題：

1. 無法刪除

如果插件需要刪除您已加載的資源，這是不可能的。如果您使用了正確的入隊函數，則可以這樣做：

 /**
 * 將主題 javascript 出列。
 *
 * 與 wp_enqueue_scripts 動作掛鉤，具有後期優先級 (100)，
 * 所以它是在腳本入隊之後。
 */
函數 wptavern_dequeue_script() {
   wp_dequeue_script('主題腳本');
}
add_action（'wp_enqueue_scripts'，'wptavern_dequeue_script'，100）；

2.重複加載

如果您將資源（例如 jQuery）加入隊列，並且插件也將其加入隊列，則 WordPress 足夠智能，只需加載一次。

 /**
 * 排隊 jQuery
 *
 * jQuery 只會加載一次，儘管有兩個入隊。
 * jQuery 與 WordPress 打包在一起，因此我們不需要指定 src。 
 */
函數 wptavern_enqueue_script() {
   wp_enqueue_script('jquery');
   wp_enqueue_script('jquery');
}
add_action（'wp_enqueue_scripts'，'wptavern_enqueue_script'）；

相反，如果您將 jQuery 硬編碼到您的 <head> 中，那麼 WordPress 將無法知道，它會被加載兩次。

插件區域功能

主題的範圍應僅處理網站的設計和美學，所有其他功能應由 WordPress 本身或插件處理。

為了給他們的主題增加更多價值，主題作者經常嘗試加入額外的功能，例如 SEO 控件或自定義帖子類型。

將功能捆綁到主題中的問題是數據不可移植。以 SEO 控件為例，如果用戶更改了主題，他們將失去他們為優化頁面所做的所有工作。相比之下，通過使用 SEO 插件，數據和功能獨立於主題，並且在更改主題時將保留。

插件區域功能的一些示例：

分析/跟踪
搜索引擎優化控制
聯繫表格
簡碼
古騰堡街區

提示：如果您的代碼寫入數據庫，則很可能是插件領域。與設計相關的設置（側邊欄位置、顏色等）除外。

不加前綴

前綴是一種確保您的代碼不會與插件代碼衝突的方法。 PHP 中的命名空間是實現相同效果的更好方法。但是，一些用戶仍在使用不支持該功能的舊版本 PHP (5.2)。

Justin Tadlock 分享了一個應該加上前綴的常見事物列表：

PHP 函數名稱。
PHP 類名。
PHP 全局變量。
動作/過濾器鉤子。
腳本句柄。
風格手柄。
圖像尺寸名稱。

來源：https://themereview.co/prefix-all-the-things/

 // 函數示例。
my_prefix_example();

// 類示例。
類 My_Prefix_Example { … }

// 動作和過濾器示例。
do_action('my_prefix_action');
apply_filters('my_prefix_filter', $values );

// 將示例排入隊列。
wp_enqueue_script('my_prefix_script', get_template_directory_uri() . '/js/custom-script.js' );
wp_enqueue_style('my_prefix_style', get_template_directory_uri() . '/css/styles.css' );

// 圖像大小示例。
add_image_size('my_prefix_image_size', 220, 180); // 220 像素寬 x 180 像素高。

例外：在對第三方資源進行排隊時，不要添加前綴：

 // 將第三方腳本 (chosen.js) 加入隊列。
 wp_enqueue_script（'選擇'，get_template_directory_uri（）。'/js/chosen.js'）；

許可問題

您的主題及其所有文件必須 100% 兼容 GPL。這包括圖像、庫、腳本和字體。

所有第三方資源都必須列出其來源和許可信息。

這個要求可能特別棘手，因為並非所有許可證都對 GPL 友好。 Unsplash 許可證只有一個限制：

“此許可不包括從 Unsplash 編譯照片以復制類似或競爭服務的權利。”

然而，這一限制足以使其與 GPL 不兼容，因此，您不會在 wordpress.org 主題中看到 Unsplash 圖像。

此處提供了與 GPL 兼容的許可證列表 – https://www.gnu.org/licenses/license-list.html#GPLCompatibleLicenses

最近， stocknap.io 一直是該目錄中最常見的圖像來源，因為它們列出的所有圖像都被許可為 CC0（與 GPL 兼容）。

截圖錯誤

要求規定您的屏幕截圖應該是您的主題的未經編輯的表示，看起來不像廣告。這意味著沒有 Photoshop 工作、疊加層、邊框或花哨的效果。

圖像還必須遵循我們上面探討的相同許可要求。

獎勵：使用編碼標準

對你來說似乎很容易閱讀和理解的代碼，對於只有 10 到 15 分鐘來檢查你的代碼的審閱者來說可能是完全相反的。

雖然對編碼標準沒有要求，但遵循一個確實使您的代碼更易於閱讀、理解和維護。我個人使用並推薦“WordPress 編碼標準”，儘管還有其他標準。

在代碼編輯器中使用 PHP_CodeSniffer 和 WordPress 規則集可以更輕鬆地遵守標準 – https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards

結論

主題要求是在考慮最終用戶的情況下創建的。避免犯我上面列出的常見錯誤，您的主題將立即獲得批准。如果您想從另一邊體驗審稿過程，您甚至可以成為審稿人。