How to Migrate HTTP To HTTPS on Blogger with Custom Domain

Migrate http:// To https:// on Blogger with Custom Domain

I Have a Great News Or You Can Say A Gift For All Blogger Blogs But at First, Let Me Ask Some Question From You...?
Migrate HTTP To HTTPS on Blogger
  • Do You Want To Make Your Blogger Blog More Professionally..?
  • Do You Want To Make A Secure Connection Between Your Blog And Visitors..?
  • Do You Want To Make Your Blogger Fast Using CDN..?
  • Do You Want To Improve Your Blog’s Ranking On Google..?
  • Do You Want To Know How To Enable Free SSL Certificates On Blogger With The Custom Domain..?
If Your Answer Is “Yes” For All Above Question, Then You are at Right Place. We All Know That Blogger Platform Is Giving The Free SSL https:// Certificates For Blogspot And It Is A Nice Gift for Blogger. But We Also Knew That These SSL Certificates Are Only Available For Blogspot Subdomains, Means If You Are Using Any Custom Domain On Your Blogger Blog Then Not Able To Add Or Enable The Free SSL (HTTPS) Certificate On Your Blog.

But In Future Google may Release This Feature Soon For The Custom Domain Also, Why Waiting For Google When We Can Get The Free SSL Certificates For our Custom Domain. We Can Enable HTTPS On our Blogger Even If We Are Using A Custom Domain Name. This Is The Very Tricky Guide To Get Free SSL Certificates.

How To Migrate Blogger From HTTP to HTTPS Even You are Using A Custom Domain :

Add Cloudflare CDN On Blogger Blog:

Firstly, Create a new account on CloudFlare, and Then you will need to add your domain to it and Click on Scan DNS Records.
Add Website To CloudFare

After Adding Your Domain, It Will Take 1 Minute To Scan Your Domain’S DNS Records. Once Scanning Progress is Completed, CloudFlare Gives You Two Custom Name Server, And You Need To Replace Those With Your Default Domain Name Servers. Follow Below Steps To Add Cloudflare’s Nameservers In Your Domain Name...
  1. Open Your Domain Registrar Dashboard Or My Account Page, Then Go To Domain’s Setting
  2. There You’Ll See Something Like “Change Nameservers” Or Something Like Nameservers
  3. Then You Need To Select “Custom Nameservers” And Add The Cloudflare’s Nameservers Which Are Provided After Added Your Domain Name.

Once You Replace Your Nameservers With Cloudflare’s Nameserver, Means Your Domain is Now Using The Content Delivery Network.

Enable SSL Certificate (HTTPS) On Your Domain Name

  • Go To The “Crypto” Tab On CloudFlare’S Account
  • Then Select The “Flexible” Option From The SSL Section.
  • And Wait For SSL Authorize for your Site.
  • It will show Wait for 24 Hours for Authorizing SSL But It Will take 2-3 Hours.

Congratulation! You’ve successfully enabled the SSL (HTTPS) Certificates on your Blogger with Custom Domain.

Redirect domain, sub-domains, and Permalinks from HTTP to HTTPS:

This is the most Important Part Because You have to let your blog stop using the old HTTP and redirect your blog to new SSL (HTTPS). Follow all below steps carefully....
  • Go to the “Page Rules” tab and then you have to add 3 Page Rules as shown in below images.
  • But remember you need just to change “shayarilife.com” with your “Domain name”.

After creating all 3 Page Rules correctly, Go to the “Firewall” tab. In the Security Level section choose the “Low” option.  Now we no need of Cloudflare anymore, so log out your Cloudflare account.


Now What To Do With Blogger Theme

  • Now open your blog’s template HTML Editor
  • And search for the “</head>” tag (without quotes) and paste the following code above the </head>
<script>
$(document).ready(function()
{           $("a").each(function()
{             var i = $(this).attr("href");          
 var n = i.replace(http://www.yourdomain.com, "https://www.yourdomain.com");                               $(this).attr("href", function() {               return n             })           })         });       </script>
Now after This, find the Below code in Your Template:
<b:include data='blog' name='all-head-content'/>
Remove it and add the following code below the “<head>” tag
<link href='https://www.yourdomain.com/favicon.ico' rel='icon' type='image/x-icon'/>
<meta content='blogger' name='generator'/>
<link href='https://www.yourdomain.com/feeds/posts/default' rel='alternate' title='BLOGTITLE - Atom' type='application/atom+xml'/>
<link href='https://www.yourdomain.com/feeds/posts/default?alt=rss' rel='alternate' title='BLOGTITLE - RSS' type='application/rss+xml'/>
<link href='https://www.blogger.com/feeds/BLOGID/posts/default' rel='service.post' title='BLOGTITLE - Atom' type='application/atom+xml'/>
<!--[if IE]><script type="text/javascript" src="https://www.blogger.com/static/v1/jsbin/2591933621-ieretrofit.js"></script>
<![endif]-->
<meta expr:content='data:blog.url' name='og:url:domain'/>
<!--[if IE]> <script> (function() { var html5 = ("abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video").split(','); for (var i = 0; i < html5.length; i++) { document.createElement(html5[i]); } try { document.execCommand('BackgroundImageCache', false, true); } catch(e) {} })(); </script> <![endif]--> 
Now Save Your Template

One Last Things To Do

Analyzing and fixing the Mixed Content issue after adding SSL
Once your blog is on HTTPS then, you may have to change your blog content to make sure it works with HTTPS. If you don’t change this then you might be faced some Mixed Content issue in your blog after adding SSL.

So here’s method to check if your blog getting mixed content issue:
  1. First, visit your blog with HTTPS (https://www.yourblog.com ) in Google Chrome.
  2. Then press the Ctrl + Shift + J keys to open the Javascript console tab.
  3. Look for mixed content errors, there you’ll see some red colored errors in Security Section.


No comments

Theme images by merrymoonmary. Powered by Blogger.