• Hi, loading Judge.me verified reviews badge via provided shortcode leads to following notice from Lighthouse / Google PSI:

    Image elements do not have explicit width and height
    Set an explicit width and height on image elements to reduce layout shifts and improve CLS.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hi there,

    Thanks for bringing it to our attention.
    You can fix this by adding the script below to your function.php file or you can add a 3rd party plugin like (Code Snippets) and add it as it is safer and allows you to disable the script at any time.

    add_action( ‘wp_head’, function () { ?>
    <script>
    function Fix() {
    document.querySelectorAll(“.jdgm-rev__pic-img”).forEach(function(x){x.setAttribute(“height”, “100px”)});
    document.querySelectorAll(“.jdgm-rev__pic-img”).forEach(function(x){x.setAttribute(“width”, “100px”)});
    }
    if (document.readyState === “complete”) {
    Fix();
    } else {
    window.addEventListener(“DOMContentLoaded”, Fix);
    }
    </script>
    <?php } );

    Thank you.

    Thread Starter titsmaker

    (@titsmaker)

    Thank you for the quick solution, but it seems your provided wrong selector (probably it’s related to my second topic – https://www.ads-software.com/support/topic/reviews-images-loaded-without-relnoopener/)
    Also, it would be nice if you fix this behaviour on your side in the future so we do not need to apply extra JS on the front-end.

    Hi,

    Note that the fix is for the images in the review widget (Product page), also I will make sure to forward this to our product team so they can check further.

    Thank you for your collaboration.

    Thread Starter titsmaker

    (@titsmaker)

    But the original question was about the verified reviews badge rendered via [jgm-verified-badge] shortcode. Unfortunately, badge image does not have any class so I am not sure how to target it.

    Thread Starter titsmaker

    (@titsmaker)

    Although you are right that this problem also affects Judge.me reviews images and customer location flag images (jdgm-rev__location-country-flag-img class).

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Verified reviews badge loaded without explicit width and height’ is closed to new replies.