includes en sus proyectos para agilizar y organizar el desarrollo de sitios web. Los includes son pequeños pedazos de código comunes a varias páginas y que separamos en diferentes archivos para incluirlos siempre que lo necesitemos. Su uso nos permite agilizar terriblemente el desarrollo de cualquier proyecto.

¿Qué son los includes HTML?

Los includes en HTML forman parte de la serie de directivas SSI (Server Side Includes). Esto añade cierto dinamismo a nuestras páginas HTML sin tener que recurrir a otras tecnologías como PHP, ASP o JSP.

¿Para qué usar includes en HTML?

El uso de includes nos va a permitir trabajar independientemente en las distintas partes en las que se divide de manera lógica un sitio web. Esquema de página clásica: Cabecero, pie, cuerpo y barra lateral Pongamos por ejemplo una web clásica con una división en cabecero, cuerpo de página, pie de página y una barra lateral. Muchas de estas partes se repetirán a lo largo del sitio web y si queremos modificar algunas de ellas hemos de realizar el mismo cambio en todas las páginas que incluyen dicho pedazo de código. Con includes trabajamos como si de páginas HTML independientes, insertándolas en nuestras páginas con una sencilla línea de código. Digamos que sería como crear un iframe de un archivo HTML, pero, en este caso, nuestro servidor lo procesará y servirá la página con el archivo incrustado.

¿Cómo puedo habilitar el uso Server Side Includes en mis páginas?

  • Lo primero que necesitamos es tener montado un servidor web en nuestro equipo. Simplemente un servidor Apache sin más tecnología añadida (PHP, MySQL) bastaría.
  • En segundo lugar hemos de habilitar el uso de SSI en la configuración de Apache. Para ello hemos de acceder a la ubicación del archivo httpd.conf y realizar los siguientes cambios:

Buscar el texto <Directory /> y asegurarnos de añadir la siguiente línea de código:

De manera que nos quede algo como esto (pueden variar el resto de opciones dependiendo de la configuración de cada uno):

  • En tercer lugar asegurarnos de tener descomentadas o, en su defecto, incluir en el archivo httpd.conf las siguientes líneas de código en el apartado <IfModule mime_module>:

  • Una vez reiniciado nuestro servidor Apache ya deberíamos poder empezar a disfrutar de los includes en HTML.

¿Cómo usar includes en mis páginas HTML?

Para poder usar esta tecnología en nuestras páginas, estas han de tener la extensión .shtml en vez de las clásicas .html o .htm. Los archivos a incluir pueden tener la extensión que usemos habitualmente .html o .htm. Includes en HTML Si, por ejemplo, hemos separado el cabecero en un archivo aparte (cabecero.html) y queremos añadirlo a nuestro index (índex.shtml) lo único que tendremos que hacer es añadir en la parte donde queramos incluirlo el siguiente código:

Este método nos permitirá trabajar separando las partes lógicas de una página y mantener una estructura sólida en cualquier sitio. A partir de este momento, cualquier cambio que hagamos en el archivo cabecero.html