SHTML adalah ekstensi file untuk halaman web yang menggunakan teknologi Server Side Includes (SSI). Berbeda dengan file HTML biasa (.html atau .htm) yang langsung dikirimkan oleh server web apa adanya ke peramban pengguna, file .shtml diproses terlebih dahulu oleh server web (seperti Apache atau NGINX) sebelum dikirimkan. Pemrosesan ini memungkinkan server untuk menyisipkan konten dari file lain, menampilkan variabel server, atau menjalankan skrip ringan secara dinamis ke dalam satu halaman utama.
Kebutuhan utama pengguna yang mencari istilah ini umumnya berkisar pada pemahaman mengapa sebuah situs menggunakan format ini, bagaimana cara mengaktifkannya, serta bagaimana menyusun sintaks SSI di dalamnya untuk keperluan modularisasi halaman web seperti penggabungan header dan footer situs.
Fungsi Utama dan Cara Kerja SHTML
Fungsi utama dari file SHTML adalah modularisasi kode sumber situs web statis tanpa harus menggunakan bahasa pemrograman sisi server yang kompleks seperti PHP atau ASP. Misalkan sebuah situs memiliki bagian menu navigasi (header) dan kaki halaman (footer) yang sama persis di 50 halaman berbeda. Tanpa SSI, pengembang harus menyunting satu per satu file HTML jika ada perubahan menu. Dengan SHTML, pengembang cukup membuat satu file header terpisah, lalu memanggilnya di setiap file .shtml menggunakan instruksi SSI.
| Fitur / Aspek | HTML (.html / .htm) | SHTML (.shtml) |
|---|---|---|
| Pemrosesan Server | Tidak ada (dikirim langsung ke browser) | Diproses oleh server web (mencari instruksi SSI) |
| Modularisasi Konten | Tidak bisa (harus duplikasi kode) | Bisa menggunakan perintah #include |
| Dinamisme | Statis total | Semi-dinamis (bisa menampilkan tanggal, IP, variabel server) |
| Beban Server | Sangat ringan | Sedikit lebih berat karena perlu parsing server |
Sintaks Dasar Server Side Includes (SSI)
Instruksi di dalam file SHTML ditulis menggunakan komentar HTML khusus yang dikenali oleh pengampu web server. Berikut adalah contoh kode nyata penggunaan SSI untuk menyertakan file luar dan menampilkan tanggal modifikasi file:
<!--#include virtual="/header.html" -->
<main>
<h1>Selamat Datang di Situs Kami<l/h1>
<p>Halaman ini menggunakan ekstensi SHTML.</p>
<p>Terakhir diperbarui: <!--#flastmod file="index.shtml" --></p>
</main>
<!--#include virtual="/footer.html" -->Langkah Teknis Mengaktifkan SSI di Web Server
Agar file SHTML dapat berfungsi dengan benar, web server yang Anda gunakan harus dikonfigurasi untuk mengizinkan parsing SSI. Berikut adalah langkah-langkah implementasinya:
- Untuk Web Server Apache: Pastikan modul
include_moduleaktif. Tambahkan baris kode berikut ke dalam file.htaccessatau konfigurasi virtual host Anda:AddType text/html .shtml AddOutputFilter INCLUDES .shtml - Untuk Web Server NGINX: NGINX secara default tidak memiliki modul SSI aktif penuh untuk semua konteks. Tambahkan perintah ini di dalam blok server atau location:
ssi on; ssi_types text/html text/shtml; - Uji Coba: Buat file bernama
test.shtml, masukkan sintaks variabel sederhana seperti<!--#echo var="DATE_LOCAL" -->, lalu akses melalui peramban untuk memastikan tanggal server muncul dengan akurat.
Troubleshooting dan Tips Lapangan
Kendala yang sering terjadi saat menggunakan SHTML adalah halaman hanya menampilkan teks mentah dari kode SSI (misalnya teks <!--#include...--> muncul di layar browser). Hal ini menandakan bahwa web server belum dikonfigurasi untuk melakukan parsing file .shtml. Pastikan modul server sudah aktif dan periksa kembali direktif Options +Includes di pengaturan server Apache Anda.