{"id":39069,"date":"2024-08-06T15:13:56","date_gmt":"2024-08-06T08:13:56","guid":{"rendered":"\/tutorial\/?p=39069"},"modified":"2025-12-18T23:28:29","modified_gmt":"2025-12-18T16:28:29","slug":"cara-mengatasi-mixed-content-wordpress","status":"publish","type":"post","link":"\/id\/tutorial\/cara-mengatasi-mixed-content-wordpress","title":{"rendered":"Cara Mengatasi Mixed Content Error di WordPress (Plugin dan File .htaccess)"},"content":{"rendered":"

Mixed content warning adalah error WordPress yang umum terjadi karena pengaturan SSL (Secure Socket Layer)<\/a> yang salah. Error ini menunjukkan bahwa website WordPress Anda memiliki aset yang tidak aman dari URL yang tidak menggunakan HTTPS.<\/p>

Apabila mengalaminya, Anda harus segera mengatasi error ini karena bisa mengganggu pengalaman pengguna dan menyebabkan mesin pencari menandai website Anda sebagai tidak aman. Akibatnya, peringkat website pun bisa turun, bahkan dicuri datanya oleh penjahat cyber.<\/p>

Tidak perlu panik! Artikel kami kali ini akan membantu Anda mengatasi mixed content di WordPress berdasarkan kemungkinan penyebabnya. Ada tiga metode yang kami jelaskan, yaitu menggunakan plugin, mengubah URL website dari HTTP ke HTTPS<\/a>, dan mengedit file .htaccess.<\/p>

Apa Itu Mixed Content Error di WordPress?<\/h2>

Mixed content di WordPress muncul ketika website menyajikan konten yang aman (HTTPS) sekaligus tidak aman (HTTP) akibat pengaturan SSL yang salah.<\/p>

Untuk mengatasinya, Anda harus memaksa WordPress untuk menampilkan semua konten dari koneksi HTTPS yang aman, yang bisa dilakukan dengan menggunakan plugin, mengubah link HTTP menjadi HTTPS, atau mengedit file .htaccess.<\/p>

Apa Penyebab Error Mixed Content di WordPress?<\/h2>

Mengaktifkan HTTPS\/SSL merupakan langkah keamanan yang sangat dianjurkan untuk website WordPress. Dengan sertifikat SSL, data yang ditransfer antara website Anda dan pengunjung akan dienkripsi untuk memastikan koneksi yang aman.<\/p>

Beberapa provider hosting, termasuk Hostinger, sudah menyertakan sertifikat SSL gratis<\/a> dengan paket hostingnya. Atau, Anda juga bisa membeli sertifikat SSL dari penyedia pihak ketiga dan menginstalnya sendiri.<\/p>

Sayangnya, Anda mungkin tetap menjumpai peringatan mixed content di WordPress bahkan setelah menginstal sertifikat SSL yang valid. Peringatan ini muncul ketika website HTTPS menggunakan path absolut untuk memuat skrip HTTP.<\/p>

Path absolut adalah lokasi folder atau file di website yang ditulis lengkap dengan protokolnya dari awal hingga akhir. Berikut contohnya:<\/p>

http:\/\/domain.tld\/featured-image.jpg<\/pre>
Cara Mengetahui Apakah Ada Error Mixed Content di WordPress<\/h2>
Cara termudah untuk menemukan error mixed content di WordPress adalah dengan melihat kolom alamat website Anda di browser. <\/p>
Tergantung pada web browser yang digunakan, peringatan Tidak aman<\/strong> atau ikon gembok rusak<\/strong> mungkin muncul di samping URL website Anda dengan pesan, “Your connection to this site is not fully secure.<\/strong>“<\/p>
\n
\"tampilan<\/figure><\/div>
Nah Anda bisa menemukan aset-aset yang dimuat melalui koneksi HTTP dengan menggunakan Developer tools<\/strong> (Alat pengembang) di browser Google Chrome. <\/p>
Untuk membukanya, klik ikon tiga titik pada menu bagian atas Chrome, lalu pilih More tools<\/strong> (Fitur lainnya) → Developer tools<\/strong> (Alat pengembang). Atau, tekan Ctrl+Shift+I<\/strong> untuk Windows atau Linux, dan Cmd+Option+I<\/strong> untuk macOS.<\/p>
Buka tab Console<\/strong> (Konsol) di tool tersebut untuk melihat semua konten WordPress yang tidak aman di website Anda.<\/p>
\n
\"tampilan<\/figure><\/div>
Cara Mengatasi Mixed Content WordPress<\/h2>
Di bagian ini, kami akan membagikan tiga solusi debug website WordPress<\/a> yang bisa Anda coba untuk mengatasi error mixed content, dimulai dengan metode yang paling mudah.<\/p>
Cara Mengatasi Mixed Content WordPress Menggunakan Plugin<\/h3>
Apabila Anda masih bisa mengakses dashboard admin WordPress, instal plugin HTTPS\/SSL untuk memperbaiki peringatan mixed content. Beberapa plugin ini menyediakan versi gratis yang menyertakan fitur untuk mengatasi masalah konten tidak aman dengan mudah.<\/p>
Di tutorial ini, kami akan menggunakan plugin SSL Insecure Content Fixer<\/a> untuk mengatasi mixed content WordPress:<\/p>
    \n
  1. Instal dan aktifkan SSL Insecure Content Fixer<\/strong> dari direktori plugin WordPress. Apabila memerlukan panduan penginstalan plugin, baca artikel kami lainnya tentang cara instal plugin WordPress<\/a>.<\/li>\n<\/ol>
    \n
    \"tampilan<\/figure><\/div>
      \n
    1. Buka Settings<\/strong> → SSL Insecure Content<\/strong> dari dashboard admin untuk mengonfigurasi plugin.<\/li>\n\n\n\n
    2. Bagian Fix insecure content<\/strong> menentukan tingkat perbaikan yang perlu diterapkan oleh plugin ini. Opsi Simple<\/strong> menangani skrip, stylesheet, dan file media WordPress, yang prosesnya tidak terlalu mengganggu performa website. Mulailah dari opsi ini ke opsi yang lebih tinggi sampai error teratasi.<\/li>\n<\/ol>
      \n
      \"tampilan<\/figure><\/div>
        \n
      1. Bagian HTTPS detection<\/strong> menentukan bagaimana website WordPress Anda mengidentifikasi halaman HTTPS. Anda bisa mengaturnya ke standard WordPress function<\/strong> atau memilih opsi lain di bawahnya kalau menggunakan reverse proxy seperti NGINX<\/a> atau Cloudflare CDN<\/a>.<\/li>\n<\/ol>
        \n
        \"tampilan<\/figure><\/div>
          \n
        1. Biarkan pengaturan lainnya pada opsi default, lalu klik Save Changes<\/strong>. <\/li>\n\n\n\n
        2. Kunjungi website WordPress Anda untuk mengecek apakah error mixed content telah teratasi.<\/li>\n<\/ol>
          \n
          \"\"<\/a><\/figure><\/div>
          Cara Memperbaiki Mixed Content WordPress dengan Mengubah Link<\/h3>
          Apabila masalahnya belum teratasi dengan plugin HTTPS\/SSL, mungkin ada URL yang ditulis menggunakan hard-code dalam database atau file WordPress Anda. Untuk hal ini, Anda perlu mengganti semua URL dengan HTTPS.<\/p>
          Apabila hanya ada beberapa link yang tidak aman, Anda bisa menghapusnya secara manual. Kalau jumlahnya banyak, gunakan plugin search-and-replace untuk mengubah semua link yang tidak aman dalam tabel database Anda.<\/p>
          \n\n\n
          Penting!<\/strong> Backup website WordPress<\/a> Anda dulu sebelum melakukan perubahan apa pun pada database.<\/p><\/div>\n\n\n\n<\/p>
          Ikuti langkah-langkah berikut ini untuk melakukan perubahan massal pada database WordPress Anda menggunakan plugin Better Search Replace<\/a>:<\/p>
            \n
          1. Instal dan aktifkan Better Search Replace<\/strong> dari direktori plugin WordPress.<\/li>\n<\/ol>
            \n
            \"tampilan<\/figure><\/div>
              \n
            1. Buka Tools<\/strong> → Better Search Replace<\/strong> dari dashboard admin Anda.<\/li>\n\n\n\n
            2. Isi kolom Search for<\/strong> dengan alamat website HTTP Anda, lalu tambahkan versi HTTPS ke kolom Replace with<\/strong>.<\/li>\n\n\n\n
            3. Kolom Select tables<\/strong> menentukan tabel yang akan diperbarui. Tekan Ctrl<\/strong> dan klik setiap entri untuk memilih semua tabel.<\/li>\n\n\n\n
            4. Biarkan pengaturan lainnya pada opsi default. Tampilan kolomnya akan terlihat seperti ini:<\/li>\n<\/ol>
              \n
              \"tampilan<\/figure><\/div>
                \n
              1. Klik Run Search\/Replace<\/strong> untuk memulai proses update.<\/li>\n\n\n\n
              2. Karena mode Dry run<\/strong> diaktifkan, plugin ini hanya akan menampilkan hasil temuannya. Pastikan bahwa hasil tersebut memang URL HTTP.<\/li>\n\n\n\n
              3. Nonaktifkan mode Dry run<\/strong> lalu jalankan kembali proses pencarian dan penggantian.<\/li>\n<\/ol>
                \n\n\n
                \n                    
                Tips Berguna<\/h4>\n                    
                Bersihkan cache browser<\/a> Anda sebelum melakukan pengujian pada website WordPress untuk memastikan data yang dimuat adalah yang terbaru.<\/p>\n                <\/div>\n\n\n\n<\/p>
                Cara Mengatasi Mixed Content WordPress dengan .htaccess<\/h3>
                Metode terakhir untuk mengatasi mixed content warning di WordPress adalah dengan memaksa koneksi HTTPS yang aman<\/a> melalui file .htaccess. <\/strong><\/p>
                File ini mengatur berbagai fungsi untuk website yang dihosting di beberapa web server, termasuk Apache. Salah satu fungsinya yaitu untuk memaksa WordPress agar mengarahkan pengunjung dari koneksi HTTP ke HTTPS yang lebih aman.<\/p>
                Anda bisa menemukan atau membuat file .htaccess<\/a> di direktori root website yang menyimpan semua file inti WordPress.<\/p>
                Di tutorial ini, kami akan menunjukkan cara mengedit .htaccess<\/strong> menggunakan File Manager Hostinger<\/a>. Namun, Anda juga bisa menggunakan FTP client seperti FileZilla<\/a>. Berikut caranya:<\/p>
                  \n
                1. Buka bagian File<\/strong> → File Manager<\/strong> di hPanel<\/a>.<\/li>\n\n\n\n
                2. Pilih Akses file [domain Anda]<\/strong> untuk melihat file website Anda.<\/li>\n<\/ol>
                  \n
                  \"tampilan<\/figure><\/div>
                    \n
                  1. Klik dua kali folder public_html<\/strong> dan cari file .htaccess<\/strong>. Kalau file tersebut belum ada, Anda bisa membuatnya.<\/li>\n<\/ol>
                    \n
                    \"File<\/figure><\/div>
                      \n
                    1. Klik kanan file tersebut, kemudian pilih Edit<\/strong>.<\/li>\n\n\n\n
                    2. Tempel cuplikan kode berikut di bagian bawah file .htaccess<\/strong> Anda.<\/li>\n<\/ol>
                      RewriteEngine On\nRewriteCond %{HTTPS} !=on\nRewriteRule ^(.*)$ https:\/\/%{HTTP_HOST}%{REQUEST_URI} [L,R=301,NE]\nHeader always set Content-Security-Policy \"upgrade-insecure-requests;\"<\/pre>
                        \n
                      1. Klik Simpan<\/strong> dan muat ulang website WordPress Anda untuk melihat apakah error mixed content sudah berhasil diatasi. <\/li>\n<\/ol>
                        Apabila prosesnya berhasil, pengunjung yang mengakses website Anda melalui link HTTP yang tidak aman akan dialihkan ke koneksi HTTPS yang aman.<\/p>
                        \"\"<\/a><\/figure>
                        \n\n\n
                        \n                    
                        Saran Bacaan<\/h4>\n                    
                        Cara Mengatasi Error HTTP WordPress saat Mengupload Gambar<\/a>
                        \n                        Cara Mengamankan Website WordPress<\/a><\/p>\n                <\/div>\n\n\n\n<\/p>
                        Kesimpulan<\/h2>
                        Error mixed content mungkin muncul setelah Anda menginstal sertifikat SSL. Apabila dibiarkan saja, error ini bisa merusak SEO dan pengalaman pengguna website Anda, bahkan menimbulkan celah keamanan yang bisa dimanfaatkan oleh pihak yang tidak bertanggung jawab.<\/p>
                        Jadi, Anda harus mengatasinya sesegera mungkin sebelum bertambah parah. Ada tiga solusi untuk memperbaiki error mixed content di WordPress:<\/p>