WooCommerce 的 Shop 頁面雖然有固定格式,依然可以在編輯器中輸入內容,輸入 shortcode 時會強制執行 wpautop,導致 shortcode 輸出帶上很多 p 和 br 標籤,其自帶 shortcode 亦無法倖免,使用 WC 2.2.4 時發現了這個問題。

問題描述

例如在商店頁面使用 featured_products shortcode,產生的結果如下圖所示,箭頭所指的位置是強制將換行符轉換成 p 導致的副作用,空的 a 標籤。

extra-p-tags

儘管這不會百分之百導致樣式問題,但能避免還是避免之。

原因

WooCommerce 的店鋪頁面最開始會輸出一段描述性文字,相當於文章的內容。一般輸出內容使用 the_content() 函式,而 WooCommerce 卻直接硬編碼了 wpautop,於是 shortcode 裡只要有換行就會被影響,一般的 remove_filter 方法無法解決。

wc-wpautp

解決

既然 wpautop 無法跳過,那隻能把 shortcode 中會讓 wpautop 起作用的因素去掉,即刪除換行符。

通常 shortcode 結尾會返回一段字串

...
return $output;

在返回前先刪除換行符和多餘空格,就能避免這個問題

...
return str_replace(array("
", "
", "
", "	", '  ', '    ', '    '), '', $output);