Website is not loading properly with HTTPS - css

I want to apply HTTPS on some selected pages of my website.
I tried doing that using .htaccess file but after that my site is not getting loaded properly. After HTTPS, my site is looking like it does not have CSS. Please help.

The problem here will be because of the way browsers block traffic from non-secure domains.
When you use the full URL for your content e.g. images, css, scripts. if you transfer to a secure domain e.g. https:// then anything using a http:// prefix will not be allowed as it will not have been transferred securely.
So, what you need to do here is to use relative paths when including your content. So instead of using http://www.domain.com/cssfile.css you would instead use /cssfile.css. So if your site IS using http:// then the content will be transferred using that protocol, but when you switch to the login page for instance which uses https:// the content will still get delivered, but instead using the secure protocol.

Related

Lightsail CDN is causing wordpress URLs to get remapped to http:// rather than https://

I set up lightsail with wordpress, and everything was working great up until I enabled the CDN. It seems that wordpress is now remapping some of its static content file names (but not all) to 'http://' rather than 'https://' causing a mixed content error.
When I access the lightsail instance directly using its static ip I dont have this problem, it works fine and all urls are 'https://'.
What gives? Why would wordpress be generating http instead of https urls, but only when I try to access it through the CDN? (and even more bizarrely its only some of the urls, most work just fine)
Check those URL rource if they are external or not make sure you have all data inside your hosting service and its getting fetched internally using Https peotocol. Further if you are fetching any external resource, then check if those using HTTP protocol
When you create your CDN there is an option in the Details tab called "your distribution pulls content from your origin using HTTP only" this option is by default selected. so if your instance has SSL installed then you have to select the other option called "your distribution pulls content from your origin using HTTPS only" then you should be fine.

Wordpress configuration Https causes website typography confusion

After setting up the Wordpress blog, the editor configured his own domain name to the Wordpress blog he set up. When configuring Nginx at that time, he found that when configuring HTTP, the website could be accessed normally and the layout would not be messy.However, when I matched it with Https protocol, I found that the website was accessible, but the whole layout of the website was messy. When I used F12 to check the status, I found that many js files could not be loaded successfully, which led to the typographical disorder.Want to ask everybody who has encountered this kind of problem, and how to solve?Thank you!
Your browser is blocking mixed content, i.e. content served from HTTP sources to a HTTPS website. Most modern browsers do this by default for security purposes.
Here is an explanation from the Mozilla docs: "If your website delivers HTTPS pages, all active mixed content delivered via HTTP on this pages will be blocked by default."
To fix the error, just make sure all of the css and javascript files you are including from external domains are using the HTTPS protocol in the src attribute.

How to check if a site that has HTTPS URLS has HTTP URLS active too?

I have a website that uses the HTTPS protocol. I need to check if there are non-HTTPS pages active on the site. Is there a way to identify them without crawling the entire site?
Load your website in an IDE (like PhpStorm, etc), and search for reference "http://".
When you develop your website and wants to refer an external file on other domain, and always use the same protocol, use "//" as protocol : instead of http://example.com/myfile.txt, use //example.com/myfile.txt

Why WordPress image link in not appearing after activating SSL?

I've successfully added SSL on my WordPress website and it's every URL is working well with https URL but there seems all images is missing. In dashboard, all images URL is converted to https URL but in front-end they are not showing any URL it just seems like
Please anyone could help me to solve this issue?
This is likely because the URLs to the images are now http, and may be being blocked by browser security settings. There's a handy plugin I often use to help sort out issues like this called Really Simple SSL:
https://wordpress.org/plugins/really-simple-ssl/
This plugin manages the URLs to include the correct protocol, etc. You may need to change any hard-coded URLs in your theme that do not use https however.

How to use http:// in https:// using iframe?

my website is ssl-enabled secure containg https://
Now i want to add a website link in my webpage using iframe which is in http://
How can i use it, Here problem is with http:// not working in https:// using iframe.
PLease give a solution
Thanks.
You can't, in many modern browsers because it is a major security issue. There's a workaround though, you can proxy the content via HTTPS. You have to create a something on HTTPS that fetches the unsecured content for you and passes it over TLS to the end user in the iframe. This, however, is not as trivial as it looks. Just fetching the content might not be enough, because the user might want/need to POST something back. And it's not just the content, but the headers too if you need to support cookies. And when the content you served over your proxy solution loads stuff via HTTP you end up with a mixed content warning.

Resources