How to Get Rid Of The Cumulative Layout Shift (CLS) in Divi | Tutorial

Поділитися
Вставка
  • Опубліковано 11 жов 2024
  • In this tutorial, you'll find out how to get rid of the cumulative layout shift (CLS) in Divi. CLS can impact your performance and SEO in a negative way and it also doesn't look professional to your website visitors.
    ➡ Written tutorial: richardpruzek....
    ➡ Follow me on Instagram: / richardpruzek

КОМЕНТАРІ • 38

  • @RAiDeRTuRbO2
    @RAiDeRTuRbO2 Місяць тому +4

    This is NOT how to address CLS properly and it's just a bodge-job patch that, in turn, will affect your LCP score negatively. If you don't understand the implications, don't implement this code on your website... :D

  • @nassimback
    @nassimback Рік тому +1

    this has saved my future with customers who uses divi, thank you so much

  • @SonnysSteaks
    @SonnysSteaks Рік тому +4

    What about mobile?

  • @SpadeAce
    @SpadeAce Рік тому +4

    Brother, I have been battling CLS on the new site I designed for 6 hours now. I resized everything, used transform options instead of margin and padding. I resized everything, even to the point it looked stupid. I even went so far as to delete everything and run PSI to see if it was PSI that was bugging or me. It kept saying I was at anywhere between .6 to 1.5 CLS all day long, no matter what I did.
    I inserted this script and CLS is literally at 0. You are a fucking boss. I love you buddy, liked and subbed.

  • @FriedBaconRPG
    @FriedBaconRPG Рік тому +2

    you sir, is OP, im saving this video for future.

  • @davehull9460
    @davehull9460 9 місяців тому +1

    This was SUPER helpful. Thank you!

  • @TommiPuuska
    @TommiPuuska Рік тому +3

    I see how this fixes the CLS issue but causes problems with high FCP and LCP instead because it waits the page to be loaded.

  • @danielvoelkwebdesign
    @danielvoelkwebdesign Рік тому +2

    Nice video Richard.. short and on point.

  • @FruitsHarvest
    @FruitsHarvest 8 місяців тому

    Awesome work! Thank you for that. Worked instantly ...

  • @vids2757
    @vids2757 8 місяців тому

    Wow. It works perfect. Thanks very much!

  • @ImranShaikh-mu1tn
    @ImranShaikh-mu1tn 5 місяців тому +1

    So no one noticed a significant jump on the Largest Contentful Paint score going up from 2.3s to almost 4s?

    • @RAiDeRTuRbO2
      @RAiDeRTuRbO2 Місяць тому

      It seems most are clueless about this, including the UA-camr himself... :D

  • @jasonpoonia
    @jasonpoonia Рік тому

    Amazing work man, keep it up!

  • @seancallanan8170
    @seancallanan8170 Рік тому +1

    Great video. Thanks!

  • @robertrado7576
    @robertrado7576 5 днів тому

    Hi, i understand what this have to do, but after saving the cahnges nothing happened, its not working, even i disable the cache plugin. Maybe something overrides it. Or? Somebody have the same issue, so the cls isnt changed at all...?

  • @dev3lop
    @dev3lop 11 місяців тому

    your script saved us. +1 follower.

  • @SolomonLangi
    @SolomonLangi Рік тому

    Wow it actually works! Thanks!

  • @anthoservais3351
    @anthoservais3351 Рік тому +1

    Thanks :) It works !

  • @jibzztube
    @jibzztube 11 місяців тому

    amazing Job friend

  • @mathieujaulin4925
    @mathieujaulin4925 8 місяців тому

    Thanks a lot !

  • @mynonblondes
    @mynonblondes Рік тому

    I’m having huge issues with trying to reduce the TTFB and battling. Any suggestions?

    • @richardpruzek2425
      @richardpruzek2425  Рік тому +2

      The TTFB depends on many factors, and your host is definitely one of them. The testing location is also important. Since I have my host servers in Germany, I always use London as a GT Metrix location as it delivers much better TTFB results than Vancouver for instance. The overall optimization, size, and complexity of your site also matter. I should also mention that Divi is not the best theme for performance (compared to eg Bricks Builder I've been using lately) but the good news is that Divi 5.0 is coming and performance should be one of the key improvements!

  • @lukasgie
    @lukasgie Рік тому

    Amazing! Thanks 💚

  • @DavidWoods-dk1cb
    @DavidWoods-dk1cb Рік тому +1

    I'm pasting the code into my head section but there are errors that pop up. Unfortunately, I don't know any CSS and would figure it out if I could. Is there something wrong that I'm doing because my CLS is remaining the same.

  • @soyleng
    @soyleng Рік тому

    O M FK GAD... ITS WORKS!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! THX DUDE!!

  • @remymorthier4032
    @remymorthier4032 Рік тому +1

    Cool trick but it makes the LCP explode

  • @LithiumFireX
    @LithiumFireX Рік тому +1

    This doesn't look like an actual fix, it's more of a dirty-ass patch.

  • @vadym.leonov
    @vadym.leonov 5 місяців тому +1

    It doesn't work for new versions of Divi.

  • @nasibulalamhimel
    @nasibulalamhimel 8 місяців тому

    Hi, if you use divi theme builder header template then see what happens. you can't solve anything until turn off the global header template.

  • @limitmania4755
    @limitmania4755 Рік тому

    I followed the written tutorial and I still have the same issues. The code isn't working, is there a fix for this?

  • @buyandsell4life783
    @buyandsell4life783 8 місяців тому

    great!!

  • @intuitivamkt
    @intuitivamkt 3 місяці тому

    Wont his impact SEO?

  • @michaelmarino1360
    @michaelmarino1360 7 місяців тому

    Didn't work for me. CLS went from 0.14 to 0.134. Tested on GPI and pingdom

  • @jakubhasak
    @jakubhasak 4 місяці тому

    link redirected to bbc webpage...