如何使用filter來指定jetpack的圖片參數

最近發現如果開啟jetpack的話，在手機瀏覽網頁會讓產品縮圖的解析度太差。

主要是jetpack的參數fit為300，導致封面如果有上中文字體的話就會太糊。

可以透過程式碼片段外掛安裝後新增以下的程式碼hook即可。

add_filter( 'jetpack_photon_pre_args', function( $args ) {
    /**
     * 1. 檢查是否為手機版 wp_is_mobile()
     * 2. 檢查是否為 WooCommerce 相關頁面：
     * - is_shop(): 商店主頁
     * - is_product_category(): 產品分類頁
     * - is_product_tag(): 產品標籤頁
     * - is_product(): 產品內頁 
     */
    if ( wp_is_mobile() && ( is_shop() || is_product_category() || is_product_tag() || is_product() ) ) {
        
        // 設定適合行動裝置的高解析度尺寸 (Retina Ready)
        $target_width  = 600;
        $target_height = 600;

        // 強制注入 fit 參數：這會將圖片縮放至填充該尺寸，同時保持比例不變形
        $args['fit'] = $target_width . ',' . $target_height;
        
        // 移除 resize 參數以避免邏輯衝突
        unset( $args['resize'] );
    }
    
    return $args;
}, 20, 1 );

成果