cls problem

Home Forums All Other Themes cls problem

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #189395
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    Hi,

    Ia have problem with one of my pages loading time. https://www.doctorhouse.hu/laptop-szerviz-arak/
    The CLS (Cumulative Layout shift) is huge when loading desktop site (0.645)
    I use wp-rocket which helps with most of my pages but this one is still not good.
    Can you please help me with that?
    Thank you!

    #189413
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    Kindly use compressjpeg.com or tinypng.com to reduce sizes and compress all your images and reupload them.

    Lastly kindly use WP Fastest Cache plugin and ask hosting to have Zend Op Cache and PHP Server cache applied to your site or if they have NGINX available get them to use that.

    With all the above steps i am sure your site will be faster. Theme is just part of the entire WordPress website ecosystem and our themes are coded to be faster.

    Rest are all generic points i mentioned here.

    Regards,
    Chris

    #189414
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    Dear Chris!

    I already have done everything you wrote (caching, minifing pictures) and the site is fast in general.
    I only have problem with this one page https://www.doctorhouse.hu/laptop-szerviz-arak/
    The porblem itself is that the whole element with the prices loads in to the left side of the screen first
    then it shifts to the middle. That is causing the large cls number.
    Is it possible to load it directly to the middle?
    I do not mind paying for you to do some programming if needed.
    thanks!

    #189428
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .skt-builder-container { box-sizing: border-box; margin: 0 auto; max-width: 1170px; padding-left: 15px; padding-right: 15px;}
    .skt-builder-columns-row-2column .skt-builder-column { width: 50%;}
    .skt-builder-column { box-sizing: border-box; float: left; margin-bottom: 30px; padding-left: 15px; padding-right: 15px;}
    .skt-builder-menu-column .skt-builder-menu-column-info { margin-bottom: 20px; position: relative; padding-right: 100px;}
    .skt-builder-menu-column .skt-builder-menu-column-price { position: absolute; right: 0; top: 0; font-size: 22px; font-weight: bold; z-index: 9;}
    .skt-builder-menu-column .skt-builder-menu-column-image { border-radius: 5px; float: left; margin-right: 30px; margin-bottom: 20px; max-width: 32%;}

    Regards,
    Chris

    #189432
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    I copied it to the custom css, cleared cache but nothing changed unfortunately.

    #189435
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    Can you send us the screenshot of your issues after adding CSS? Upload your screenshot on https://imgbb.com/ and paste the share url here.

    Regards,
    Chris

    #189437
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    If you visit the site https://www.doctorhouse.hu/laptop-szerviz-arak/ in any browser you will see that content is loaded to the left side of the screen then it moves to the middle. I cannot take a screenshot of this, rather a video, but you can see any time if you load the page.

    #189438
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    This is done.

    Kindly delete cache and do a forced refresh.

    To do a forced refresh kindly follow below instructions:

    Windows/Linux:
    1. Hold down Ctrl and click the Reload button.
    2. Or, Hold down Ctrl and press F5.

    Mac:
    1. Hold Shift and click the Reload button.
    2. Or, hold down Cmd and Shift key and then press R.

    Regards,
    Chris

    #189446
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    Thanks now loading time for CLS is perfect.

    I have a new little problem now: the top-padding is missing now at the start page at the sections: Szolgáltatásaink, Márkafüggetlen notebook szerviz, Műhelytitkok, Fejlesztésünk a címlapon.
    AND on the site https://www.doctorhouse.hu/laptopszerviz/ top-padding is also missing and padding between the first and second and third section (3rd is the google map) is too big.

    THanks,

    #189456
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    #skt-builder-image-text-block-198 {
      padding-top: 80px !important;
    }

    Regards,
    Chris

    #189457
    Attila NagyAttila Nagy
    Participant
    • Topics: 12
    • Replies: 37
    • Total: 49
    Member since: May 20, 2019

    I copied but nothing changed. NOt cache problem
    I also tried
    .skt-builder-image-text-block-198 {
    padding-top: 80px !important;
    }

    #189486
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 31029
    • Total: 31029
    Member since: August 16, 2013

    Hi,

    We checked, this is working fine.

    Can you send us the screenshot of your issues after adding CSS? Upload your screenshot on https://imgbb.com/ and paste the share url here.

    Regards,
    Chris

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.