Page under SSL looks crazy


#1

MamaTeaSocial.com

This is what my site looks like under https://

I’ve been having issues because it seems I have to wait a good long while for my settings changes to update.

Also, on a less important note, I have been reading up on stuff and this just isn’t quite clear to me- is there a way to redirect to https when using flexible? I am working on putting a certificate on my origin but it is taking longer than expected…


#2

That’s due to “Mixed Content.” Most of your resources are still listed as HTTP, so they’re not loading.

Try enabling: “Always Use HTTPS” and “Automatic HTTPS Rewrites”

The “Always HTTPS” will redirect to HTTPS when using Flexible or Full. The Auto Rewrites should fix the Mixed Content problem. Mostly. If it’s still not quite perfect, post back.


#3

I feel like I have been through weeks of ups and downs and learning in the past few days!

I just got a reply to a support ticket I submitted a couple of days ago, so my issues have really changed since then!

What she was saying here about some of the images not loading right using that setting has totally happened. The thing is that I did not write these images in as code. It is actually a wordpress site. I am going to go through and attempt updating each page and each post while I am on it through https.

Maybe I should just look into a http to https re-writing plugin for my wordpress site?

If you have any other suggestions, I am all ears!

Hi there,

Apologies for the confusion. I am seeing some mixed content errors. When I view your site at mamateasocial.com I can view the site fine. When I enter https:// mamateasocial.com it breaks the images on the page. Mixed content errors mean that your website is being loaded over HTTPS but some of the resources are being loaded over HTTP. To fix this you will need to edit your source code and change all resources to load over a relative path, or directly over HTTPS.

For example, if you load your images with a full URL:

<img src="http://example.com/image.jpg" />
You would want to change this to:

<img src="//example.com/image.jpg" />
By removing the http:, the browser will use whichever protocol the visitor is already using. See this article for more information.

An alternative option would be to enable the Automatic HTTPS Rewrites feature that can potentially fix these errors for you automatically. Do be aware that resources loaded by JavaScript or CSS will not be automatically rewritten and mixed content warnings will still appear.


#4

Yeah, it’s overwhelming trying to get all the pieces to fit together.

  1. Do you have Automatic HTTPS Rewrites enabled?
  2. Are you using Flexible SSL?

#5

I do and I am.

I am working on getting my Origin Certificate hooked up.

I filled out a support ticket with my host like you had suggested in my other thread, so I am just waiting to hear back about that.


#6

It looks like you’ve made a lot of progress with the Mixed Content.

Do you have access to the .htaccess file in the web directory on your server? If so, add this line:
Header always set Content-Security-Policy: upgrade-insecure-requests


#7

That seems to have done the job!! Thank you!


#8

Now might be a good time to pause…brew up some of your tea…and enjoy the weekend.


#9

This is probably the truest thing I’ve heard all week. I really appreciate all of your great help :slight_smile:
Thank you so very much.


#10

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.