PHP: Cmo crear un sitio web con secciones dinmicas con HTML, PHP, Delphi y MySQL

Explicamos paso a paso y con el cdigo fuente necesario (tanto en PHP, HTML, como en Delphi y las tablas para MySQL) cmo desarrollar un sitio web dinmico (mezcla de esttico y dinmico). Explicamos cmo hacer dinmicas algunas secciones de un sitio web esttico (noticias, productos o artculos). Adems, explicamos cmo desarrollar la aplicacin Delphi que actualizar los datos de la pgina web.

Definicin de sitio web dinmico qu es una web dinmica? Diferencias entre web dinmica y esttica. o Definicin sitio web dinmico. o Webs dinmicas vs. estticas. Requisitos para desarrollar una web dinmica. Decisin de las secciones dinmicas de la web, cmo crearlas, estructura de la base de datos. o Qu son las secciones dinmicas de una web? Cules desarrollar como dinmicas?. o Creacin de las tablas MySQL necesarias para las secciones del sitio web dinmico. o Cmo crear la pgina principal de nuestro sitio web dinmico. o La seccin y el fichero PHP para los artculos (productos). o Ventana de detalle (ficha tcnica) del producto. La aplicacin AjpdSoft Gestor de contenidos Web en Delphi para modificar contenidos. o Detalles tcnicos y funcionamiento de AjpdSoft Gestor de contenidos Web. o Descarga y configuracin inicial de la aplicacin AjpdSoft Gestor de contenidos Web. Cmo preparar un hosting para instalar nuestro sitio web dinmico. o Requisitos del hosting para instalar una web dinmica. o Preparacin de la base de datos MySQL y las tablas para el sitio web dinmico. o Preparacin de los ficheros de nuestro sitio web dinmico (logos, imgenes, diseo, etc.). o Subir ficheros del sitio web al servidor FTP. Artculos relacionados. Crditos.

Definicin de sitio web dinmico qu es una web dinmica? Diferencias entre web dinmica y esttica
Definicin sitio web dinmico
Un sitio Web dinmico es aquel que muestra su contenido obtenindolo, normalmente, de una base de datos, empleando para ello lenguajes para la web como JSP, PHP ASP. Mediante estos lenguajes el desarrollador web crea aplicaciones que acceden a la base de datos y muestran al usuario final la web, segn el contenido de las tablas de la base de datos. Mediante este mtodo, los desarrolladores web crean tambin aplicaciones con estos lenguajes (JSP, PHP, ASP, etc.), para que el usuario (normalmente accediendo con sus credenciales) pueda modificar el contenido de la web. Siempre intentando que no se requieran conocimientos deHTML ni de desarrollo por parte del usuario. Por supuesto, dependiendo del tipo de web, este mtodo de dinamismo se puede aprovechar para cualquier uso: foros, comunidad de usuarios, descargas, perfiles, comentarios, votos, libros de visita, compra de productos, catlogo de productos, encuestas, etc.

Webs dinmicas vs. estticas

La ventaja principal de las web dinmicas frente a las estatticas es que con las dinmicas, las secciones y

posibilidades son casi infinitas. En una web dinmica podremos tener foros, encuestas, comunidad de usuarios, etc. algo imposible en una web esttica. Adems, las webs dinmicas requieren de muy pocos conocimientos por parte del usuario para gestionar su contenido. Otra de las grandes ventajas es que existen ya desarrollados y gratuitos numerosos CMS como Joomla! que son sistemas de gestin de contenidos profesionales. stos permiten crear un sitio web completamente dinmico casi sin conocimientos de HTML ni de programacin web. Permiten aadirles mdulos de foros, galeras de imgenes y dems, todos ellos ya desarrollados y gratuitos. El inconveniente principal de los sitios web dinmicos frente a los estticos es que el desarrollo de este tipo de Web dinmicas es muchsimo ms complicado que el de una web esttica. Para desarrollar una web dinmica se requieren conocimientos de programacin (en PHP u otro lenguaje elegido como ASP, JSP, etc.), conocimientos de bases de datos (MySQL, PostgreSQL, etc.) y conocimientos de HTML. Otra de las desventajas es que las webs dinmicas suelen ser ms lentas en su carga que las webs estticas, pues requieren de acceso a base de datos y de compilacin de los archivos PHP, ASP, JSP, etc. en el servidor para ser devueltos al usuario en HTML (entendible por el navegador).

Requisitos para desarrollar una web dinmica

