Tutorial Memasang SSL Percuma Dari Cloudflare – HTTP kepada HTTPS

Sudahkah anda memasang SSL pada wordpress anda?

Jika belum, ini adalah panduan lengkap untuk memasang SSL pada laman wordpress.

Berita baik disini adalah SSL tersebut adalah percuma, reliable dan mudah dipasang.

Dalam tutorial ini, anda akan belajar menukar HTTP kepada HTTPS dan seterusnya meningkatkan tahap keselamatan, integriti dan prestasi blog anda.

Jom ikuti panduan ini:

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Mengapa Anda Perlu Bertukar Kepada HTTPS?

[/su_heading]

Tiga tahun yang lepas, Google telah mengumumkan bahawa HTTPS telah menjadi ranking factor dan signal yang kepada enjin carian.

Maka, selain daripada membina laman web yang lebih selamat, anda juga boleh meningkatkan kehadiran pepijat enjin carian dan trafik organik dengan menggunakan sambungan HTTPS.

Dalam tutorial ini, saya akan menunjukkan bagaimana anda boleh menukarkan HTTP kepada HTTPS dengan Cloudflare.

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Mari Dapatkan SSL percuma!

[/su_heading]

Banyak syarikat hosting menyediakan SSL berbayar.

Namun sejak akhir-akhir ini, telah menjadi trend bagi syarikat hosting untuk menawarkan SLL percuma dalam pakej mereka.

Saya secara peribadi menggunakan shared hosting sahaja.

Oleh itu, Cloudflare menjadi kemestian buat saya kerana ia memberi keselamatan dan meningkatkan prestasi laman web.

Apa yang lebih menarik, Cloudflare juga turut menawarkan SSL secara percuma.

