Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #281614
    Edwin
    Participant

    Hello, I want to preload a slider image but only on the front page. I have inserted some code into the header.php file and placed it in the child theme, and it is preloading the image. This works well. However, it preloads the image on every page. I only want it to preload on the front page. Can you assist me to wrap the link tag with a php if condition? The website is iglobal.net and the link tag I am using is: <link rel=’preload’ href=’/wp-content/uploads/2020/07/Playa-Hermosa-014-Home-Page.jpg’ as=’image’> Thank you!

    #281657
    Skandha
    Keymaster

    @mmhgloba: Hello there,
    I suggest you to create a child theme before editing any core theme files as all the changes will be lost when you update the theme to the newer versions.

    Try using the condition in the way mentioned in this link.

    Let me know if this works out!
    Kind Regards,
    Skandha

    #281667
    Edwin
    Participant

    Hi Skandha,

    Yes indeed, a child’s theme is a great idea, that is why I created one about 4 years ago. So that is already taken care of. Can you assist with the code?

    Thank you,
    Edwin

    #281668
    Skandha
    Keymaster

    @mmhgloba: Hello Edwin,
    I have attached a link in the reply above where the code is. Can you try using that?

    Let me know if this works out!
    Kind Regards,
    Skandha

    #281669
    Edwin
    Participant

    Hi Skandha,

    Thanks for the follow up. I noticed that and tried it. It is not working,. Please see the google lighthouse audit and also the screenshot of how I have code entered in the child’s theme.

    https://iglobal.net/wp-content/uploads/2021/05/Lighthouse-score.jpg
    https://iglobal.net/wp-content/uploads/2021/05/php-insert.jpg

    Please have a another look at it to resolve the issue.

    Thanks,
    Edwin

    #281734
    Edwin
    Participant

    This is resolved 🙂

    #281671
    Edwin
    Participant

    When I insert the code directly into line 41 in the child’s theme in this format – <link rel=’preload’ href=’/wp-content/uploads/2020/07/Playa-Hermosa-014-Home-Page.jpg’ as=’image’> – it works and the google error goes away and the performance score increases by 15 points. When I replace the above code with your code, it invalidates the preload. So the new code is blocking the preload command.

    But with the code inserted as described, it preloads the image on every page not only the home page.

    #281737
    Skandha
    Keymaster

    @mmhgloba: Glad the issue is resolved. Have a good day! 🙂

    Kind Regards,
    Skandha

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Preload Image’ is closed to new replies.