Wednesday, June 22, 2016

How to Fix Mixed Content Errors in Blogger Blogs !!!

Mixed Content Errors in Blogger
Few days ago I had published a post on Enabling HTTPS on Blogspot Domains. Beside bringing some advantage, Enabling HTTPS is also brings a problem named Mixed Content Error. But in the immediate update Blogger shows how to fix the Mixed Content Errors. If you haven't enabled HTTPS on your blog yet the first enable it, and then follow the rest of the post to fix the mixed content errors in your blog.




What are Mixed Content Errors?

When a web page becomes secured by SSL, but it contains both secure HTTPS and also the non-secure HTTP which is usually links, scripts, style sheets, video, and images. These browser errors will degrade both HTTPS security and the user experience of your blog. This means that source codes such as template, layout gadget, and post and paste may be causing the issues in the HTML side of the equation.


How to Find Mixed Contents:

Requirement: This method will only work on Google Chrome Browser. Use the latest version of Chrome.

  • Visit your Blog using HTTPS. fro example: https://livetechnologybd.blogspot.com
  • Then at the Right Top click on Chrome Menu and go to More Tools > Developer Tools > click on Console.
  • Or just press CTRL + SHIFT + J
  • Now look in the Console for mixed content errors which will look like show in the image below.
Find Blogger Mixed Content Errors

  • The types of Mixed Content Errors are also Include the following
  • Insecure Script Request
  • Insecure Image Request 
  • Insecure URL Request 
  • Make a list of all unsecured URLs and visit the other pages on your blog to check for other mixed content errors.

Fixing Mixed Content Errors in Posts/Pages:
  • First Sign into your Blogger Account and go to Dashboard.
  • Then click on Edit of the Posts/Pages that you Listed earlier
  • Once the Post/Page Editor opens, click on HTML tab.
Mixed Content Errors Blogger Post

  • Now press CTRL+F and Search for http:// inside the HTML tab.
  • Then Replace all http:// to https://
  • Verify all the URL after adding https:// to it by opening it in a new browser window. If the HTTP and HTTPS link give the same result, then everything is OK.
  • Finally click Update to save the post or page.


Fixing Mixed Content Errors in Template: This means that the Mixed Content Errors are may be found in the Template. Follow the steps below to fix them...
  • On your blog’s dashboard, click Template.
  • Then click one the Edit HTML to open the HTML Editor.
  • Now click inside the HTML Editor and Press CTRL+F to Search for htt://
  • Then Replace all http:// to https://
  • Verify all the URL after adding https:// to it by opening it in a new browser window. If the HTTP and HTTPS link give the same result, then everything is OK.
Mixed Content Errors Blogger Template

  • Finally click on Save Template button.

Fixing Mixed Content Errors in Layout:
  • From your Blog Dashboard click Layout and click Edit on All HTML/JavaScript
  • Find and Replace htt:// with https:// and save them.


Avoid Mixed Content Errors in Post/Page Editor:

To find and fix the mixed content errors automatically, blogger introduced a warning tool to alert about the possible mixed content inside the post. Let's see how to use this tool.
  • Open the Post/Page Editor by clicking Edit link.
  • Then click on HTML tab
  • Now click on the Publish/Update or Save button 
If the content has any errors, you’ll see them at the top of the editor along with the link to Fix or Dismiss them. 
  • Fix: This will fix the errors identified by the editor and save the post.
  • Dismiss: Dismiss will ignore the errors for this session.
  • Click on the Dismiss link to Fix the Errors and Update/Publish it .

Blogger Mixed Content Errors Fix


That's it, hope it will help you to fix the Mixed Content Errors of your Blog. However fixing this errors will help you to improve the performance of your blog, particularly when it come to pages which may have issue with mixed content generating errors.


Please Share This Post 
Stay with techie-asif.blogspot.com for more IT related post

No comments:

Post a Comment