Tutorial Setup CloudFlare SSL untuk WordPress Website atau Blog

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).

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

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.

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.

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.

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

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.

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