lunes, 19 de diciembre de 2016

Hacer pagina que solo cargue el contenido

Hola Arcanitos, en esta ocasión les enseñaré mi forma de hacer que dentro de una página solo se cargue una vez el marco (banner, menu, footer, etc) y solo recargue el contenido según el link al que entramos. Por ejemplo en esta página:

(Pueden visitarla haciendo click aquí)
En la página del ejemplo al hacer click en cada ítem del menú, no va a recargar toda la página, solo recargara lo que esta dentro del div "contenido" o como quieran llamarle.

Ademas de ahorrar tiempos de cargas, es muy útil por si quieren hacer algún cambio en el marco (como les dije antes, menu, banner, footer, etc).
Si quieren hacer un cambio en el marco y no tienen este sistema implementado, tendrían que hacer el cambio en el código de todas las páginas que tengan. En cambio con este sistema lo hacen en el index.php y listo.

El código para esto es muy simple. Deben crear su página de "home" como cualquier otra que creen, luego dentro del div que tendrá el contenido deberán poner esto:


<div class="contenido">
    <?php
    if(!isset($_GET['id'])) 
    {
        ?><h1>Este es el home de la página</h1><?php
    }
    else if(file_exists($_GET['id'].".php")) 
    {
        $id = htmlspecialchars(trim($_GET["id"]));
        $id = eregi_replace("<[^>]*>","",$id) ;
        $id = eregi_replace(".*//","",$id) ;
        include("$id.php");
    } ?>
</div>


*Lo mas diferente es que al momento de crear el menú o de insertar links, deben poner una url un poquito mas larga, debe ser así:


<div class="menu">
    <img src="banner.png" style="height:90px;float:left;">
    <div onclick="location.href='index.php'" class="menu_blanco">HOME</div>
    <div onclick="location.href='index.php?id=empresa'" class="menu_blanco">EMPRESA</div>
    <div onclick="location.href='index.php?id=productos'" class="menu_blanco">PRODUCTOS</div>
    <div onclick="location.href='index.php?id=contacto'" class="menu_blanco">CONTACTO</div>
</div>


Dentro de los archivos "empresa.php", "productos.php", "contacto.php"; no deben poner nada del marco, solo la información que va en el contenido, por ejemplo el archivo "empresa.php" es asi de simple:


<h1>Empresa</h1>
 <p style="text-align:justify; padding: 50 50 50 50px;">Lorem ipsum dolor sit amet, 
 consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore 
 magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris 
 nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
 voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat 
 cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

No hay comentarios:

Publicar un comentario