Cara Mengaktifkan Virtual Include SHTML di XAMPP

Untuk mengaktifkan Server Side Includes (SSI) dengan ekstensi file .shtml di XAMPP, Anda perlu melakukan konfigurasi pada file utama Apache, yaitu httpd.conf dan file konfigurasi virtual host httpd-vhosts.conf. Secara default, Apache pada XAMPP belum mengaktifkan modul filter SSI dan pemetaan handler untuk ekstensi .shtml.

Proses ini membutuhkan penyuntingan teks pada file konfigurasi server, mengaktifkan modul include_module, serta mendefinisikan direktif Options +Includes dan AddHandler server-parsed .shtml agar server mengenali dan memproses perintah SSI seperti <!--#include virtual="header.html" -->.

Langkah-Langkah Teknis Konfigurasi SSI .shtml di XAMPP

Ikuti urutan langkah berikut secara teliti untuk menerapkan konfigurasi pada lingkungan lokal XAMPP Anda:

1. Buka Panel Kontrol XAMPP: Pastikan layanan Apache dalam keadaan berhenti (stop) sebelum melakukan perubahan file konfigurasi.
2. Modifikasi File httpd.conf: Buka direktori instalasi XAMPP Anda (biasanya di C:\xampp\apache\conf\httpd.conf) menggunakan teks editor seperti Notepad++ atau VS Code.
3. Aktifkan Modul Include: Cari baris kode berikut dan pastikan tanda pagar (#) di depannya dihapus:

   LoadModule include_module modules/mod_include.so

4. Atur Handler dan Filter: Cari blok konfigurasi direktori dokumen utama (biasanya <Directory "C:/xampp/htdocs">). Di dalam blok tersebut, tambahkan atau ubah direktif Options agar menyertakan Includes:

   <Directory "C:/xampp/htdocs">
       Options Indexes FollowSymLinks Includes
       AllowOverride All
       Require all granted
   </Directory>

5. Aktifkan Ekstensi Handler: Cari bagian yang mengatur tipe handler (biasanya ada baris AddType atau AddHandler). Tambahkan baris berikut untuk mengaitkan ekstensi .shtml dengan handler server-parsed:

   AddType text/html .shtml
   AddOutputFilter INCLUDES .shtml

6. Simpan dan Restart Apache: Simpan perubahan file httpd.conf, lalu kembali ke XAMPP Control Panel dan klik Start pada modul Apache.

Tabel Perbandingan Konfigurasi SSI Apache

Contoh Penggunaan Skenario SHTML

Setelah konfigurasi selesai dan Apache berjalan kembali, buatlah sebuah file uji coba di dalam folder C:\xampp\htdocs\ dengan nama index.shtml. Masukkan kode struktur HTML dasar beserta sintaks SSI untuk memanggil file lain (misalnya footer.html):

<!DOCTYPE html>
<html lang="id">
<head>
    
    
</head>
<body>
    <h1>Selamat Datang di Server Lokal</h1>
    
Berikut adalah konten yang dimuat secara dinamis menggunakan Server Side Includes:
    
    <!--#include virtual="footer.html" -->

</body>
</html>

Buat juga file pendukung bernama footer.html pada direktori yang sama dengan isi teks sederhana:

<hr>
<p>© 2026 - Hak Cipta Dilindungi.</p>

Buka peramban web (browser) dan akses alamat http://localhost/index.shtml. Jika teks dari footer.html muncul di bawah judul utama tanpa error, konfigurasi Server Side Includes pada XAMPP Anda telah berhasil diterapkan.

Troubleshooting Masalah Umum SHTML di XAMPP

Jika file .shtml Anda menampilkan halaman kosong, memunculkan kode error 500, atau perintah #include tidak dieksekusi (hanya muncul sebagai teks mentah di browser), periksa beberapa titik pemeriksaan berikut:

• Kesalahan Penulisan Sintaks SSI: Pastikan format penulisan komentar SSI benar, yaitu menggunakan spasi yang tepat di dalam tanda kurung siku dan tanda seru: <!--#include virtual="namafile.html" -->. Perhatikan spasi sebelum tanda tutup -->.
• Izin Akses File (Permissions): Pastikan file yang dipanggil melalui parameter virtual atau file berada di dalam root direktori yang sama atau sub-direktori yang diizinkan oleh konfigurasi Apache.
• Log Kesalahan Apache: Periksa berkas log error Apache melalui XAMPP Control Panel (klik tombol Logs di samping Apache lalu pilih apache_error.log) untuk melihat detail spesifik penyebab kegagalan pembacaan modul.