织梦cms文章内容图片延迟加载懒加载设置教程

图片延迟加载的原理

图片延迟加载的原理就是先不设置img的src属性，等合适的时机（比如滚动、滑动等）在动态去给img的src属性！

图片延迟加载的好处

减少对服务器的请求，降低服务器的带宽

织梦文章内容图片延迟加载懒加载

1、首先在head.htm模板文件中引入jquery和jquery.lazyload

<script src="jquery.min.js"></script>
<script src="jquery.lazyload.min.js"></script>
<script type="text/javascript">
    $(function() {
        $("img").lazyload({
            effect:"fadeIn"
          });
        });
</script>

2、其次打开included/extend.fuc.php，在最后面增加CimgUrl函数，下面域名部分为你的域名

function CimgUrl($newurl){
    $newurl = str_replace('src="/uploads/','class="lazy" data-original="https://www.hhymw.com/uploads/',$newurl);
    return $newurl;
}

模板调用：

{dede:field.body function='CimgUrl( me)'/}

也可以把PHP函数直接写到模板里面，模板调用：

​​​​​​​{dede:field.body function="str_replace('src="/uploads/','class="lazy"data-original="http://www.yoursite.com/uploads/', me)"/}