Preload featured image

Home Forums Gillion Theme Preload featured image

Home Forums Gillion Theme Preload featured image

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    RESOLVED Posts
  • alfred
    Participant

    Hi there,

    I am inquiring if I can preload the featured image in blog posts so as to improve the LCP of my site – on mobile in particular. Site: parentingalpha.com

    Is there a CSS code I can use to do this?

    Thank you

    • This topic was modified 3 years ago by alfred.
    • This topic was modified 3 years ago by alfred.
    • This topic was modified 3 years ago by alfred.

    Hi @alfred,

     

    I hope you are well today and thank you for your question.

     

    You can’t achieve this using CSS code.

     

    You can achieve it by using the below solutions.

     

    https://wordpress.org/plugins/preload-images/

    https://perfmatters.io/docs/preload/

     

    Best regards,
    Shufflehound team

    alfred
    Participant

    Thank you for that. I will see what I can do.

     

    And still on the featured image, is there a way I can remove the parallax effect when scrolling. I use the slider post style, and I want the image to be static. Thank you.

    Could you please share the page URL from your site where the parallax effect is displaying so that I can help you?

    alfred
    Participant

    Practically all my posts and I believe this is the default effect in the Gillion theme.

    Example: https://parentingalpha.com/generation-years-chart-20th-to-21st-century-generations/

    What I want is for the slider image not to shift within its container and instead move as one item with the rest of the post content when scrolling downwards.

    Thank you.

    • This reply was modified 3 years ago by alfred.
    • This reply was modified 3 years ago by alfred.

    Solution for this topic

    You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    .blog-slider-item #jarallax-container-0 div {
        transform: none !important;
    }

    alfred
    Participant

    Thank you, Moderator. The code worked fine

    You are most welcome here 🙂

Viewing 8 posts - 1 through 8 (of 8 total)