Cara Menyertakan Satu File HTML di Yang Lain

click fraud protection

Yang Perlu Diketahui

  • Termasuk konten menghilangkan kebutuhan untuk mengedit setiap halaman situs Anda untuk konten berulang.
  • Sisi Server, PHP, dan Termasuk JavaScript memungkinkan Anda untuk menambahkan kode tertentu ke halaman mana pun yang ingin Anda sertakan filenya.
  • Situs CMS menggunakan template atau tema untuk konten berulang.

Artikel ini menjelaskan cara kerja "Sertakan" dan memberikan langkah-langkah untuk menggunakan Penyertaan Sisi Server, Penyertaan PHP, dan Penyertaan JavaScript.

Menggunakan Sisi Server Termasuk

Server Side Termasuk pertama kali dikembangkan untuk memungkinkan pengembang web untuk "menyertakan" dokumen HTML di dalam halaman lain. Pada dasarnya, potongan yang ditemukan dalam satu dokumen dimasukkan ke dalam dokumen lain ketika halaman dijalankan di server dan dikirim ke browser web.

SSI disertakan di sebagian besar server web, tetapi Anda mungkin harus mengaktifkannya agar dapat berfungsi. Jika Anda tidak tahu apakah server Anda mendukung SSI, hubungi penyedia hosting.

instagram viewer

Berikut adalah contoh bagaimana Anda dapat menggunakan SSI untuk memasukkan potongan HTML di semua halaman web Anda:

  1. Simpan HTML untuk elemen umum situs Anda sebagai file terpisah. Misalnya, bagian navigasi Anda mungkin disimpan sebagai navigasi.html atau navigasi.ssi.

  2. Gunakan kode SSI berikut untuk menyertakan kode dokumen HTML itu di setiap halaman.


    atau.

    Itu termasuk direktif menerima dua parameter. Virtual mengasumsikan bahwa nama file relatif terhadap root dokumen situs web, sedangkan mengajukan menerima jalur file absolut.

  3. Tambahkan kode ini pada setiap halaman yang ingin Anda sertakan filenya.

Menggunakan PHP Termasuk

Seperti SSI, PHP adalah teknologi tingkat server. Jika Anda tidak yakin apakah Anda memiliki fungsi PHP di situs web Anda, hubungi penyedia hosting Anda.

Berikut adalah skrip PHP sederhana yang dapat Anda gunakan untuk memasukkan cuplikan HTML pada halaman web apa pun yang mendukung PHP:

  1. Simpan HTML untuk elemen umum situs Anda, seperti navigasi, untuk memisahkan file. Misalnya, bagian navigasi Anda mungkin disimpan sebagai navigasi.html atau navigasi.ssi.

  2. Gunakan kode PHP berikut untuk memasukkan HTML itu di setiap halaman (mengganti jalur file dan nama file Anda di antara tanda kutip).

  3. Tambahkan kode yang sama ini pada setiap halaman yang ingin Anda sertakan filenya.

Termasuk JavaScript

JavaScript adalah cara lain untuk memasukkan HTML ke dalam halaman situs Anda. Teknik ini tidak memerlukan pemrograman tingkat server, tetapi sedikit lebih rumit — dan itu jelas berfungsi untuk browser yang memungkinkan Javascript, yang sebagian besar berfungsi kecuali pengguna memutuskan untuk menonaktifkan saya t.

Begini caranya you sertakan cuplikan HTML menggunakan JavaScript:

Simpan HTML untuk elemen umum situs Anda ke file JavaScript. HTML apa pun yang ditulis dalam file ini harus dicetak ke layar dengan dokumen. tulis fungsi.

  1. Unggah file itu ke situs web Anda.

  2. Gunakan 

  3. Gunakan kode yang sama pada setiap halaman yang ingin Anda sertakan filenya.

Apa yang Termasuk HTML?

Termasuk adalah bagian dari HTML yang bukan merupakan dokumen HTML lengkap dengan sendirinya. Sebaliknya, itu adalah bagian dari halaman lain yang dapat dimasukkan ke dalam halaman web penuh melalui pemrograman. Sebagian besar file yang disertakan adalah item yang disebutkan di atas yang diulang pada beberapa halaman situs web. Sebagai contoh:

  • Navigasi
  • Informasi hak cipta
  • Area tajuk
  • Area kaki

Bagaimana 'Termasuk' Membuat Desain Web Lebih Efisien

Hampir semua situs web menyertakan elemen desain yang diulang di setiap halaman di situs, termasuk area header tempat logo berada, menu navigasi, dan area footer.

Elemen berulang di situs memungkinkan konsistensi dalam pengalaman pengguna. Pengunjung tidak perlu mencari navigasi di setiap halaman karena begitu mereka menemukannya, mereka tahu di mana letak navigasi di halaman lain dari situs yang mereka kunjungi.

Konten yang disertakan menghilangkan kebutuhan untuk mengedit setiap halaman situs Anda untuk konten berulang ini. Sebagai gantinya, Anda mengedit satu file dan kemudian seluruh situs Anda dan setiap halaman di dalamnya mendapatkan pembaruan.

File HTML

Konten Berulang dalam Sistem Manajemen Konten

Jika situs Anda menggunakan CMS, maka kemungkinan menggunakan template atau tema tertentu adalah bagian dari perangkat lunak itu. Bahkan jika Anda membuat templat ini dari awal, situs masih memanfaatkan kerangka kerja ini untuk halaman. Dengan demikian, template CMS tersebut berisi area situs yang diulang di setiap halaman. Anda cukup masuk ke backend CMS dan mengedit template yang diperlukan. Semua halaman situs yang menggunakan template itu akan diperbarui.

Bahkan jika Anda tidak menggunakan sistem manajemen konten untuk situs Anda, Anda masih dapat memanfaatkan file yang disertakan. Dalam HTML, termasuk membantu mengelola area template situs Anda ini dengan lebih mudah.

Metode Sertakan Lainnya

Ada beberapa cara lain untuk menyertakan HTML di halaman Anda. Beberapa lebih rumit daripada yang lain, dan banyak dari mereka sebenarnya sudah ketinggalan zaman menurut standar saat ini.

  • CGI Termasuk: Kamu bisa memakai Perl atau bahasa pemrograman lain untuk membuat halaman Anda dan kemudian memasukkan apa pun yang Anda inginkan, baik sebagai file "memerlukan" atau dengan membacanya secara manual.
  • Flash Termasuk: Jika Anda membangun situs seluruhnya dalam Adobe Flash, Anda dapat menggunakannya untuk menyertakan elemen situs. Metode ini sudah ketinggalan zaman dan situs Flash lengkap jarang ada di Web akhir-akhir ini.
  • Bingkai Termasuk:: Daripada menggunakan elemen yang sama berulang-ulang di beberapa halaman, buat situs berbingkai di mana bingkai adalah bagian duplikat situs. Namun, kecuali untuk elemen iframe, frame sudah usang dalam HTML5.
  • Alat Manajemen Konten Termasuk: Templating adalah salah satu nilai jual utama CMS dan ini benar-benar bagaimana pekerjaan ini ditangani di sebagian besar situs saat ini.
instagram story viewer