Step To Fix Mixed Content Blogspot with Cloudflare HTTPS Step To Fix Mixed Content Blogspot with Cloudflare HTTPS - The New Minded Step To Fix Mixed Content Blogspot with Cloudflare HTTPS Step To Fix Mixed Content Blogspot with Cloudflare HTTPS

Sabtu, 18 Jun 2016

Step To Fix Mixed Content Blogspot with Cloudflare HTTPS

22 comments

Cloudflare
Assalammualaikum and Good Morning,

Today I would make a simple step tutorial about how to fix mixed content blogspot with cloudflare https.

This tutorial for who used custom domain in blogspot platform and used Cloudflare service to get free HTTPS from cloudflare.

This step I have been test with using free account cloudflare and flexible ssl that have been provide by cloudflare services.

So yesterday I have make submit my problem to cloudflare suppport team which state in the problem is my domain is not getting green lock and getting orange lock like this picture.


So today cloudflare support team has been reply my message with giving this article that tell me my blog have mixed content so they give me this article to read How do I fix the SSL Mixed Content Error Message?

But after I done this step, which you need to load all javascript and image in https. and change it all url http to https (relative url). I still got this problem. 

And now I found major problem for this orange lock need to be change in blogspot theme html.

Here 3 Simple Step You Need To Do.

Step 1

View Page Source
 Go to your homepage blog. For example www.ahmadhasif.my and wait untill it done loading.

After that, right click and choose View Page Source.

Next press ctrl+f find this word  'X-UA-Compatible' or this phrase <meta content='blogger' name='generator'/>.

What you need to do is copy starting the <meta content='blogger' name='generator'/> untill
<!--[if IE]><script type="text/javascript" src="https://www.blogger.com/static/v1/jsbin/2591933621-ieretrofit.js"></script> <![endif]-->

You can see in the picture above as your guideline.

 Step 2
 
Template
Go to your blog dashboard > template > edit html

Step3

html template
 Next in your html code editing find this phrase <b:include data='blog' name='all-head-content'/> and remove and replace this phrase which code you have copy in Step 1.

So, when you done click save template and let see the result.
Before you make a change coding in template make a backup first.

Result

Green Lock
Finally my domain got green lock..

I hope this tutorial would help many blogspot user that has been used custom domain and used cloudflare ssl as their source to get HTTPS, and imply this green lock successfully on their blogspot.

 

If You Enjoyed This, Take 5 Seconds To Share It
SHARE

About Ahmad Hasif


Blogger


Berkongsi Mengenai : Teknik SEO | Info | Tutorial | Freebies |


Untuk sebarang pertanyaan mengenai review atau giveaway boleh emel di:-

[email protected]

22 ulasan :

  1. wow..nice info..thanks for sharring..

    BalasPadam
  2. Info berguna..! Nanti Reen praktik kan. :)

    BalasPadam
    Balasan
    1. Okay Selamat Mencuba..

      Padam
    2. Btw.. Reen follow blog Hasif. Follow back? :)

      Padam
    3. mcm lama dah follow reen tu.. :)

      Padam
    4. Hahahaa baru baca. Aduh. Awak.. Dah cuba buat step ni, lepas tu baru teringat tak register lagi dengan Cloudflare.. Masalah sekarang ni, baru je register dengan Cloudflare..

      Tapi.. Ayat dorang macam ni.

      Status: Pending

      Please ensure your website is using the nameservers provided:
      arya.ns.cloudflare.com
      gerald.ns.cloudflare.com

      Macam mana nak tukar nameservers?

      Padam
    5. pergi ke control panel domain tukar nameserver yg dia suh tukar tu..

      boleh tengok di langkah ke-7

      Panduan Lengkap Cara Setting Domain Dot My di Blogspot Mudah Mynic article...

      Padam
    6. sebelum tukar nameserver tu simpan siap2 nameserver asal incase kalo ada errorr boleh tukar balik.. :D semoga berjaya..

      Padam
    7. Awak.. Kalau saya minta tlong awak buat leh? Berapa awak cas untuk tolong setting ni? Pening baca stepnya. Banyak.. Rasa nak pengsan pun ade. Over jap hihihi

      Padam
    8. oo emel sy yer.. haha over juga sampai nak pengsan tu..

      Padam
  3. wah. ..nak praktikkan juga ni. .tq dgn tips ni

    BalasPadam
  4. saya ada dpt note psl http to https ni di bhgian ats edit html. ini ke penyelesaiannya ya?

    BalasPadam
    Balasan
    1. kalau blogger yang guna blogspot senang je just tukar je dekat setting untuk paparkan https.

      Jika guna cloudflare boleh ikuti cara ini..

      Padam
  5. sis pun ada masalah ni juga ... thanks.

    BalasPadam
    Balasan
    1. semoga dapat mengatasi masalahnye tu yer..

      Padam
  6. tak menjadi pula... apa maksud cloudflare tu???

    BalasPadam
    Balasan
    1. cloudflare ni platform yang menyediakan https (ssl) secara percuma dan juga turut menyediakan yang berbayar punya.. Kalau tgk di blog ni ada green lock kan sebelah url address..

      apa yang tak jadi nye ye? boleh bagi lebih spesifik??

      kalau nak guna cloudflare kena register dulu akaun pastu add site dekat dalam tu and then ada dia punya next step..

      Padam
  7. Ulasan ini telah dialihkan keluar oleh pengarang.

    BalasPadam
    Balasan
    1. saya cuba buat apa yang hasif ajar tapi saya tak jumpa code ini di dalam blog saya ""

      Padam
    2. code mana ya yg tak jumpa tu?

      Padam