[Resolved] Background images served as HTTP instead of HTTPS

Home Forums Support [Resolved] Background images served as HTTP instead of HTTPS

Home Forums Support Background images served as HTTP instead of HTTPS

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #2038394

    Hi. My site uses HTTPS, secured by a LetsEncrypt certificate. Everything is working fine, apart from the background images which are being served as plain HTTP, not HTTPS like everything else on the site.

    The images in question are background images for the header and primary navigation. I tried removing and re-adding them, but it made no difference. Can anyone suggest what is going wrong?

    I have put a link to the site in the private info. I am still working on the live site, so it may keep changing.


    Customer Support

    Hi Bob,

    The theme itself has no control over the links or SSL certificates, so it should not be a theme issue.

    I would recommend to use a tool like this: https://www.whynopadlock.com/

    It should be able to tell you what your SSL status is and how to improve it.

    Let me know if this helps πŸ™‚


    Hi Ying. Thanks for your suggestions. I have tried “Why No Padlock” and carried out further testing with Firefox and Chrome. I’m sorry, but I don’t agree with the view that GeneratePress cannot be responsible for insecure page content.

    I think I can see where the problem lies. The background image is specified through an inline style sheet that is part of the main html document. This sets the styling for .site-header. It specifies a background-image with a url that has an HTTP prefix, rather than HTTPS. This means that the image is served insecurely while the rest of the page is secure.

    The place I have been looking is in /wp-content/plugins/gp-premium/backgrounds/functions/functions.php around line 1245. I think this is where the inline CSS is assembled. I suspect this is where the url for the background image is added with HTTP instead of HTTPS.

    Please note that you get different results when testing with Firefox and Chrome. In Firefox you see a padlock with an exclamation mark. It says “Parts of this page are not secure (such as images)”. Firefox Developer Tools confirms the same result.

    In Chrome it is different, because Chrome has a feature to automatically upgrade any insecure page content to HTTPS. The padlock shows the page is secure, but there is a console error message that says something like

    Mixed Content: The page at 'https://example.com/' was loaded over HTTPS, but requested an insecure element 'http://example.com/wp-content/uploads/2021/12/image.jpg'. This request was automatically upgraded to HTTPS, For more information see link below.

    I’d appreciate a comment from a dev.

    Customer Support

    The CSS is added by GP, that’s correct, but GP doesn’t have the ability to alter the link, it just uses whatever the image link is.

    For example, this site has a body background image added in the customizer, and as you can see, the image link is using HTTPS:

    Can you go to your media library, check what the link shows for the image?

    Let me know πŸ™‚


    Hi Ying. Thanks for these suggestions which have fixed the problem.

    When I checked the media library the links to all the images were shown with http. I wondered how to change it because this field is not editable.

    Then I found that the home url for the WordPress site was set as http, not https. Despite this, everything on the site worked correctly with https, apart from these background images.

    I changed the site’s home url to https in Settings>Wordpress address and Settings>Site address. I then had to delete and re-insert the background images. It seems to be OK now.

    Thanks for your help.


    Customer Support

    No problem Bob, glad you figured it out πŸ™‚

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