WordPress自動給圖片增加fetchpriority屬性的作用和控制方法

美工學(xué)習(xí)

在wordpress升級到近期版本6.3以后，官方為了進(jìn)一步提升WP的html" target="_blank" class="relatedlink">seo表現(xiàn)，即在Largest Contentful Paint (LCP)方面的表現(xiàn)，會自動給一些圖片添加一個(gè)新屬性 – fetchpriority。字面意思可以理解為元素加載的優(yōu)先級。

正文中就發(fā)現(xiàn)有一部分圖片由原本W(wǎng)P自動給與的懶加載屬性（loading=lazy）變成了這個(gè)優(yōu)先加載屬性（fetchpriority=high）。

通常這個(gè)屬性會被添加在多圖文的第一張圖片中，如果第一張圖片是一張小圖片，則會順延至后面的圖片。這個(gè)過程不需要博客編寫者參與，WP會自動完成這項(xiàng)它自認(rèn)為的優(yōu)化工作，但對于代碼敏感的開發(fā)者，就有一點(diǎn)難受了。

如果一個(gè)頁面需要默認(rèn)所有圖片懶加載，不需要WP“自說自話”地定義優(yōu)先加載的圖片，怎樣去掉這個(gè)屬性呢？這里介紹有兩種方式。

第一種，徹底屏蔽掉fetchpriority這個(gè)屬性：

1. function brain1981_disable_fetchpriority( $loading_attrs ) {

復(fù)制代碼

第二種，給需要添加這個(gè)屬性的圖片一個(gè)“門檻”

1. function set_min_priority_img_pixels( $threshold ){
   
2.         // Set minimum threshold of 200x200 pixels for small thumbnail images.
   
3.         $threshold = 40000;
   
4.         return $threshold;
   
5. }
   
6. add_filter( 'wp_min_priority_img_pixels', 'set_min_priority_img_pixels' );

復(fù)制代碼

設(shè)置一個(gè)最小的圖片尺寸，如果你把40000這個(gè)數(shù)字替換得很大，理論上也等于完全屏蔽了這個(gè)屬性的生成。注意這里的40000指圖片的長寬像素乘積，即“像素面積”。

文章來源于

Brain的技術(shù)筆記

WP的升級，總能讓人學(xué)到一些新的前端小知識，雖然它們并不每次都是有用的，多知道一些總也沒有壞處。

道勤主機(jī)提供365天*24小時(shí)全年全天無休、實(shí)時(shí)在線、零等待的售后技術(shù)支持。竭力為您免費(fèi)處理您在使用道勤主機(jī)過程中所遇到的一切問題! 如果您是道勤主機(jī)用戶，那么您可以通過QQ【792472177】、售后QQ【59133755】、旺旺【詮釋意念】、微信：q792472177免費(fèi)電話、后臺提交工單這些方式聯(lián)系道勤主機(jī)客服！ 如果您不是我們的客戶也沒問題，點(diǎn)擊頁面最右邊的企業(yè)QQ在線咨詢圖標(biāo)聯(lián)系我們并購買后，我們?yōu)槟�免費(fèi)進(jìn)行無縫搬家服務(wù)，讓您享受網(wǎng)站零訪問延遲的遷移到道勤主機(jī)的服務(wù)！