Pro Tip: If possible, inform your existing subscribers and followers about the upcoming HTTPS switch through a short temporary post which can be deleted, at a later stage.Log into your Blogger dashboard and select the blog you want to switch to the HTTPS version. Take a backup of the blog before starting the process. So, here we go!
Secure Static Assets Included Within the Blogger Template
We'll start with switching all the external JavaScript and image files included in the template to their HTTPS versions. This process is a simple one.All you have to do is to inspect the entire template and to substitute
http with https for all the external JavaScript and image files.To access your blog's design template, go to Theme → Edit HTML option. Thereafter, you can start the inspection and substitution process as shown in the demo screenshot below.
Take your time for closely inspecting and correcting these static assets. If you feel a little uncomfortable, download the design template and edit it locally in a code editor. Thereafter, you can upload it back to the blog.Here I must mention an extremely important thing. Simply switching all static assets to the https version is just half the job done. One must check if each and every modified URL is actually working or not. To do so, simply try to open these modified URLs directly in a web browser.
If a URL is not working, provide an alternate https URL for that static asset before moving ahead.
<!--- Make sure the web form's 'action' attribute URL starts with 'https' --->
<form action="https://feedburner.google.com/fb/a/mailverify" method="post">
<input type="text" name="email" placeholder="Email Address" />
<input type="submit" value="Submit" />
</form>As shown in the demo code snippet shown above, make sure the URL included in the web form's
action="" attribute is a secure https link. Failing to do so will show a warning in modern web browsers whenever a user tries to submit the web form.A generic mixed content warning will also appear on the web pages having these insecure web forms. After securing all the static assets and web forms included within the design template, it's time to move on to the next step.
Secure All the Images Within All the Blog Posts
Now, this is a time-consuming step for old blogs having a decent-sized or a huge archive. If you do not complete this step, visitors' will see a mixed content warning for all the blog posts serving insecure images.Blogger platform automatically started generating secure URLs for all the images from the second quarter of 2016. So, most probably, you never have to process images within posts from this period onwards.
For older posts, you can follow this approach.
I prefer to start from older to newer posts and I'll recommend the same for you too. Open each post one by one and switch to HTML mode as shown in the image above.Thereafter, scan the entire blog post content and replace all the
http URLs with the https version for all the <img> tags. You have to repeat this process for all the blog posts.As I mentioned before, for a blog having a huge archive, this can be a very time-consuming task. To ease it and to speed up the process, you can use one of the text find-and-replace add-ons available for your preferred web browser.
At this stage, we've completed two important things. Firstly, we've secured all the static assets (including web forms) used in our design template and secondly, we've secured all the images included in our blog posts. Now, let's move ahead!
Check and Correctly Configure Domain's Host Records
Because this guide is aimed at Blogger blogs using a custom domain, it is quite obvious that you've already configured the host records for the same.In case, you've purchased your domain name from within the Blogger dashboard (directly from Google), you can skip this entire section. For others, who're using a 3rd-party domain registrar, continue with this section to make sure everything related to domain records is configured correctly.
To get started, go to Settings → Basic → Publishing → Blog Address option. Click the 'Edit' link available within this option and make sure the settings are somewhat similar to the one shown in a demo screenshot below.
There are three important settings one must note and confirm before moving ahead. Firstly, make sure the domain name has a www prefix.Secondly, you'll find two domain host records indicated in a red box above. Even if you've already configured these host records long back within your domain registrar's dashboard, I'll still advise to note them in a text editor to once cross-check it again.
And lastly, make sure the checkbox that automatically redirects non-www traffic to its www equivalent is active and checked.
Once domain settings at the Blogger end are checked, configured, and confirmed, it's time to check and confirm the host records at the domain registrar's end.
Following are the 6 mandatory domain host records one must configure for the proper functioning of a Blogger blog powered by a custom domain. Two of these are CNAME records and the rest four are A records.
A glimpse of these records is shown above. The first CNAME record's host should be set as www and the value (destination) field should be populated with ghs.google.com. which interestingly ends with a dot character. The TTL (Time to Live) field value should be set to 30 minutes.The second CNAME record's host entry is xxxxxxxxxxxx which is a random and unique alphanumeric string you can get from your Blogger dashboard which I've already discussed earlier in this guide.
The value (destination) field requires xx.xxxxxxxxxxxxxx.dv.googlehosted.com. which is again a unique alphanumeric string you can pick from your Blogger dashboard. Once again, the TTL (Time to Live) field value for this record should be set to 30 minutes.
To next four A records have the same @ value for the host field. The value (destination) field for all the A records should be populated with the IP addresses 216.239.32.21, 216.239.34.21, 216.239.36.21, and 216.239.38.21 respectively.
The TTL (Time to Live) value for all the A records should be set to Automatic.
If you struggle to configure these host records within your domain management dashboard, you can either look for the help docs specific to your domain registrar or you can ask one of the support guys to configure it for you.
Activate (Turn On) HTTPS for the Blog
This is the right time to turn on HTTPS for the blog. Remember, there's going to be a lot of work one must complete after successful activation of this setting.Pro Tip: Start this critical process at the weekends, and that too, at the off-peak hours.
Within your blog's dashboard, go to Settings → Basic → HTTPS option. Here you'll find two sub-options viz., HTTPS Availability and HTTPS Redirect. Initially, both these sub-options are set to No and are in a deactivated state.To get started, select Yes for the HTTPS Availability sub-option. Doing so will start the HTTPS configuration process and it may look like the demo shown below.
As soon as you'll activate the HTTPS configuration process, the dashboard will display a message stating the process is running in the background.At this point, the second HTTPS Redirect option is inaccessible because it is dependent on the completion of HTTPS configuration process. Generally, this configuration takes about 2 to 5 minutes.
After a few minutes, refresh the page to see if the process is now complete and the second redirection option is now accessible or not. If the configuration process is complete, you can open blog posts both with http and https URLs in a web browser.
But, this is not what we want. Our goal is to make sure that all the URLs of our blog open only and only with the https address.
That's where HTTPS Redirect option comes into play. Activating it (see image above) ensures that all the http traffic is automatically redirected to its https equivalent.Once both the HTTPS settings are activated successfully, you can try opening the blog with http, https, non-www, and www URLs in a web browser.
At this stage, if the blog doesn't open successfully, do not panic at all. It may take up to 5 minutes before the blog will start opening successfully in the browser. Thoroughly test if all the URL versions are correctly redirecting to the HTTPS version or not.
And, open the blog within all the major web browsers (not just the default one) to make sure it is working correctly in all of them without any issues or warnings.
Configure Important Settings After Successful HTTPS Activation
In the beginning of the previous section, I mentioned about post HTTPS activation jobs one must configure and complete without any fail.Failing to do so can result in stoppage or malfunctioning of several important features and services associated with a blog. Let's get started and complete these critical jobs one by one.
Add HTTPS property to the Google Search Console: Most bloggers use Google Search Console (formerly known as Google Webmaster Tools) to track search engine performance.
If you're already using Google Search Console, delete the existing blog property having the http address. Thereafter, add the https version of your blog to the new property.
If you're new to search console, here's a quick tutorial about adding your blog to it. Click ADD A PROPERTY button within your search console dashboard and type the address (HTTPS version of course) of your blog in the text field as shown in the image below.
After adding the blog address, go to the respective property's dashboard and select the Crawl → Sitemaps option. Here, click the ADD/TEST SITEMAP button and provide the sitemap address as shown in the image below.
Make sure to add atom.xml?redirect=false as the sitemap address in the provided text box. This step ensures that googlebot can start the site crawling process as soon as possible and all the http URLs can be replaced by their https equivalents in a timely manner.And last but not the least, you must specify the preferred domain that Google search engine should use while indexing the blog.
To configure this setting, go to Site Settings → Preferred domain option and select the www prefixed domain as shown in the image above.This completes all the essential search console settings. Let's move ahead.
Update the Feedburner feed address: Almost every blogger using the Google's Blogger platform prefer to go ahead with the Feedburner service to deliver fresh content to their email subscribers.
After HTTPS activation, one must complete two important actions within Feedburner account to ensure the RSS feed works properly without any issues.
First of all, select your blog's feed record within the dashboard and click the Edit Feed Details... option. Here update the Original Feed field replacing http with https as indicated in the image below.
Updating the original feed address alone is not enough. At this moment, the old feed cache stored in your Feedburner account still uses the http feed address.To resolve this issue, go to the Troubleshootize tab and click the Resync Now button. Doing so will ensure that the old feed cache is deleted permanently and the new feed address is used to pull fresh new content from the blog.
If you're using any other subscriber management service, simply update the existing feed address with its https equivalent within the service's dashboard.
Update the necessary Google Analytics settings: Almost every single website on the Internet uses Google Analytics to track and analyze traffic. And, I'm dead sure you're using the same for your blog too.
After turning on HTTPS for your blog, a couple of settings need to be changed within your Google Analytics dashboard. Failing to do so will disrupt accurate data collection.
To get started, go to your blog's GA dashboard and first go to ADMIN → Property Settings → Default URL option. Here, select the https:// option from the dropdown and click the Save button.And, after that, go to ADMIN → View Settings → Website's URL option. Here, once again select the
https:// option from the dropdown and save the modified setting.Modifying both these settings will ensure your blog's traffic data is not affected by the change in URLs.
Check and correct 404 page content: If you're using a custom 404 page for your Blogger blog, revisit the settings and make sure any images or links used for the content of this page starts with an https address.
Check and update static pages: Similarly, inspect content of each static page and substitute http with https for each of the links, images, scripts, and web forms included in these pages.
Update social media profiles and pages: And last but not the least, update your blog link with the https version for all the social media and services accounts where you've included your blog's address.
This completes the entire HTTPS activation process for a Blogger blog powered by a custom domain.