En primer lugar deberemos disponer de un servidor de hosting (alojamiento web) que permita usar base de datos MySQL y que permita y soportePHP. Pues los datos de las secciones dinmicas de la web se guardarn en la base de datos MySQL que crearemos a tal efecto y con el lenguaje de programacin web PHP accederemos a estos datos para mostrarlos en la web. Adems de este requisito, para el software externo que usar el usuario propieratio del sitio web para actualizar las secciones dinmicas, el servidor de hosting debe permitir el acceso externo (desde fuera del servidor MySQL) a la base de datos MySQL. Lgicamente, necesitaremos un servicio de FTP con usuario y contrasea para poder subir los ficheros html, php, css, png y jpg que compondrn la web. Este servicio suelen tenerlo todos los hosting del mercado. Por supuesto, siempre podremos optar por crear nuestro sitio web en servidores propios (de la propia empresa), como explicamos en este artculo: Montar un servidor web y un sitio web en Windows 7 con AppServ y Joomla! Se necesitarn conocimientos mnimos de HTML, PHP, Delphi y base de datos MySQL, no han de ser conocimientos avanzados, pues explicaremos y pondremos a disposicin de nuestros usuarios el cdigo fuente completo del sitio web dinmico de ejemplo usado en este artculo, as como el cdigo fuente completo de la aplicacin AjpdSoft Gestor de contenidos Web. Tambin publicaremos el script SQL de creacin de las tablas de la base de datos. Por lo que slo se requerirn conocimientos mnimos para modificar algunos ficheros png y jpg (para cambiar los logotipos) y un poco de PHP para modificar los ficheros PHP y cambiar algunos pequeos detalles para personalizarlos.

Decisin de las secciones dinmicas de la web, cmo crearlas, estructura de la base de datos
Qu son las secciones dinmicas de una web? Cules desarrollar como dinmicas?
Las secciones dinmicas sern aquellas cuyo contenido pueda ser actualizado externamente por el usuario, sin necesidad de tener conocimientos deHTML ni de PHP. Con esta utilidad que explicaremos en este artculo, cualquier usuario podr actualizar el contenido de las secciones dinmicas de la web.

En nuestro caso desarrollaremos un software con Delphi que ser el que use el usuario para actualizar el contenido de las secciones dinmicas de la web. Aunque lo habitual suele ser desarrollar una seccin de "administracin" dentro de la propia web, con PHP, desde la que el usuario, iniciando sesin con sus credenciales, podra actualizar el contenido de la web. Pero, presisamente por ser lo tpico, nosotros optaremos por realizar este proceso mediante un software desarrollado con Delphi, con una serie de ventajas respecto a una pgina web. En primer lugar deberemos establecer qu secciones de nuestra web sern dinmicas (actualizables automticamente mediante software). En este artculo crearemos las siguientes secciones dinmicas de ejemplo: Productos (con foto, categoras y ficha tcnica), Destacados (seccin que aparecer en la portada o pgina principal de la web) y Noticias (que aparecern en la parte izquierda de la portada de la web). Para crear estas secciones y la web completa deberemos tener conocimientos HTML, pues hemos de crear un diseo y una primera estructura (con su encabezado, parte central y pi). Esta parte no la explicaremos aqu por motivos obvios, aunque s colocaremos en nuestra seccin de descargas un ejemplo de cada fichero PHP de la web.

Creacin de las tablas MySQL necesarias para las secciones del sitio web dinmico
Dependiendo de las secciones que consideremos dinmicas variar la estructura de la base de datos que utilizaremos, en nuestro caso, como hemos comentado, tendremos las secciones: Productos, Destacados y Noticias. Por ello a continuacin mostramos el script SQL para crear las tablas necesarias para guardar los datos de estas secciones dinmicas:

Para los artculos:

CREATE TABLE `articulo` ( `id` int(10) unsigned NOT NULL auto_increment, `referencia` varchar(20) default NULL, `texto` varchar(255) NOT NULL default '', `precio` varchar(10) default NULL, `idseccion` int(10) unsigned default NULL, `idimagen` int(11) default NULL, `idimagengrande` int(10) unsigned default NULL, `descripcion` text, PRIMARY KEY (`id`) ) TYPE=MyISAM;
Para las secciones de los artculos (idseccion):

CREATE TABLE `seccion` ( `id` int(10) unsigned NOT NULL auto_increment, `nombre` varchar(50) NOT NULL default '', `descripcion` text, `idimagen` int(10) unsigned default NULL, PRIMARY KEY (`id`) ) TYPE=MyISAM;

Para los destacados:

CREATE TABLE `destacado` ( `id` int(10) unsigned NOT NULL auto_increment, `idimagen` int(10) unsigned default NULL, `titulo` varchar(100) NOT NULL default '', `fecha` datetime default NULL,

`descripcion` text NOT NULL, `enlacemostrar` varchar(100) default NULL, `fechacaducidad` datetime default NULL, `activa` char(1) default NULL, `enlaceurl` varchar(200) default NULL, `enlaceblank` char(1) default NULL, `enlacehit` varchar(100) default NULL, PRIMARY KEY (`id`) ) TYPE=MyISAM;
Para las noticias:

CREATE TABLE `noticia` ( `id` int(10) unsigned NOT NULL auto_increment, `idimagen` int(10) unsigned default NULL, `titulo` varchar(100) NOT NULL default '', `fecha` datetime default NULL, `descripcion` text NOT NULL, `enlacemostrar` varchar(100) default NULL, `fechacaducidad` datetime default NULL, `activa` char(1) default NULL, `enlaceurl` varchar(200) default NULL, `enlaceblank` char(1) default NULL, `enlacehit` varchar(100) default NULL, PRIMARY KEY (`id`) ) TYPE=MyISAM;
Adems, necesitaremos las siguientes tablas para el correcto funcionamiento de nuestra pgina web dinmica:

Necesitaremos una tabla para guardar las referencias a las imgenes, pues cada registro de cada seccin anterior puede tener su imagen (idimagen). Estas imgenes podrn ser subidas al servidor FTP mediante la aplicacin AjpdSoft Gestor de contenidos Web, el script para crear esta tabla:

