0

I recently installed an SSL Certificate onto my hosting for my website (just a standard site). It's installed perfectly and I have updated my .htaccess file to force it for users with the following code:

RewriteEngine On
RewriteCond %{HTTP:X-Forwarded-Proto} !https
RewriteRule ^(.*)$ https://DOMAINHERE/$1 [R=301,L]

When I go to my site, the padlock changes from green to yellow (as in the logs it says that there is mixed content). In my case it is three images which are apparently loading over HTTP.

This is the code I have in my HTML for the three images which are causing problems. Note that other images hosted locally have no problems.

<!-- Slide 1 -->
        <li>
            <div style="background-image: url('images/homepage/slider-1/balcony-1.jpg')" class="header">
                <div class="header-center">
                    <div class="text-white">

                    </div>
                </div>
            </div>
        </li>

The errors I receive for the mixed content show that the last 2/4 on my first slider don't load over SSL and the final 1/3 of my second slider doesn't load over SSL.

I find this really strange and I have tried to do the following:

//directories/imagehere.png

It gets rid of the error but then doesn't display the image. In the logs it reports it couldn't find the image as it tried to find it from

http://directories/imagehere.png

Will be incredibly thankful if someone knows what's going on. If you need any extra information then please just let me know.

Thanks!

Richard Kho
  • 5,086
  • 4
  • 21
  • 35
bruceec
  • 1
  • 1

1 Answers1

0

The issue is that it can't find the images under HTTPS because the RewriteRule is routing all HTTPS requests to the home page.

Instead of allowing requests to come in on HTTP, it would be easier to redirect the initial requests to HTTPS, which will ensure all subsequent requests are HTTPS.

https://wiki.apache.org/httpd/RedirectSSL

user2182349
  • 9,569
  • 3
  • 29
  • 41