Taller de PHP para construir lo que sería una plantilla en PHP, que tiene el marco de HTML de la página, que sería común a todo el sitio web, cargando distintos contenidos en su cuerpo con includes.
Vamos a comenzar introduciendo a que nos referimos con plantilla. Una plantilla va a ser un portada genérica para nuestra web, que solo contendrá los menus y elemenos indispensables que además mostraremos en todas las páginas por igual.
ATENCIÓN: Aunque la idea que hay detrás de este artículo es positiva y la intención es buena, pues es posible crear una plantilla sencilla con includes, la implementación que ofrece este autor no es recomendable. Básicamente porque usa datos introducidos por el usuario en la URL para crear las rutas de los archivos que se deben incluir. Esto potencialmente podría hacer que personas al manipular las URL compongan rutas de archivos para incluir distintos a los que el desarrollador pudiera querer.
Por favor, toma este artículo solo como una idea de lo que se puede hacer con includes y el ejemplo como posibles usos de estas instrucciones de PHP, pero no implementes este ejemplo tal cual en un sitio web en producción sin validar la entrada del usuario, comprobando que corresponde con alguno de los valores esperados por la aplicación.
Para zanjar posibles problemas de seguridad hemos actualizado el artículo indicando el posible código PHP que podrías usar para verificar la entrada por parte del usuario y asegurar que corresponde con algo esperado y válido.
¿Para qué queremos una plantilla con includes?
Pues esto nos puede ser sumamente util en algunos casos por dos motivos.
- Teniendo una plantilla conseguimos un codigo más limpio, ya que los marcos y todo lo que engloba al diseño general pueden ir engoblados en un solo archivo, de modo que cualquier modificicación se puede hacer sobre este mismo archivo afectando de manera inmediata al resto de las páginas. Además de ahorrarnos mucho trabajo ;)
- Conseguimos una web más uniforme, de modo que el usuario no sé perderá entre diferentes secciones llenas de menús que puedan hacer engorrosa la navegabilidad.
Comencemos a crear la plantilla
Nuestro código va a ser sumamente simple, para empezar crearemos una tabla que no servirá como marco donde deberemos poner nuestros logotipos, menus, publicidad,.. y lo más importante, el contenido.
Lo que diferencia una plantilla de una página normal, es que el contenido lo vamos a generar de otra forma, vamos a ver como queda inicialmente lo que hemos hecho hasta ahora:
<!DOCTYPE html>
<html lang="es">
<head>
<title>Plantilla en PHP</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3">
<div align="right">Logotipo y Titulo</div>
</td>
</tr>
<tr>
<td width="20%">
<p>Menu principal</p>
<ul>
<li><a href="">Sección 1 </a></li>
<li><a href="">Sección 2 </a></li>
<li><a href="">Sección 3 </a></li>
</ul>
</td>
<td colspan="2" valign="top">
Aquí irá el contenido
</td>
</tr>
<tr>
<td colspan="3">Pie de página </td>
</tr>
</table>
</body>
</html>
Ya tenemos lista la primera parte, ahora veamos como vamos a utilizar el PHP para poder introducir contenido dentro de esta plantilla.
Para ello vamos a utilizar la función include de PHP. Esta nos permite introducir una página dentro de otra con tan solo indicarle la ruta del archivo, así utilizaremos una variables (que pasaremos por URL) para indicar a que sección queremos acceder.
Por ejemplo, si utilizamos una variable llamada $sec por ejemplo podriamos acceder a una sección utilizando el link "?sec=seccion1", de modo que a continuación en nuestro código y para evitar fallos innecesarios comprobaremos que el archivo 1.html/ 1.htm/ 1.php/... existe y en tal caso lo incluiremos.
Veamos a contianuación el código:
<?php
$sec = $_GET['sec'];
if (empty($sec)) {
include("presentacion.html");
} else {
if (file_exists($sec . ".php"))
include($sec . ".php");
elseif (file_exists($sec . ".html"))
include($sec . ".html");
else
echo 'Perdón pero la página solicitada no existe';
}
?>
El problema de seguridad está en este código, pues está haciendo un include con la variable $sec que obtiene directamente de $_GET sin validar si realmente es un valor de $sec esperado.
Una solución a este problema podría ser comprobar si $sec está dentro de una serie de valores permitidos. Para ello podríamos usar un array con los posibles valores y la función in_array() de PHP, que informa si un valor dado está o no dentro del array.
$posiblesValores = ['pag1', 'pag2', 'otra'];
if(! in_array($sec, $posiblesValores)) {
// si no es un valor permitido, entonces mostraríamos la portada simplemente seteando $sec a null
$sec = null;
}
En este caso hemos comprobado solo si existe el archivo "1.html" y "1.php".
Pero ¡cuidado con este código!, ya que en el caso de que tengamos ambos archivos en nuestro servidor siempre se mostrará el ".php" ya que es el primero que aparece.
De este modo conseguimos finalmente un fichero con la siguiente forma:
<!DOCTYPE html>
<html lang="es">
<head>
<title>Plantilla en PHP</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3">
<div align="right">Logotipo y Titulo</div>
</td>
</tr>
<tr>
<td width="20%">
<p>Menu principal</p>
<ul>
<li><a href="?sec=1">Sección 1 </a></li>
<li><a href="?sec=2">Sección 2 </a></li>
<li><a href="?sec=3">Sección 3 </a></li>
</ul>
</td>
<td colspan="2" valign="top">
<?php
if (empty($sec)) {
include("presentacion.html");
} else {
if (file_exists($sec . ".php"))
include($sec . ".php");
elseif (file_exists($sec . ".html"))
include($sec . ".html");
else
echo 'Perdón pero la página solicitada no existe';
}
?>
</td>
</tr>
<tr>
<td colspan="3">Pie de página </td>
</tr>
</table>
</body>
</html>
Aquí podeis ver la documentación de la funcion file_exists que usamos para verificar que el include existe.
Bueno y solo comentar un pequeño detalle más, debeis tener cuidado con las páginas que incluis dentro de otras, ya que las cabeceras y los tags van dentro de nuestro index.php, si incluis un archivo con cabeceras dentro de otro creareis un mal código html, que posiblemente no tenga mucho efecto en el visitante pero sí será un obstaculo para encontrar posibles errores o simplemente para leer vuestro propio codigo.
Por último os recomendamos usar un sistema de templates en PHP, para implementar soluciones más profesionales. Podéis aprender más en el artículo Plates: sistema de templates nativos en PHP.
Raúl Jiménez Ortega
Desarrollador web