CREATE TABLE `imagen` ( `id` int(11) NOT NULL auto_increment, `imagen` varchar(255) NOT NULL default '', `imagenlocal` varchar(255) default NULL, PRIMARY KEY (`id`) ) TYPE=MyISAM;
Utilizaremos otra tabla para guardar los parmetros de configuracin de la aplicacin, para que el usuario pueda modificar el nmero de noticias a motrar, la ruta en el FTP de las imgenes y otros valores:

CREATE TABLE `configuracion` ( `id` int(10) unsigned NOT NULL auto_increment, `parametro` varchar(35) NOT NULL default '', `valor` varchar(100) NOT NULL default '', PRIMARY KEY (`id`) ) TYPE=MyISAM;
Un ejemplo del contenido de la tabla anterior:

INSERT INTO `configuracion` (`id`,`parametro`,`valor`) VALUES (1,'ruta_imagen','http://www.ajpdsoft.com/img/articulos/'), (2,'numero_maximo_noticias','10'), (3,'numero_maximo_destacados','10'),

(4,'ruta_imagen_ftp','www/img/articulos');

En la web de ejemplo que publicamos en este artculo, incluimos una seccin "Descargas" que requerir de la tabla descargas:

CREATE TABLE `descarga` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `descripcion` varchar(100) NOT NULL DEFAULT '', `url` varchar(255) DEFAULT NULL, `tamano` float DEFAULT NULL, `idcliente` int(10) unsigned DEFAULT NULL, `fechaalta` datetime DEFAULT NULL, `rutalocal` varchar(255) DEFAULT NULL, `fichero` varchar(100) NOT NULL DEFAULT '', `publica` char(1) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8;
Puesto que la seccin descargas requiere de usuario y contrasea, tambin utilizaremos la tabla "usuario" y "cliente" para guardar los usuarios que podrn acceder a la seccin descargas y a qu cliente de nuestra empresa pertenece cada usuario:

