اضافه کردن ویژگی loading=lazy به تصاویر خاص در وردپرس
اگر میخواهید ویژگی loading=lazy را برای برخی از تصاویر سایت خود اضافه کنید و این کار را با استفاده از آدرس فایل تصویر انجام دهید، این مطلب میتواند برای شما مفید باشد.
اضافه کردن ویژگی loading=lazy به تصاویر خاص در وردپرس
برای اینکار قطعه کد زیر را درون فایل funcations.php قالب فعال فعلی وردپرس خود قرار دهید:
function add_lazy_loading_to_specific_images($content)
{
$image_urls = [
'https://camelcase.ir/wp-content/uploads/image1.png',
'https://camelcase.ir/wp-content/uploads/image2.png',
'https://camelcase.ir/wp-content/uploads/image3.png',
'https://camelcase.ir/wp-content/uploads/image4.png',
'https://camelcase.ir/wp-content/uploads/image5.png'
];
foreach ($image_urls as $image_url) {
$content = preg_replace(
'/<img(.*?)src=["\'](' . preg_quote($image_url, '/') . ')["\'](.*?)>/i',
'<img$1src="$2"$3 loading="lazy">',
$content
);
}
return $content;
}
function enable_lazy_loading_for_images() {
ob_start(function($buffer) {
return add_lazy_loading_to_specific_images($buffer);
});
}
add_action('wp_loaded', 'enable_lazy_loading_for_images');
add_filter('the_content', 'add_lazy_loading_to_specific_images');
add_filter('widget_text', 'add_lazy_loading_to_specific_images');
add_filter('widget_text_content', 'add_lazy_loading_to_specific_images');
اگر نیاز به آموزشهای بیشتری در ارتباط با وردپرس دارید در بخش نظرات این نوشته همراه ما باشید.
برای امتیاز به این نوشته کلیک کنید!
[کل: 1 میانگین: 5]



















میشه این کد رو در قالب فرزند هم اضافه کرد؟
بله بهتر هم است.
میشه برای بعضی تصاویر lazy loading رو غیر فعال کرد؟
برای اینکار باید یا روی یک کلاس خاص اینکار را بکنید یا یک بخش خاص توضیح بیشتری بدهید تا به شما راهنمایی کنیم.
میشه lazy loading رو روی ویدئوها یا iframeها هم اعمال کرد؟
بله به جای آدرس فایل تصاویر و تگ تصاویر آن را تبدیل به ویدیوها کنید.
این کد با تمام قالبها و افزونهها سازگاره؟
بله سازگار است.
میشه به همه تصاویر سایت یکجا loading=lazy داد؟
بله میتوانید با regex به تمام تصاویر این مورد را اضافه کنید.