Tutorial Setup CloudFlare SSL untuk WordPress Website atau Blog

Mendapatkan SSL Gratis dari CloudFlare
8

Setelah artikel lalu tentang mendapatkan SSL gratis dari CloudFlare, sekarang saya akan membahas tentang bagaimana melakukan setup CloudFlare SSL untuk WordPress. Setelah mendapatkan SSL dari CloudFlare, langkah selanjutnya adalah melakukan setting untuk mendapatkan priviledge HTTPS pada website kita. Langkah ini perlu dilakukan secara teliti agar terhindar dari mixed content yang mengakibatkan tulisan HTTPS tidak menjadi hijau (liat gambar di atas), karena masih ada konten yang nyangkut di HTTP.

Ada beberapa langkah dan plugin yang diperlukan. Tidak terlalu ribet kok. Saya akan mengulas dengan detail langkah dan plugin yang diperlukan untuk melakukan setup CloudFlare SSL untuk WordPress. Kenapa WordPress? Sederhana, karena saya tidak memakai CMS lain. Hehehe.

OK, sekarang tutorialnya. Saya asumsikan bahwa kamu sudah mempunyai akun CloudFlare dan sudah mempunyai active certificate flexible SSL dari CloudFlare. Kalo belum, baca lagi dulu artikelnya di sini.

Setup CloudFlare SSL untuk WordPress

1. Download plugin ini terlebih dahulu: WordPres HTTPS (SSL), CloudFlare Flexible SSL dan SSL insecure content (ini belakangan saja kalau ditemukan masalah, ga didownload sekarang pun tak apa).

1. Install WP HTTPS sebagai langkah pertama Setup CloudFlare SSL untuk WordPress
1. Install WP HTTPS sebagai langkah pertama Setup CloudFlare SSL untuk WordPress
1.1 Install Cloudfare Flexible SSL
1.1 Install Cloudfare Flexible SSL

2. Setelah terinstall dan aktif, buka setting HTTPS melalui sidebar. Lakukan setting seperti di bawah ini. Pastikan nama website kamu benar.

2. Setting HTTPS Plugin - langkah kedua Setup CloudFlare SSL untuk WordPress
2. Setting HTTPS Plugin – langkah kedua Setup CloudFlare SSL untuk WordPress

3. Selanjutnya, buka setting CloudFlare Flexible SSL dan masukkan data di kolom yang tersedia. Untuk mendapatkan CloudFlare API Key, klik pada tulisan “Get this?” dan nanti akan terbuka halaman baru di dashboard CloudFlare, jika belum login, loginlah terlebih dahulu.

Setelah itu tinggal scroll ke bawah dan kamu akan menemukan API key kamu. Selanjutnya tinggal copy paste di halaman plugin WordPress tadi. Klik “Save”. Sampai di sini cukup untuk setting plugin di website. Langkah selanjutnya adalah melakukan setting di CloudFlare dashboard.

3. Setting Cloudflare Flexible SSL
3. Setting Cloudflare Flexible SSL
3.1. Mendapatkan API Key
3.1. Mendapatkan API Key

Read More Post
1 of 9

4. Login ke akun CloudFlare kamu dan masuk ke dashboard. Pilih website kamu dan setelah itu, klik “Page Rules”. Klik sekali lagi pada “Create Page Rule” untuk membuat rule baru.

4. Setting Cloudflare Page Rule
4. Setting Cloudflare Page Rule

5. Di pop-up yang terbuka, masukkan nama domain kamu dengan tanda asterisk (*) setelah http:// dan setelah .com. Lihat contoh aja supaya gampang. Pilih setting “Always use HTTPS” dan save.

5. Page Rules
5. Page Rules

6. Balik lagi ke dashboard website. Buka Setting >> General. Ubah “Site Address” menjadi HTTPS. Ingat! Ubah hanya Site Address. WordPress address biarkan tetap HTTP.

6. Setting WordPress
6. Setting WordPress

Yup! Sampai di sini sudah bisa tersetup dan langsung bisa redirect ke https. Jadi, setiap request yang nantinya masuk melalui HTTP akan diteruskan ke HTTPS. Sekarang coba cek apakah HTTPS sudah menjadi hijau? Kalau sudah berwarna hijau, maka sudah berhasil. Kalo masih putih berarti ada mixed content yang masih menggunakan protocol HTTP.

Lalu bagaimana? 

Tenang, lakukan langkah berikut untuk mengatasi mixed/insecure content.

  1. Ingat-ingat, pernah update theme atau bikin custom html/css menggunakan protokol http? Misalnya logo blog, kadang kita setting manual dengan menggunakan URL, bisa jadi masih menggunakan protokol http.
  2. Kalau masih lupa, buka aja web ini http://www.whynopadlock.com/ untuk mengecek konten website kita. Perbaiki apa yang ditemukan oleh website tersebut. Selanjutnya recheck lagi.
  3. Download plugin SSL insecure content yang saya sebutkan di atas. Aktifkan dan lakukan setting seperti di bawah ini. Lakukan dari yang “Simple” dulu (plugin ini perlu test dan retest untuk hasilnya). Kalau “Simple” sudah mengatasi, maka tidak perlu coba yang lain. Kalu tidak mengatasi, coba satu per satu sampai menemukan setting yang pas.
SSL Insecure Content
SSL Insecure Content
SSL Insecure Content
SSL Insecure Content HTTPS detection

Gimana, sudah berhasil? Kalo belum dan menemui kesulitan, comment saja di bawah, ntar saya bantu.

- Matched Content -

You might also like
8 Comments
  1. bagus dano says

    general setting https-nya ko di saya gaa yaa ? download plugin wordpress https juga gada?

  2. Valerie Brittany says

    Gan utk API key nya itu yg diambil Origin CA atau Global? di copy paste nya ke Cloudfare domain name atau Cloudfare API Key, terimakasih banyak gan

    1. Akut Wibowo says

      Ambil yang Global gan, paste ke Cloudfare API Key.

  3. Adam says

    ijin sedot ilmunya gan, sngat menarik. tapi sy tdk pke wordpress.
    klo bkan type wordpress gk bsa ya mas,
    mksih mas

  4. Denny says

    JOSSSS..!

    UPDATE ==>
    Cukup Install Plugin “Cloudflare” (native version) dengan settings + WordPres HTTPS (SSL) sudah JOSS

    1. Akut Wibowo says

      Yup, sepertinya udah harus diupdate. Thanks mas.

  5. Muhammad Gilang says

    bermanfaat banget ini gans , alhasill blog saya udah secure juga

    main2 ke blog ane gan

  6. Andra says

    Thanks om..

Leave A Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More