php 在WordPress中禁用lagest contentful paint中的延迟加载

ktca8awb 于 2023-01-12 发布在 PHP

关注(0)|答案(1)|浏览(116)

我发现this 2 year old solution本质上是计数的，并删除了加载属性，其中计数=1，并通过WordPress的snippets插件实现。
不幸的是，GTMetrix仍然标记“不要懒惰加载LCP”，当我在浏览器中检查图像时，我仍然看到每个帖子上的第一个（和每个）图像的属性加载=“懒惰”。
我怀疑它是计数的网站标志在标题作为第一个图像，但它也有加载=“懒惰”，所以它似乎是代码不工作。

WordPress 6.0.1语言
主题：你好元素或儿童
元素或元素或Pro
自定义帖子类型的JetEngine
Imagify用于webP转换和优化

我没有运行任何延迟加载插件，也不想禁用wordpress对所有图片的全局延迟加载，只想禁用LCP中折叠上方的图片。
我正在运行的代码片段：

/* Remove lazy load first image */
function add_responsive_class($content)
{
    if ( is_single() || is_page() || is_front_page() || is_home() ) 
    {
        $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
        $document = new DOMDocument();
        libxml_use_internal_errors(true);
        $document->loadHTML(utf8_decode($content));
        $imgs = $document->getElementsByTagName('img');
        $img = $imgs[0];
        if ($imgs[0] == 1) 
        { // Check first if it is the first image
            $img->removeAttribute( 'loading' );
            $html = $document->saveHTML();
            return $html;
        }
        else 
        {
            return $content;
        }
    }
    else 
    {
        return $content;
    }
}
add_filter ('the_content', 'add_responsive_class');

如果有人能帮助我了解为什么这不工作在我的网站或有不同的解决方案，我会很感激的帮助。

php

来源：https://stackoverflow.com/questions/73474538/disable-lazy-load-in-lagest-contentful-paint-in-wordpress

1条答案

按热度按时间

s5a0g9ez1#

如果你给予你的过滤器一个更高的优先级会更好。这可能是你试图删除一些仍然不存在的东西。Elementor负责图像的输出，它可能会在你的过滤器之后过滤内容，并在你的过滤器之后添加加载参数。
顺便说一句，你不知道所有的第一个图像是否总是可见的。想象一下，例如一个 accordion ，或类似的东西。我不是说你的脚本是无用的，但它并不总是保证最好的结果。确保你没有隐藏的图像。这也可能是你的脚本失败的原因。也许你正在删除加载参数的第一个隐藏的图像。
在隐藏图像的情况下，如果它们是延迟加载的会更好。但是如果在你的特定情况下，你确定，那么你应该没有问题。在这种情况下，检查过滤器的优先级。
您也可以在Elementor编辑器中删除延迟加载。您可以使用以下代码：

add_action( 'elementor/element/image/section_image/before_section_end', function( $element, $args ) {
    $element->start_injection( [
        'at' => 'after',
        'of' => 'link',
    ] );
    $element->add_control(
        'my_image_lazy_loading',
        [
            'label' => __( 'Lazy Loading','lazy-load-control-for-elementor' ),
            'type' => \Elementor\Controls_Manager::SELECT,
      'default' => 'lazy',
            'options' => [
                'lazy' => __( 'Lazy load','lazy-load-control-for-elementor' ),
                'no_lazy' => __( 'Do not lazy load','lazy-load-control-for-elementor' ),
            ],
        ]
    );
    $element->end_injection();
}, 10, 2 );

add_action( 'elementor/widget/render_content', function( $content, $widget ){
  if( $widget->get_name() === 'image' ){
    $settings = $widget->get_settings();
    if( isset( $settings['my_image_lazy_loading'] ) && 'no_lazy' === sanitize_text_field( $settings['my_image_lazy_loading'] ) ){
      $content = str_replace( ' loading="lazy"','',$content );
    }
  }
  return $content;
}, 10, 2 );

然后用户可以决定哪些图像不应该延迟加载。

赞(0）回复(0）举报 2023-01-12

我来回答

php 在WordPress中禁用lagest contentful paint中的延迟加载

1条答案

相关问题

热门标签

最新问答