CREATE TABLE `usuario` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `usuario` varchar(20) NOT NULL DEFAULT '', `contrasena` varchar(20) NOT NULL DEFAULT '', `idcliente` int(10) unsigned NOT NULL DEFAULT '0', `fechaalta` datetime DEFAULT NULL, `email` varchar(255) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8; CREATE TABLE `cliente` ( `id` int(11) NOT NULL AUTO_INCREMENT, `nombre` varchar(20) NOT NULL DEFAULT '', `apellidos` varchar(50) NOT NULL DEFAULT '', `nif` varchar(10) DEFAULT NULL, `direccion` varchar(50) DEFAULT NULL, `ciudad` varchar(20) DEFAULT NULL, `provincia` varchar(20) DEFAULT NULL, `pais` varchar(20) DEFAULT NULL, `cp` varchar(10) DEFAULT NULL, `telefono` varchar(20) DEFAULT NULL, `email` varchar(50) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8;

En la siguiente URL podremos descargar de forma gratuita el script SQL de creacin de todas las tablas del sitio web dinmico: AjpdSoft Gestor de Contenidos Web y Sitio Web Dinmico de ejemplo

Cmo crear la pgina principal de nuestro sitio web dinmico

En nuestro caso, la pgina principal mostrar una imagen o banner de encabezado, dos imgenes debajo de sta, en la parte izquierda las noticias (seccin dinmica) y en la parte derecha los destacados (seccin dinmica). La pgina inicial de nuestra web de ejemplo quedar de esta forma:

En esta pgina principal (fichero index.php) deberemos crear el diseo HTML (lgicamente) y para las secciones dinmicas de Noticias y Destacados deberemos aadir el cdigo PHP necesario para acceder a la base de datos MySQL y mostrar los datos dados de alta por el usuario y activados con la aplicacin AjpdSoft Gestor de contenidos Web. Para el caso de las Noticias, incrustaremos el cdigo PHP siguinte en la parte de HTML donde queramos que aparezcan del fichero index.php:

<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td style=" padding:15px; text-align:justify; "> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <? require('config.php'); conectarbd(); $numregistros = valorparametro("numero_maximo_noticias"); $sql = "SELECT fecha, titulo, descripcion, enlacemostrar, " . " enlaceurl, enlacehit, enlaceblank, idimagen "

. " FROM noticia WHERE activa='S' " . "ORDER BY fecha DESC LIMIT 0,$numregistros"; $sqlResultado = mysql_query($sql); while ($row = mysql_fetch_array($sqlResultado)) { $fecha = $row["fecha"]; $titulo = $row["titulo"]; $descripcion = $row["descripcion"]; $enlacemostrar = $row["enlacemostrar"]; $enlaceurl = $row["enlaceurl"]; $enlacehit = $row["enlacehit"]; $enlaceblank = $row["enlaceblank"]; $idimagen = $row["idimagen"]; if ($idimagen != 0 & $idimagen != "") { $imagen = obtenerimagen($idimagen); $imagen = valorparametro("ruta_imagen") . $imagen; } else { $idimagen = 0; } if ($enlaceblank) { $enlaceblank = "_blank"; } else { $enlaceblank = "_self"; } echo "<tr><td><br>"; //fecha if ($fecha != "") { echo "<span class='fechanoticia'>".$fecha."</span><br><br>"; } //titulo echo "<span class='titulonoticia'>".$titulo."</span>"; echo "<br>"; //descripcion echo $descripcion; echo "<br><br>"; //Enlace if ($enlaceurl != "") { echo "<a href='" . $enlaceurl . "' title='" . $enlacehit . "' target=" . $enlaceblank . " ><img src='img\ver.gif'" . " border='0' align='left' width='67' height='15'></a>"; }

//Imagen if ($idimagen != 0) { echo "<img align='right' width='103' src=" . $imagen . " />"; } mysql_close($enlace); echo "<br></td></tr>"; } ?> </table> </td> </tr> </table> </td>

De la misma forma, para el caso de los destacados, en el fichero index.php, en la parte en que queramos que aparezcan del HTML, aadiremos el siguiente cdigo PHP:

<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"> <tr> <td height="16" valign="top"> </td> <td valign="top"> </td> </tr> <? require ("config.php"); conectarbd (); $numregistros = valorparametro("numero_maximo_destacados"); $sql = "SELECT fecha, titulo, descripcion, enlacemostrar, enlaceurl, " . " enlacehit, enlaceblank, idimagen " . " FROM destacado " . " WHERE activa='S' ORDER BY id desc LIMIT 0,$numregistros"; $sqlResultado = mysql_query($sql); while ($row = mysql_fetch_array($sqlResultado)) { $titulo = $row["titulo"]; $descripcion = $row["descripcion"]; $enlacemostrar = $row["enlacemostrar"]; $enlaceurl = $row["enlaceurl"]; $enlacehit = $row["enlacehit"]; $enlaceblank = $row["enlaceblank"]; $idimagen = $row["idimagen"]; if ($idimagen != 0 & $idimagen != "") { $imagen = obtenerimagen($idimagen); $imagen = valorparametro("ruta_imagen") . $imagen;

} else { $idimagen = 0; } //falla, no devuelve el valor if ($enlaceblank) { $enlaceblank = "_blank"; } else { $enlaceblank = "_self"; } echo "<tr><td valign='top' bgcolor='#ffffff' style='padding:15px;'>"; //Imagen if ($idimagen != 0) { echo "<img style='paddingright:10px' align='left' width='130' src=" . $imagen . " /></td>"; } echo "<td valign='top' bgcolor='#ffffff' style='padding:15px;'>"; //titulo echo "<span class='titulodestacado'>".$titulo; //fecha if ($fecha != "") { echo " (".$fecha.")<br>"; } //fin de titulo echo "</span>"; //descripcion echo "<br><div style='textalign:justify'>".$descripcion."</div>"; //Enlace if ($enlaceurl != "") { echo "<div style='textalign:right'><a href='" . $enlaceurl . "' title='" . $enlacehit ."' target=" . $enlaceblank . " >[+ info]</a></div>"; } echo "</td></tr>"; } mysql_close($enlace);

?> </table> </tr> </table>

Notas sobre el cdigo PHP anterior: 1. Hemos dejado un poco de cdigo HTML al principio y al final para que se vea cmo se incrusta el cdigo PHP en el HTML. 2. En el cdigo PHP hay varias funciones: conectarbd, valorparametro y obtenerimagen que hemos ubicado en otro fichero PHP, llamado config.php (de ah la lnea de cdigo require('config.php'), con el siguiente cdigo:

</td>

<? //para conectar con la bd MySQL function conectarbd () { $servidor = "localhost"; $usuariobd = "usuariobdajpdsoft"; $contrasena = "contraseausuariobdajpdsoft"; $nombrebd = "nombrebdajpdsoft"; $enlace = mysql_connect($servidor, $usuariobd, $contrasena); if (!$enlace) { die(); } @mysql_select_db($nombrebd, $enlace) or die (); } //para obtener el valor de un parmetro function valorparametro($parametro) { $sql = "SELECT parametro, valor FROM " . "configuracion WHERE parametro='$parametro'"; $sqlResultado = mysql_query($sql); $row = mysql_fetch_array($sqlResultado); return $row["valor"]; } function obtenerimagen($idimagen) { $sql = "SELECT imagen FROM imagen WHERE id=$idimagen"; $sqlResultado = mysql_query($sql); $row = mysql_fetch_array($sqlResultado); return $row["imagen"]; } ?>

La seccin dinmica y el fichero PHP para los artculos (productos)

Para el caso de la seccin Productos, cuando el usuario pulsa en el enlace del men de la pgina principal index.php "Productos", lo emplazaremos al fichero "productos.php", que en primer lugar mostrar el

encabezado tpico HTML de nuestro sitio web con el diseo deseado, el men, las noticias en la parte izquierda (como hemos explicado aqu) y las categoras de los productos de nuestro sitio web dinmico. Quedar de la siguiente forma: 1. Si no se ha pulsado en una categora (si se ha accedido a los productos) mostrar las categoras:

Si se ha pulsado una categora, pasaremos como parmetro por la URL el ID de la categora, por lo que mostrar los productos de esta categora:

Utilizaremos el fichero productos.php, como siempre, con su correspondiente encabezado HTML con el diseo de la pgina. En la parte en que queramos que aparezcan las categoras de los productos (si no se ha pulsado en una categora) o los productos de la categora seleccionada (si se ha pulsado en el enlace de una categora) aadiremos el siguiente cdigo PHP incrustado en el HTML:

<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"> <tr> <td height="16" valign="top"> </td> <td valign="top"> </td> </tr> <? //si se ha pulsado en una categora mostrar //los productos de sta if ($id != "") { $sql = "SELECT id, idimagen, referencia, texto, " . " descripcion, idimagengrande " . " FROM articulo WHERE idseccion=" . $id . " ORDER BY id ASC"; $sqlResultado = mysql_query($sql); while ($row = mysql_fetch_array($sqlResultado)) { $id = $row["id"]; $idimagen = $row["idimagen"];

$referencia = $row["referencia"]; $texto = $row["texto"]; $descripcion = $row["descripcion"]; $idimagengrande = $row["idimagengrande"]; echo "<td valign='top' bgcolor='#ffffff' " . "style='paddingleft:15px;padding-right:15px;'>"; if ($idimagen != 0 & $idimagen != "") { $imagen = obtenerimagen($idimagen); $imagen = valorparametro("ruta_imagen") . $imagen; } else { $idimagen = 0; } //Imagen if ($idimagen != 0) { echo "<img style='paddingright:10px'" . "align='left' width='130' src=" . $imagen . " />"; }

echo "</td>"; echo "<td bgcolor='#ffffff' style='" . "padding-left:15px;paddingright:15px;'>"; echo "<span class='titulodestacado'>" . $referencia . "<br></span>"; echo "<div style='textalign:justify'>".$texto."</div>"; if ($descripcion != "" or ($idimagengrande != "" or $idimagengrande != "")) { echo "<br><hr style='color:#BB0000; height:1px;'>" . "<div style='textalign:right;'> " . "<a href='#' onclick='abrirVentana(" . $id . ")' style=' textdecoration:none;'>" . "[Ms info]</a></div>"; } echo "<br></td></tr>"; }

} else {?> <tr><td colspan='2' style='padding:10px; '> <br> <p style="text-align:justify; color:#666666;"> A continuacin podr visualizar un listado de nuestros productos agrupados por categoras. </p> <p style="text-align:justify; color: #FF6400;font-weight: bold;">Categoras</p> <blockquote> <? $sql = "SELECT id, nombre " . " FROM seccion " . " WHERE nombre is not null ORDER BY nombre ASC"; $sqlResultado = mysql_query($sql); while ($row = mysql_fetch_array($sqlResultado)) { $titulo = $row["nombre"]; $id = $row["id"]; echo "<a href='productos.php?id=" . $id . "'> - " . $titulo . "</a><br><br>"; } echo"</blockquote>"; echo "<tr><td><br>"; } mysql_close($enlace); ?> </table></td> </tr> </table>

