Cloudflare point to my site, but Css is not working - css

I am using Cloudflare and pointing DNS to my website (000webhostapp using Wordpress). but CSS format is not working in my site. Whereas I use default DNS from web hosting or my DNS(not through Cloudflare), it works properly. please help me! thanks

Most likely mixed content error.
Mixed content is when your site is loading over HTTPS, however your code have references to images, scripts or css resources over HTTP so the browser blocks it from being loaded.
Please review the console logs in your browser's developer tools to verify this.
Cloudflare have an excellent guide on Troubleshooting mixed content errors
.
Enabling "Automatic HTTPS Rewrites" feature in your Crypto tab of your Cloudflare dashboard usually prove to be an easy fix.

Related

How can i create a custom CSS for a website hosted on Cloudflare

I want to make a website hosted on Cloudflare more beautiful by adding more css style to it and correcting some layout of some pages that are not good enough.
The challenges i'm having is that i don't know where to start, I logged into the cloudflare settings, theme settings but i didn't see the css of the pages i want to correct. I tried googling it and i couldn't find much help, I only notices that i can add CSS through Add CSS app but i don't know where or how.
Please help me with a link to something to read on how to customize cloudflare pages or tell me how to start it please.
Since you mentioned the website is hosted on Cloudflare, I'm assuming it's on Cloudflare Pages. You can't edit CSS through Cloudflare. Your code will be in either Github or Gitlab connected with your Pages project. Once you find your code repo, then only you can edit. Any changes should be updated on your Pages.
If your website is not on Pages, then it is on a web server hosted somewhere else. You'll need access to the server in order to make any changes. See the DNS records of your website's domain to find the IP of the server if you're not sure where it is hosted.

Mixed content error message in wordpress site

I have installed SSL in my hosting provider and tested it on whynopadlock.com/ , and it keeps saying my site is not fully secure:
Mixed Content: The page at 'https://mysite.nl/' was loaded over HTTPS, but requested an insecure image 'http://mysite.nl/wp-content/uploads/2019/07/bg-01-free-img.jpg'. This content should also be served over HTTPS.
Now when I look into media files in Wp, the link says https and not http. I have been looking for hours now and the plugins SSL Insecure Content Fixer and Really Simpel SSL havent been working either.
Any ideas to how to solve this would be appreciated!
Simply use this plugin for your website it will fix everything related to mix content and show your website secure with green signal.
Plugin name
Easy HTTPS Redirection
By Tips and Tricks HQ
Anyother help needed ? let me know.
Thank you

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.

Link generates https:// protocol when link should be http://

I've got this weird problem on one of my Wordpress sites and I hope you all could help out.
I have a this Wordpress site set-up and working correct. It has a SSL certificate so the URL is https://www.example.com.
Now if I add a link to one of my pages like this http://www.example_2.com it automatically changes the link to the https:// protocol. Which I find really strange because the link is literally <a href="http://www.example_2.com">.
Does anyone know why the link becomes https:// instead of the normal http:// protocol? Because my link is now giving an error when I click on the link and get send to the linked site.
I have googled this issue but it only give me results for how to configure your site for SSL (https://) and not for the issue I'm having...
Thanks in advance.
Your site probably is configured to immediately 302-redirect http requests to https.
What happens if you hit that site directly from your browser at http://www.example_2.com/ ? does it also bounce to https?
There is some chance your example_2.com site has enabled strict transport security. Read this. https://www.owasp.org/index.php/HTTP_Strict_Transport_Security_Cheat_Sheet
A lot of people are using links of the form
href="//www.example_2.com"
instead of
href="http://www.example_2.com"
these days to avoid this sort of confusion, and avoid mixed-content complaints. You might want to consider that. It's especially useful when you pull stuff from content delivery networks.

Broken CSS on old https pages

Hi i have a question about importing a wordpress.com site to a new self hosting wordpress site.
After completing the website i still have the old https links in search results showing broken css pages: example here. https://the3growbags.com/author/rhamscallion/
The new website does not use an SSL certificate and adding one does not solve the problem, anyhow we don't need SSL. This is the non-SSL website example: http://the3growbags.com/
Question is why are the old https links showing these broken CSS pages instead of unsecured connection pages, and how do I remove them from search results? help much appreciated.
All your resources are linked using http:// URLs, which result in mixed content which is normally blocked by browsers.
Make sure your resources are loaded using https and your site will work.
For this you could use the protocol agnostic URL style: "//domain.com/path"

Resources