[su_note note_color=”#ecf7ff”]

Jika anda tidak menggunakan Cloudflare, tutorial ini bukan untuk anda.

[/su_note]

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Bagaimana menukar HTTP kepada HTTPS menggunakan Cloudflare?

[/su_heading]

Dibawah ini saya mencatatkan langkah-langkah yang sama saya gunakan untuk memasang SSL pada inchenaim.com dan blog saya yang lain.

Anda juga boleh melakukan langkah-langkah ini dalam susunan yang berbeza, tetapi paparan laman web anda mungkin tidak berfungsi dengan baik buat sementara waktu.

Saya harap anda faham tentang setiap perubahan yang bakal anda lakukan.

Rujuk kembali tutorial ini jika anda tidak pasti.

Cloudflare kadangkala mengambil masa beberapa minit untuk melakukan perubahan (malah kadang-kadang lebih lama).

Oleh itu pastikan anda sentiasa mengosongkan cache dan cookies.

[su_note note_color=”#f5f5dc”]

[su_list icon=”icon: warning” icon_color=”#ea1b17″]

• Peringatan:

[/su_list]

Sekiranya anda rasa tidak yakin untuk melakukan proses ini, maka jauhkan diri anda dari komputer.

Sila minta bantuan daripada syarikat hosting anda untuk buat proses ini.

Tapi rasanya anda boleh. Tak susah pun. InsyaAllah.

[/su_note]

Sudah sedia?

Ikuti langkah-demi-langkah yang tercatat dibawah:

[su_label type=”success”]Langkah 1[/su_label]

Perkara pertama sekali yang anda perlu buat adalah install plugin Cloudflare Flexible SSL.

Plugin ini akan memperbetulkan infinite redirect loops yang akan berlaku apabila anda menggunakan Flexible SSL.

Alternatif kepada plugin ini adalah really simple SSL

Install salah satu daripada plugin ini.

[su_label type=”success”]Langkah 2[/su_label]

Kemudia anda perlu login ke Cloudflare dan pergi tab ‘Crypto’.

Kepada yang belum berdaftar dengan Cloudflare, sila sign-up untuk meningkatkan performance dan keselamatan blog anda dengan segera.

Sign-up cloudflare disini: Daftar CloudFlare (Percuma)

 

[su_label type=”success”]Langkah 3[/su_label]

Dalam bahagian SSL, tukar tetapan ke “Flexibel” (ia mungkin ditetapkan “OFF” atau “FULL” sebelum ini).

Ia akan mengambil masa sehingga 24 jam untuk SSL diaktifkan untuk pelanggan percuma.

Jadi, buat sementara waktu laman web anda mungkin dipointkan ke sambungan http biasa.

[su_note note_color=”#fff7e4″]

[su_list icon=”icon: warning” icon_color=”#ff0000″]

• Amaran:

Jika setting SSL ditetapkan kepada Flexibel dan plugin Cloudflare Flexibel SSL tidak diaktifkan, maka laman web anda akan rosak.

Oleh itu, pastikan anda menukar setting SSL kembali kepada “FULL” jika anda perlu menyahaktifkan plugin Cloudflare Flexible SSL.

[/su_list]

[/su_note]

 

[su_label type=”success”]Langkah 4[/su_label]

Skrol ke bawah pada bahagian yang bertajuk “Always use HTTPS” dan tukar kepada ON.

Ini mengalihkan semua request HTTP ke HTTPS.

 

[su_label type=”success”]Langkah 5[/su_label]

Dalam tab yang sama juga, skrol sehingga jumpa bahagian yang bertajuk “Automatic HTTPS Rewrites” dan tukar kepada ON.

Ia berfungsi untuk menulis semula pautan dari sumber HTTP ke HTTPS dan menyelesaikan masalah kandungan bercampur (mixed content problem).

Ini penting untuk membolehkan icon kunci muncul di browser anda.

 

[su_label type=”success”]Langkah 6[/su_label]

Ini adalah bahagian yang sedikit rumit kerana status laman web anda pada masa ini bergantung pada bagaimana laman web anda disetup sebelum ini.

Saya menggunakan WP Rocket sebagai cache plugin untuk melajukan blog saya.

Apabila plugin WP Rocket diaktifkan pada peringkat ini, laman web saya telah berjaya berubah dari HTTP ke HTTPS.

Namun malangnya, paparan blog saya menjadi kacau-bilau kerana sebahagian aset yang disambungkan secara relatif tidak dipaparkan dengan betul.

Untuk menyelesaikan masalah ini, saya membuka halaman setting WP Rocket dan klik pada tab Cloudflare.

Kemudian saya menghidupkan option “Relative Protocol”.

Tetapan ini diperlukan hanya apabila anda menggunakan SSL Flexible Cloudflare.

Pada ketika ini, laman web saya selamat menggunakan HTTPS dan ia tidak mempunyai masalah paparan.

Jika anda menggunakan plugin caching yang berbeza, anda mungkin perlu mengaktifkan option yang sama dalam plugin tersebut.

[su_note note_color=”#ecf7ff”]

[su_label type=”warning”]Nota:[/su_label]

Saya dapati cache plugin yang lain seperti WT3 Cache dan Cache Enabler tidak memberi masalah dalam proses menukar kepada HTTPS.

[/su_note]

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Adakah Kita Perlu Menukar URL Dalam Setting Wordpress?

[/su_heading]

Anda juga mungkin membaca tutorial dari pihak lain yang mencadangkan agar anda menukar URL wordpress address dan site address dalam halaman “general setting”.

Mereka mencadangkan agar anda menukar [su_highlight background=”#fff198″]http://[/su_highlight]www.domain.com kepada [su_highlight background=”#fff198″]https://[/su_highlight]www.domain.com.

JANGAN!

Perkara ini tidak perlu bila anda menggunakan Cloudflare.

Malah ia boleh menimbulkan banyak masalah.

Jika anda tersilap mengubah alamat web anda ke HTTPS di kawasan general setting WordPress, maka ubahnya kembali seperti asal.

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Menguji SSL Berfungsi atau Tidak

[/su_heading]

Untuk melihat sama ada protokol SSL anda berfungsi dengan betul, buka halaman SSL LAB.

Isikan nama domain anda dan lihat apa skor yang anda perolehi.

Kesemua ujian seharusnya mendapat skor A, menandakan SSL anda berfungsi dengan baik.

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Beritahu Google tentang Perubahan Protokol

[/su_heading]

Sila tambah versi https blog anda ke Google Search Console.

Anda harus tahu bahawa Google melayan versi http dan https blog anda sebagai web yang berbeza.

Di alamat https, hantar sitemap baharu yang bermula dengan https: //

Selepas anda submit versi https laman web anda, anda harus menyemak status pengindeksan anda dan crawl error laman web https di Google Search Console.

Pengindeksan http harus berkurang dan pengindeksan https harus bermula naik.

Anda juga boleh memasukkan teks berikut dalam kotak carian Google untuk menyemak status indeks tapak anda:

[su_note note_color=”#F4f4f4″]

site:domainanda.com

[/su_note]

*Ganti “domainanda” dengan nama nama domain blog anda.

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Masalah-Masalah Yang Mungkin Timbul..

[/su_heading]

Bagi saya, tiada satu pun bahagian yang sukar dalam proses menukar dari HTTP ke HTTPS menggunakan Cloudflare.

Walau bagaimana pun, anda mungkin akan menghadapi beberapa masalah semasa melakukan proses-proses ini.

Kerja ini memerlukan banyak trial and error untuk berjaya.

Dibawah ini saya senaraikan beberapa masalah yang mungkin terjadi:

[su_spoiler title=”Jumlah Facebook Share Jadi Kosong” open=”yes” style=”carbon”]

Ini adalah kelemahan terbesar bila menukar HTTP kepada HTTPS.

Tiada apa yang dapat kita lakukan mengenainya.

Tetapi bagi saya kita akan mendapat lebih banyak kelebihan-kelebihan lain berbanding perkara ini.

Update:

Terbaru 2018, saya dapati jumlah bilangan FB share tidak berubah selepas bertukar kepada HTTPS untuk blog akuislam.com

Jadi usaha ragu-ragu lagi untuk bertukar kepada HTTPS.

[/su_spoiler]

[su_spoiler title=”Lambang padlock hijau tidak muncul” open=”yes” style=”carbon”]

Sekiranya browser anda tidak menunjukkan apa yang sepatutnya muncul (seperti lambang kunci hijau), maka kosongkan cookies browser anda.

Log keluar dari WordPress, dan kembali log in..

Revert semula perubahan yang anda telah buat dan mulakan semula proses ini.

[/su_spoiler]

[su_spoiler title=”Muncul amaran connection is not secure” open=”yes” style=”carbon”]

— Browser menyatakan bahawa sambungan tidak selamat walaupun sudah bertukar kepada HTTPS

Untuk menyelesaikan masalah ini, sila install plugin SSL Insecure Content Fixer.

Pilih setting “Content” dan ia akan memperbaiki segala masalah yang wujud.

Walau bagaimana pun, anda juga mungkin ingin menguji setting lain untuk melihat yang mana paling sesuai dengan blog anda.

Ia terpulang kepada anda.

Plugin ini dapat membuat laman web saya HTTPS compliant sepenuhnya.

[/su_spoiler]

[su_spoiler title=”WP Rocket tidak berfungsi” open=”yes” style=”carbon”]

— WP Rocket tidak melakukan cache selepas bertukar kepada HTTPS

Ini berlaku kerana WP Rocket masih menyimpan cache lama dari protocol HTTP, dan bukannya HTTPS.

Oleh itu:

Log masuk ke dashboard wordpress dan masuk ke setting WP Rocket.

Pada tab “basic”, tanda tick pada “Enable caching for pages with https://"

Save setting tersebut dan clear cache.

Nota:

Saya dapati isu ini tidak timbul dengan plugin cache lain seperti W3T dan Cache Enabler.

[/su_spoiler]

Masalah-masalah lain..

Oleh kerana setup blog kita belum tentu sama, anda mungkin mengalami masalah lain.

Jika anda memerlukan bantuan lanjut, saya menyarankan anda membaca artikel ini:

[su_list icon=”icon: file-text” icon_color=”#9c9e97″]

• How do I fix mixed content issues or the infinite redirect loop error after enabling Flexible SSL with WordPress?
• WordPress Cloudflare Flexible SSL – Making It Work

[/su_list]

Link diatas adalah tutorial yang baik kerana terdapat banyak komen daripada pengguna wordPress lain yang memberi panduan dan penyelesaian tentang cara membuatkan HTTPS berfungsi.

[su_heading style=”modern-1-blue” size=”15″ margin=”30″]

Penutup: Jadikan blog anda lebih baik dan sempurna

[/su_heading]

Sekiranya anda masih mengalami kesukaran, saya menggalakkan anda untuk meminta bantuan sokongan daripada syarikat hosting anda.

Usah segan kerana anda membayar untuk mendapatkan perkhidmatan mereka.

Semoga berjaya!