Ventana de detalle (ficha tcnica) del producto

A continuacin mostramos el cdigo fuente PHP para mostrar el detalle del productos (artculo) cuando el usuario pulsa "Ms info", dicho cdigo quedar en el fichero detalle.php:

<? session_start(); ?> <html> <head> <title>Detalles del producto</title> <link href="../css/estilo.css" rel="stylesheet" type="text/css"> </head> <body class="detalle" scroll="no"> <? require ("config.php"); conectarbd (); if ($idDetalle != "")

{ $sql = "SELECT id, idimagen, referencia, texto, descripcion, " . "idimagengrande, precio FROM articulo WHERE id=" . $idDetalle . " ORDER BY id ASC"; $sqlResultado = mysql_query($sql); while ($row = mysql_fetch_array($sqlResultado)) { $idimagen = $row["idimagen"]; $referencia = $row["referencia"]; $texto = $row["texto"]; $descripcion = $row["descripcion"]; $idimagengrande = $row["idimagengrande"]; $precio = $row["precio"]; ?> <table cellpadding="0" cellspacing="0" align="center" style="width:99%; height:99%; backgroundcolor:#FFFFFF;"> <tr> <td style="padding-left:15px;paddingright:15px;padding-top:15px; padding-bottom:5px; backgroundcolor:#FFFFFF;"> <span size:12px;"> <img style="padding-right:10px;" align="left" src="img/logo.gif" /> <? echo "$referencia "; ?> </span> <hr style='color:#BB0000; height:1px;'> <? if ($idimagengrande != 0 & $idimagengrande != "") { $imagen = obtenerimagen($idimagengrande); $imagen = valorparametro("ruta_imagen") . $imagen; } else { $idimagengrande = 0; } //Imagen if ($idimagengrande != 0) { echo "<img style='padding-right:10px' align='" . " left' width='180' src=" . $imagen . " />"; } echo "<br><div style='textalign:justify;color:#333333;'>" . $texto . "</div><br><br>"; class="titulodestacado" style="font-

?> </td> </tr> <tr> <td style="padding-left:15px; padding-right:15px; background-color:#FFFFFF;"> <? //mostramos el precio si ha iniciado sesin if (! empty($_SESSION["nombre_usuario"])) { if (! empty($precio)) { echo "<b>Precio estimado:<b> " . $precio . " euros<br><br>"; } } if ($descripcion != "") { echo "<span class='titulodestacado' style='font-size:12px;'>" . "Ficha tcnica del producto: </span><br><hr style='color:" . "#BB0000; height:1px;'><br>"; echo "<div id='scroll' style='textalign:justify; color:#333333; '>". $descripcion."</div>"; } ?> <br /><hr style='color:#BB0000; height:1px;'><br> </td> </tr> </table> <? echo "<br></td></tr>"; } } mysql_close($enlace); ?> </body> </html>

Nota sobre el cdigo: como se puede observar, usamos las sesiones de PHP para establecer si debemos mostrar el precio del producto o artculo en funcin de si es un usuario registrado (que ha iniciado sesin) o no. En el siguiente artculo explicamos el uso de las sesiones de PHP para este cometido: Uso de sesiones en PHP, variables de sesin, cerrar sesin, iniciar sesin

Otras secciones de nuestro sitio web con una parte dinmica

De la misma forma que hemos explicado para las secciones anteriores, si en alguna otra seccin queremos mostrar las noticias (siguiendo el diseo establecido), como por ejemplo en la seccin "Empresa", utilizaremos el mismo cdigo PHP explicado aqu para mostrar las noticias en la parte del HTML que queramos. En nuestro ejemplo mostramos las noticias en todas las secciones de la web:

Y, por supuesto, si queremos aadir ms secciones dinmicas slo tendremos que aadir la tabla correspondiente en MySQL y el fichero PHP con el cdigo para mostrar estos datos. En la siguiente URL podremos descargar de forma gratuita un sitio web dinmico de ejemplo con el cdigo PHP, HTML, script de creacin de las tablas y aplicacin de gestor de contenidos: AjpdSoft Gestor de Contenidos Web y Sitio Web Dinmico de ejemplo

La aplicacin AjpdSoft Gestor de contenidos Web en Delphi para modificar contenidos

Detalles tcnicos y funcionamiento de AjpdSoft Gestor de contenidos Web

Lo explicado anteriormente servir para mostrar la pgina web dinmica al usuario que la visite. Dicho cdigo HTML y PHP mostrar las secciones fijas (HTML) y las secciones dinmicas (HTML y PHP). Para el caso de las secciones dinmicas, el cdigo PHP mostrar los datos que el usuario administrador haya decidido. A continuacin explicamos cmo hemos desarrollado la aplicacin AjpdSoft Gestor de Contenidos Web para permitir al usuario administrador introducir datos para las secciones dinmicas. AjpdSoft Gestor de Contenidos Web ha sido desarrollada en Delphi, como ya hemos comentado la administracin de la web tambin podra haberse realizado en PHP (solicitando usuario y contrasea), pero hemos optado por una aplicacin de escritorio porque ofrece ms posibilidades y es ms sencilla de desarrollar (subir ficheros al FTP, control de errores, peticin de datos al usuario, etc.).

Para aquellos usuarios desarrolladores que quieran realizar alguna modificacin en el cdigo fuente de la aplicacin han detener en cuenta que utiliza dos componentes de pago:

DevExpress ExpressQuantumGrid: este componente es de pago pero es sustituible por el componente que incluye Delphi: DBGrid. EurekaLog: componente de pago para captura de errores profesional, se puede quitar la referencia a este componente para que sea el propio Delphi (o el desarrollador) el que haga la captura.

En el siguiente vdeo explicamos cmo funciona la aplicacin AjpdSoft Gestor de Contenidos Web:

Descarga y configuracin inicial de la aplicacin AjpdSoft Gestor de contenidos Web

Si eres usuario registrado (puedes hacerlo desde aqu gratuitamente), puedes descargar la aplicacin AjpdSoft Gestor de Contenidos Web, el cdigo fuente en Delphi 6 as como el sitio web dinmico completo de este ejemplo desde: AjpdSoft Gestor de Contenidos Web y sitio web dinmico La descarga incluye:

Aplicacin AjpdSoft Gestor de contenidos Web. Cdigo fuente en Delphi 6 de la aplicacin AjpdSoft Gestor de contenidos Web. Ficheros PHP, css, jpg y png del sitio web dinmico completo de ejemplo. Script SQL de creacin de las tablas para la base de datos del sitio web dinmico.

Una vez realizada la descarga, si ya disponemos del hosting y hemos creado las tablas de la web dinmica como explicamos aqu, podremos configurar la aplicacin AjpdSoft Gestor de Contenidos Web para acceder y gestionar los contenidos dinmicos. Ejecutaremos el fichero adminweb.exe(slo necesita la librera libmysql41.dll que incluimos en la descarga, el resto de ficheros pertenece al cdigo fuente y puede ser eliminado, si no se quieren realizar cambios en la aplicacin). En el primer acceso a la aplicacin AjpdSoft Gestor de Contenidos Web, puesto que an no hemos configurado los datos de acceso a la base de datos y al servidor FTP, nos mostrar la pestaa "Configuracin". Deberemos introducir los siguientes datos: En "Servidor":

Nombre/IP servidor: IP o nombre del servidor donde tengamos alojado el servidor de base de datos MySQL, en nuestro caso "ajpdsoft.com". Usuario BD: nombre el usuario de la base de datos MySQL del hosting que dimos de alta aqu, en el ejemplo "usudinamica".


En "FTP:

Contrasea: contrasea del usuario de la base de datos, en el ejemplo "123456". Nombre BD: nombre del catlogo o base de datos dado de alta en el hosting, como explicamos aqu, en el ejemplo "bddinamica". Protocolo: versin de la base de datos MySQL (con mysql-4.1 permite acceso a base de datos MySQL 5). Dependiendo del Protocolo elegido se requerir su correspondiente librera. En la descarga de este artculo incluimos la librera para MySQL 4 y 5. Puerto: puerto para acceso a la base de datos MySQL, normalmente el puerto por defecto 3306. Conectar al iniciar: si marcamos esta opcin cada vez que ejecutemos el fichero adminweb.exe se conectar directamente al servidor MySQL con los datos guardados.

URL: direccin del servidor ftp, en nuestro caso "ftp.ajpdsoft.com". Usuario: nombre del usuario FTP con permisos de acceso a las carpetas del sitio web. Contrasea: contrasea del usuario FTP anterior.

Una vez introducidos los datos de acceso, pulsaremos en "Guardar configuracin" y en "Conectar":

Si todo es correcto, al pulsar en "Conectar" nos mostrar en la parte inferior los parmetros de configuracin de la aplicacin que previamente insertamos ejecutando el script SQL (como indicamos aqu). Deberemos cambiar el valor de estos parmetros para adaptarlo a nuestras necesidades:

Una vez configurada la aplicacin AjpdSoft Gestor de Contenidos Web podremos usarla para personalizar los contenidos de nuestro sitio web dinmico. Por ejemplo, desde la pestaa "Noticias", pulsando en el botn "+" e introduciendo los datos correspondientes y pulsando en Validar (como indicamos en este vdeo):

Cmo preparar un hosting para instalar nuestro sitio web dinmico

Requisitos del hosting para instalar una web dinmica
Para que nuestra web dinmica funcione, como ya hemos comentado, necesitaremos un hosting con soporte de base de datos MySQL (u otra comoPostgreSQL), necesitaremos un hosting que permita subir y compilar ficheros PHP (con soporte para PHP) y que permita acceso externo a la base de datos MySQL (para la aplicacin AjpdSoft Gestor de Contenidos Web). Lgicamente tambin necesitaremos espacio web, con unas 100MB ser suficiente, aunque esto depender de la cantidad de productos, descargas e imgenes que queramos publicar en el sitio web.

Preparacin de la base de datos MySQL y las tablas

para el sitio web dinmico

Una vez contratado un hosting con estas caractersticas, accederemos al panel de control del hosting para crear la base de datos y las tablas de nuestro sitio web dinmico. En este ejemplo usamos el hosting de la empresa espaola Dinahosting (aunque para el resto de hosting el proceso es similar). Accederemos al panel de control y buscaremos la opcin de base de datos MySQL (o la elegida):

Crearemos una nueva base de datos (Creacin de BBDD), introduciremos el Nombre de la BBDD (nombre del esquema o base de datos, en nuestro caso "bddinamica"), introduciremos el usuaio propietario de la BBDD (en nuestro caso "usudinamica") e introduciremso la contrasea para este usuario (en nuestro caso "123456"). Anotaremos estos datos que luego necesitaremos para la aplicacin AjpdSoft Gestor de Contenidos Web y pulsaremos en "Crear base de datos":

Una vez creada la base de datos pulsaremos en "Ir a phpMyAdmin", se trata de un administrador de base de datos MySQL va web que suelen tener todos los hosting:

Desde phpMyAdmin pulsaremos en "Ventana de consulta":

Pulsaremos en el enlace "Importar archivos", a continuacin pulsaremos en "Examinar":

Buscaremos la carpeta "Script SQL creacin tablas" de la descarga de AjpdSoft Gestor de Contenidos Web (disponible en esta web) donde est el fichero sql con el script de creacin de las tablas necesarias para el sitio web dinmico:

A continuacin pulsaremos en "Continuar" para ejecutar el contenido del fichero "Script SQL Creacin tablas.sql":

Si todo es correcto en phpMyAdmin aparecern 10 tablas: articulo, cliente, configuracin (con 6 registros), descarga, destacado, imagen, noticia, seccion, sesion y usuario. Todas estas tablas sern usadas, como ya hemos explicado en este artculo, por nuestro sitio web dinmico:

Preparacin de los ficheros de nuestro sitio web dinmico (logos, imgenes, diseo, etc.)
Por supuesto, antes de subir los ficheros que compondrn nuestro sitio web al servidor FTP para hacerlos pblicos a los usuarios que visiten nuestra web, deberemos modificar y cambiar el diseo de los ficheros PHP, estilos css, imgenes jpg y png de nuestra web para adaptarlos a la imagen corporativa de nuestra empresa. Modificaremos todo lo necesario para que la web quede con el diseo deseado, principalmente los ficheros que componen el banner del encabezado (img/cabecera.png), y la pgina principal (img/cabecera02.png y img/inicio.jpg). Tambin la imagen de la seccin "Empresa": img/empresa01.png, as como el mapa de localizacin de la empresa: img/mapa.png. Por supuesto, deberemos editar todos los ficheros .php (contacto.php, descargas.php, detalle.php, empresa.php, index.php, localizacion.php y productos.php) con un editor de texto plano y cambiar el nombre de "Sitio web dinmico AjpdSoft" y otros datos particulares por los de la empresa en cuestin. Y, adems, algo fundamental, deberemos modificar el fichero config.php que contiene los datos de acceso a la base de datos creada anteriormente, editaremos el fichero config.php con un editor de texto plano y modificaremos los siguientes datos por defecto:

$servidor = "localhost"; $usuariobd = "usudinamica"; $contrasena = "123456"; $nombrebd = "bddinamica"; Por los datos introducidos al crear la base de datos. Guardaremos los cambios del fichero config.php.

Subir ficheros del sitio web al servidor FTP

Una vez creado el diseo y modificados los datos de acceso a la base de datos del fichero config.php, podremos subir los ficheros al servidor FTP para probar nuestro sitio web en real. Para ello deberemos disponer de usuario y contrasea FTP (que nos habr proporcionado nuestro alojamiento o hosting contratado) y de un cliente FTP como Filezilla Client. Instalaremos Filezilla Client, lo ejecutaremos y accederemos al men "Archivo" - "Gestor de sitios":

Pulsaremos en "Nuevo sitio":

En la parte izquierda introduciremos el nombre del nuevo sitio FTP, por ejemplo "ajpdsoft", a la derecha introduciremos los siguientes datos:

Servidor: url del servidor ftp, por ejemplo ftp.ajpdsoft.com. Puerto: si el puerto es diferente al de defecto (21) lo indicaremos aqu. Server Type: seleccionaremos "FTP - File Transfer Protocol". Logon Type: seleccionaremos "Normal". Usuario: introduciremos el usuario con permisos de escritura en la carpeta FTP del servidor, este usuario nos lo suele proporcionar el servidor de hosting que hayamos contratado o bien podremos consultarlo en el panel de control del hosting. Contrasea: contrasea del usuario anterior.

Pulsaremos en "Aceptar" para guardar el sitio y as no tener que volver a introducir los datos en Filezilla Client para futuras conexiones:

A continuacin pulsaremos el botn del gestor de sitios y seleccionaremos el sitio FTP creado anteriormente:

Si todo es correcto realizar la conexin al servidor FTP y nos mostrar las carpetas remotas que haya creadas, en nuestro caso, como prueba, crearemos una carpeta dentro de nuestro servidor FTP llamada "dinamico" donde alojaremos el sitio web dinmico de ejemplo de este artculo. Lo normal es subir los ficheros al raz del sitio para que el usuario, al teclear la url www.nuestro_dominio.com acceda directamente. En la parte izquierda (sitio local) nos situaremos en la carpeta que contiene los ficheros que componen nuestra web dinmica (ficheros PHP, png, jmb, css, etc.) que ya habremos modificado para adaptarlos a la imagen corporativa de nuestra empresa como indicamos aqu, en la parte derecha (sitio remoto) nos posicionaremos en la carpeta raz de nuestro sitio FTP (normalmente www). Seleccionaremos todos los ficheros de la parte izquierda que queramos subir, pulsaremos con el botn derecho del ratn sobre ellos y seleccionaremos la opcin del men emergente "Subir":

Filezilla Client nos mostrar el estado de la subida de cada fichero:

Una vez subidos todos los ficheros prodremos realizar una primera prueba de visualizacin de nuestro sitio web dinmico, desde cualquier navegador web escribiremos la URL de nuestro sitio web, en nuestro caso: Ejemplo sitio web dinmico por AjpdSoft Quedar algo as (sin noticias ni destacados pues an no los hemos creado):

Artculos relacionados

Ejemplo de sitio web dinmico. Descarga gratuita de AjpdSoft Gestor de Contenidos Web. Descarga gratuita de cdigo PHP y HTML de sitio web dinmico. Montar un servidor web y un sitio web en Windows 7 con AppServ y Joomla!. Cmo crear una web profesional y dinmica con el CMS Joomla 1.5.7. Gestionar la galera de imgenes MorfeoShow para Joomla. Artculos y manuales del Proyecto AjpdSoft sobre el CMS Joomla!. Conseguir un buen posicionamiento de nuestra web en los motores de bsqueda. Instalacin de Microsoft Windows 7 Ultimate virtualizado en VMware Server 2.0.1. Artculos, manuales y trucos del Proyecto AjpdSoft sobre MySQL Server. Trucos del Proyecto AjpdSoft sobre PHP. Artculos, manuales del Proyecto AjpdSoft sobre el ECM Alfresco. Artculos, manuales del Proyecto AjpdSoft sobre el CMS PHP-Nuke. Cmo transferir ficheros entre Windows y Linux mediante FTP. AjpdSoft Aviso Cambio IP Pblica. Cmo instalar y configuar SSH en GNU Linux Ubuntu con OpenSSH. Montar servidor proxy cach con filtrado web en Linux Ubuntu 9.10 con Squid.

AjpdSoft Configuracin Proxy. AjpdSoft Actualizacin Automtica. AjpdSoft Informacin de Fichero. AjpdSoft Validacin LDAP. AjpdSoft Copia de Seguridad. AjpdSoft Enciclopedia - Definicin Apache. AjpdSoft Enciclopedia - Definicin CMS.