Cara Eksekusi SHTML dan Mengaktifkan Server Side Includes

Cara eksekusi SHTML (Server Side Includes) memerlukan konfigurasi khusus pada web server agar server dapat memproses perintah SSI seperti #include, #echo, atau #flastmod sebelum halaman dikirimkan ke peramban pengguna. Berbeda dengan HTML statis murni, file berformat .shtml harus diurai terlebih dahulu oleh modul server yang aktif.

Untuk menjalankan file SHTML secara lokal maupun di server produksi, pastikan modul Server Side Includes pada web server Anda telah diaktifkan, lalu gunakan sintaks SSI yang benar di dalam dokumen. Berikut adalah rincian metode eksekusi pada lingkungan server utama beserta tabel perbandingan konfigurasinya.

Tabel Konfigurasi Eksekusi SHTML Berdasarkan Web Server

Web Server Modul / Direktif Utama Contoh Konfigurasi (Virtual Host / .htaccess)
Apache HTTP Server mod_include AddType text/html .shtml
AddOutputFilter INCLUDES .shtml
Nginx ngx_http_ssi_module ssi on;
ssi_types text/html shtml;
IIS (Internet Information Services) Server Side Includes Feature Mengaktifkan peran SSI melalui Server Manager / IIS Manager

Langkah Teknis Mengaktifkan dan Mengeksekusi SHTML di Apache

Apache merupakan server yang paling sering digunakan untuk menjalankan file SHTML menggunakan modul mod_include. Ikuti langkah-langkah berikut untuk mengonfigurasinya:

  1. Aktifkan Modul Include: Pastikan modul include_module aktif pada server Apache Anda. Pada Ubuntu/Debian, jalankan perintah sudo a2enmod include.
  2. Modifikasi File Konfigurasi atau .htaccess: Tambahkan aturan agar server mengenali ekstensi .shtml dan mengizinkan eksekusi SSI. Anda dapat meletakkannya di dalam blok direktori VirtualHost atau di dalam file .htaccess pada direktori web root.
  3. Buat File SHTML: Tulis kode SSI ke dalam file berformat .shtml.
  4. Uji Akses: Buka file melalui URL server (bukan dibuka langsung via protokol file:/// dari komputer lokal).

Berikut adalah contoh kode konfigurasi di dalam file .htaccess:

AddType text/html .shtml
AddOutputFilter INCLUDES .shtml
Options +Includes

Contoh Penulisan Kode SHTML

Setelah server dikonfigurasi, Anda dapat menyisipkan file lain (seperti header atau footer) menggunakan direktif #include. Contoh struktur file index.shtml:

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Contoh Eksekusi SHTML</title>
</head>
<body>
    <!-- Menyisipkan file header.html -->
    <!--#include virtual="/header.html" -->

    <main>
        <h1>Selamat Datang di Situs Kami</h1>
        <p>Halaman ini diproses menggunakan Server Side Includes.</p>
        <p>Dokumen ini terakhir dimodifikasi pada: <!--#flastmod file="index.shtml" --></p>
    </main>

    <!-- Menyisipkan file footer.html -->
    <!--#include virtual="/footer.html" -->
</body>
</html>

Konfigurasi SHTML pada Nginx

Nginx tidak menggunakan file .htaccess. Untuk mengeksekusi SHTML di Nginx, Anda harus menyunting blok server di dalam file konfigurasi utama (biasanya di /etc/nginx/sites-available/default atau nginx.conf).

server {
    listen 80;
    server_name contoh.com;
    root /var/www/html;

    index index.shtml index.html index.htm;

    location / {
        ssi on;
        ssi_types text/html shtml;
        try_files $uri $uri/ =404;
    }
}

Setelah menambahkan baris ssi on; dan ssi_types text/html shtml;, simpan file konfigurasi dan lakukan uji sintaks dengan perintah sudo nginx -t, lalu muat ulang layanan dengan sudo systemctl reload nginx.

Troubleshooting Masalah Eksekusi SHTML

Jika file SHTML Anda hanya menampilkan teks mentah berupa tag komentar SSI (seperti <!--#include ... -->) tanpa mengeksekusi isinya, periksa beberapa penyebab umum berikut:

  • Akses Langsung via Filesystem: SSI tidak akan diproses jika Anda membuka file melalui browser menggunakan path lokal (file:///C:/wamp/www/index.shtml). Anda wajib mengaksesnya melalui HTTP/HTTPS lokal seperti http://localhost/index.shtml.
  • Izin Opsi Server (Options +Includes): Pada Apache, pastikan direktif Options memiliki parameter +Includes dan tidak dibatasi oleh aturan AllowOverride None.
  • Kesalahan Penulisan Sintaks SSI: Perhatikan spasi di dalam tag komentar SSI. Format yang benar adalah <!--#perintah parameter="nilai" -->. Spasi di dalam tanda kurung siku pembuka dan penutup sangat krusial agar dikenali oleh server.