Tutorial donde explicamos paso a paso cómo instalar la galería de fotos gratuita Phoca Gallery para Joomla! 2.5.
Mostramos cómo instalarla y cómo administrarla: crear categorías, subir
fotos. Explicamos cómo añadir un enlace en el menú de nuestro sitio web
para la galería de fotos y cómo traducirla al español.
En primer lugar, Phoca Gallery se instala sobre Joomla!, por lo que necesitaremos un equipo con Joomla!
instalado. A continuación indicamos algunos tutoriales sobre cómo
instalar Joomla! en equipos con sistemas operativos Windows y Linux:
Phoca Gallery creará una carpeta para las imágenes
subidas, por lo que en el proceso de instalación necesitaremos disponer
de permisos suficientes para crear carpetas en nuestro sitio web. Si no
disponemos de estos permisos habrá que crear la carpeta de las imágenes
de Phoca Gallery de forma manual.
En el proceso de instalación de Phoca Gallery se
realizarán algunas configuraciones por lo que si alguna no puede
establecerse el asistente de instalación lo indicará con un error.
Instalar Phoca Gallery en Joomla!
En primer lugar descargaremos el fichero comprimido desde la web oficial de Phoca Gallery, accederemos a la URL:
Descargaremos la última versión disponible, puesto
que vamos a realizar la instalación de Phoca Gallery de forma automática
desde Joomla! descargaremos "Phoca Gallery Component" - "Poca Gallery
(Joomla! 1.7, 2.5)", el fichero "com_phocagallery_v3.2.0.zip":
Abriremos la administración de Joomla!, accederemos
con un usuario que sea administrador de Joomla!, pulsaremos en el menú
"Extensiones" - "Gestor de Extensiones":
Pulsaremos en "Instalar" y en "Examinar" para seleccionar el fichero .zip descargado anteriormente:
Seleccionaremos el fichero descargado anteriormente "com_phocagallery_v3.2.0.zip" (no hay que descomprimirlo):
Tras seleccionar el fichero de instalación de Phoca Gallery pulsaremos en "Subir e Instalar":
Se iniciará el asistente de instalación de Phoca Gallery, pulsaremos "Install":
Si todo es correcto, el asistente de instalación de
Phoca Gallery nos lo indicará con el mensaje "Phoca Gallery successfully
installed" y nos mostrará el panel de control de Phoca Gallery para
administrarlo:
A partir de ahora, cada vez que queramos configurar o administrar
Phoca Gallery accederemos al menú "Componentes" - "Phoca Gallery":
Comprobaremos ahora la nueva extensión instalada
Phoca Gallery está habilitada, para ello accederemos al menú
"Extensiones" - "Gestor de Extensiones":
Pulsaremos en "Gestionar", en filtro escribiremos
"phoca" y pulsaremos "Buscar", nos mostrará "Phoca Gallery", si en
"Estatus" no muestra "Habilitado" marcaremos "Phoca Gallery" y
pulsaremos en "Habilitar":
Administrar Phoca Gallery para Joomla, categorías, fotos
Para administrar y configurar Phoca Gallery
accederemos al menú "Componentes" - "Phoca Gallery", desde el panel de
control de Phoca Gallery podremos añadir imágenes, categorías, cambiar
tema visual, consultar calificaciones de categorías e imágenes,
comentarios de imágenes y categorías, usuarios para establecer permisos,
enlace con Facebook, añadir etiquetas, etc.
Para añadir una nueva cetegoría (para agrupar las imágenes) pulsaremos en "Categories":
Pulsaremos en "Nuevo":
Introduciremos los datos para la nueva categoría:
Title: título para la categoría, será el texto que aparezca en la web.
Alias: nombre adicional identificativo de la categoría.
Parent Category: si queremos establer una categoría padre y que
esta sea una subcategoría seleccionaremos aquí la categoría padre.
Acceso: tipo de permisos de acceso a la categoría, para usuarios registrados o para todos los usuarios.
Access Rights: derechos de acceso a la categoría, nadie, todos los usuarios registrados, usuarios concretos, etc.
Upload Rights: qué usuarios podrán subir fotos en esta categoría.
Category Folder: carpeta del servidor donde se guardarán las fotos
de la categoría. Es recomendable crear una carpeta por categoría para
tener mejor organizadas las imágenes.
Para crear una nueva carpeta pulsaremos en "Select Folder" en "Category Folder":
Introduciremos el nombre de la carpeta a crear en "Folder" y pulsaremos "Create Folder":
Pulsaremos en el botón "Insert Folder" para seleccionar la carpeta creada para la categoría de imágenes que estamos creando:
Una vez introducidos todos los datos de la categoría pulsaremos "Guardar & Cerrar":
Traducir Phoca Gallery al español
A continuación explicamos cómo traducir Phoca Gallery al español de
forma sencilla. En primer lugar descargaremos el fichero zip con los
ficheros necesarios para la traducción al español, para ello accederemos
a la URL:
Descargaremos el fichero es-ES_com_phocagallery.j25.zip:
No descomprimiremos el fichero .zip, accederemos a la administración de Joomla!, al menú "Extensiones" - "Gestor de Extensiones":
En "Instalar" - "Archivo empaquetado" pulsaremos en "Examinar":
Seleccionaremos el fichero descargado anteriormente es-ES_com_phocagallery.j25.zip y pulsaremos "Abrir":
Pulsaremos "Subir e Instalar":
Si todo es correcto el asistente para instalar un
nuevo paquete nos mostrará: "paquete instalado correctamente
Phocagallery Spanish Language Package for joomla 2.5":
A partir de ahora los menús y todas las opciones de visualización de Phoca Gallery aparecerán en español:
Añadir menú a nuestro sitio web Joomla! para visulazar la galería Phoca Gallery
Explicamos ahora cómo añadir un enlace en nuestro
sitio web para mostrar las categorías e imágenes de nuestra galería
Phoca Gallery. Para ello accederemos a la administración de Joomla!,
pulsaremos en el menú "Menús" - "Gestor de Menú":
Seleccionaremos el grupo de menú en el que añadiremos el enlace y pulsaremos en "Nuevo":
Introduciremos los datos para el nuevo menú, en "Tipo Elemento Menú" pulsaremos en "Seleccionar":
Tras instalar Phoca Gallery, en la selección de tipo
de elemento de menú, dispondremos de un nuevo grupo llamado "Phoca
Gallery" con varias opciones para visualización en el menú:
List Of Categories (Categories View).
List of images (Category View).
Cooliris 3D Wall.
User Control Panel.
En nuestro caso seleccionaremso "List Of Categories (Categories View):
Tras introducir todos los datos del nuevo menú de nuestro sitio web Joomla! pulsaremos en "Guardar & Cerrar":
Desde ahora en nuestro sitio web aparecerá el enlace a la galería de fotos Phoca Gallery:
Subir y publicar fotos en Phoca Gallery
Desde "Imágenes" en el Panel de Control de Phoca Gallery, pulsaremos en "Nuevo":
Introduciremos los datos para la imagen como el
título, alias, categoría a la que pertenecerá. Pulsaremos en
"Seleccionar nombre de archivo" para subir una foto desde nuestro PC:
Seleccionaremos la carpeta donde se subirá la imagen, pulsaremos en "Examinar":
Seleccionaremos la imagen a subir:
Pulsaremos en "Empezar carga":
Seleccionaremos la imagen subida:
Introduciremos todos los datos que queramos para la
imagen a publicar (localización, vídeo de Youtube asociado, enlace,
descripción, metadatos, tag, etc.):
Pulsaremos "Guardar & Cerrar" para publicar la imagen:
Descarga gratuita (freeware) del código fuente (source code) 100% open source, desarrollado con Borland (ahora Codegear) Delphi 6, PHP y HTML, de la aplicación AjpdSoft Gestor de Contenidos Web: aplicación desarrollada como complemento para administrar los contenidos de un sitio web dinámico. Esta aplicación permite modificar los datos de las secciones dinámicas de la web por parte del usuario (sin necesidad de tener conocimientos de diseño web, HTML ni de programación). Con esta aplicación el usuario gestiona los contenidos dinámicos de su web (descargas, noticias, destacados, secciones, usuarios y productos o artículos). Esta descarga también incluye un sitio web dinámico de ejemplo con el diseño web y los ficheros PHP.
Explicamos paso a paso y con el código fuente necesario (tanto en PHP, HTML, como en Delphi y las tablas para MySQL) cómo desarrollar un sitio web dinámico (mezcla de estático y dinámico). Explicamos cómo hacer dinámicas algunas secciones de un sitio web estático (noticias, productos o artículos). Además, explicamos cómo desarrollar la aplicación Delphi que actualizará los datos de la página web.
Definición de sitio web dinámico ¿qué es una web dinámica? Diferencias entre web dinámica y estática
Definición sitio web dinámico
Un sitio Web dinámico es aquel que muestra su contenido obteniéndolo, 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, según el contenido de las tablas de la base de datos.
Mediante este método, los desarrolladores web crean también 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 de HTML ni de desarrollo por parte del usuario.
Por supuesto, dependiendo del tipo de web, este método de dinamismo se puede aprovechar para cualquier uso: foros, comunidad de usuarios, descargas, perfiles, comentarios, votos, libros de visita, compra de productos, católogo de productos, encuestas, etc.
Webs dinámicas vs. estáticas
La ventaja principal de las web dinámicas frente a las estatáticas es que con las dinámicas, las secciones y posibilidades son casi infinitas. En una web dinámica podremos tener foros, encuestas, comunidad de usuarios, etc. algo imposible en una web estática. Además, las webs dinámicas 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 gestión de contenidos profesionales. Éstos permiten crear un sitio web completamente dinámico casi sin conocimientos de HTML ni de programación web. Permiten añadirles módulos de foros, galerías de imágenes y demás, todos ellos ya desarrollados y gratuitos.
El inconveniente principal de los sitios web dinámicos frente a los estáticos es que el desarrollo de este tipo de Web dinámicas es muchísimo más complicado que el de una web estática. Para desarrollar una web dinámica se requieren conocimientos de programación (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 dinámicas suelen ser más lentas en su carga que las webs estáticas, pues requieren de acceso a base de datos y de compilación 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 dinámica
En primer lugar deberemos disponer de un servidor de hosting (alojamiento web) que permita usar base de datos MySQL y que permita y soporte PHP. Pues los datos de las secciones dinámicas de la web se guardarán en la base de datos MySQL que crearemos a tal efecto y con el lenguaje de programación web PHP accederemos a estos datos para mostrarlos en la web.
Además de este requisito, para el software externo que usará el usuario propieratio del sitio web para actualizar las secciones dinámicas, el servidor de hosting debe permitir el acceso externo (desde fuera del servidor MySQL) a la base de datos MySQL.
Lógicamente, necesitaremos un servicio de FTP con usuario y contraseña para poder subir los ficheros html, php, css, png y jpg que compondrán 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 artículo:
Se necesitarán conocimientos mínimos de HTML, PHP, Delphi y base de datos MySQL, no han de ser conocimientos avanzados, pues explicaremos y pondremos a disposición de nuestros usuarios el código fuente completo del sitio web dinámico de ejemplo usado en este artículo, así como el código fuente completo de la aplicación AjpdSoft Gestor de contenidos Web. También publicaremos el script SQL de creación de las tablas de la base de datos. Por lo que sólo se requerirán conocimientos mínimos para modificar algunos ficheros png y jpg (para cambiar los logotipos) y un poco de PHP para modificar los ficheros PHP y cambiar algunos pequeños detalles para personalizarlos.
Decisión de las secciones dinámicas de la web, cómo crearlas, estructura de la base de datos
¿Qué son las secciones dinámicas de una web? ¿Cuáles desarrollar como dinámicas?
Las secciones dinámicas serán aquellas cuyo contenido pueda ser actualizado externamente por el usuario, sin necesidad de tener conocimientos de HTML ni de PHP. Con esta utilidad que explicaremos en este artículo, cualquier usuario podrá actualizar el contenido de las secciones dinámicas 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 dinámicas de la web. Aunque lo habitual suele ser desarrollar una sección de "administración" dentro de la propia web, con PHP, desde la que el usuario, iniciando sesión con sus credenciales, podría actualizar el contenido de la web. Pero, presisamente por ser lo típico, nosotros optaremos por realizar este proceso mediante un software desarrollado con Delphi, con una serie de ventajas respecto a una página web.
En primer lugar deberemos establecer qué secciones de nuestra web serán dinámicas (actualizables automáticamente mediante software). En este artículo crearemos las siguientes secciones dinámicas de ejemplo: Productos (con foto, categorías y ficha técnica), Destacados (sección que aparecerá en la portada o página principal de la web) y Noticias (que aparecerán 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 diseño 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 sección de descargas un ejemplo de cada fichero PHP de la web.
Creación de las tablas MySQL necesarias para las secciones del sitio web dinámico
Dependiendo de las secciones que consideremos dinámicas 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 continuación mostramos el script SQL para crear las tablas necesarias para guardar los datos de estas secciones dinámicas:
Además, necesitaremos las siguientes tablas para el correcto funcionamiento de nuestra página web dinámica:
Necesitaremos una tabla para guardar las referencias a las imágenes, pues cada registro de cada sección anterior puede tener su imagen (idimagen). Estas imágenes podrán ser subidas al servidor FTP mediante la aplicación AjpdSoft Gestor de contenidos Web, el script para crear esta tabla:
Utilizaremos otra tabla para guardar los parámetros de configuración de la aplicación, para que el usuario pueda modificar el número de noticias a motrar, la ruta en el FTP de las imágenes 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 artículo, incluimos una sección "Descargas" que requerirá de la tabla descargas:
Puesto que la sección descargas requiere de usuario y contraseña, también utilizaremos la tabla "usuario" y "cliente" para guardar los usuarios que podrán acceder a la sección descargas y a qué cliente de nuestra empresa pertenece cada usuario:
Cómo crear la página principal de nuestro sitio web dinámico
En nuestro caso, la página principal mostrará una imagen o banner de encabezado, dos imágenes debajo de ésta, en la parte izquierda las noticias (sección dinámica) y en la parte derecha los destacados (sección dinámica). La página inicial de nuestra web de ejemplo quedará de esta forma:
En esta página principal (fichero index.php) deberemos crear el diseño HTML (lógicamente) y para las secciones dinámicas de Noticias y Destacados deberemos añadir el código PHP necesario para acceder a la base de datos MySQL y mostrar los datos dados de alta por el usuario y activados con la aplicación AjpdSoft Gestor de contenidos Web.
Para el caso de las Noticias, incrustaremos el código PHP siguinte en la parte de HTML donde queramos que aparezcan del fichero index.php:
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, añadiremos el siguiente código PHP:
1. Hemos dejado un poco de código HTML al principio y al final para que se vea cómo se incrusta el código PHP en el HTML.
2. En el código PHP hay varias funciones: conectarbd, valorparametro y obtenerimagen que hemos ubicado en otro fichero PHP, llamado config.php (de ahí la línea de código require('config.php'), con el siguiente código:
//para conectar con la bd MySQL
function conectarbd ()
{
$servidor = "localhost";
$usuariobd = "usuariobdajpdsoft";
$contrasena = "contraseñausuariobdajpdsoft";
$nombrebd = "nombrebdajpdsoft";
$enlace = mysql_connect($servidor, $usuariobd, $contrasena);
if (!$enlace)
{
die();
}
@mysql_select_db($nombrebd, $enlace)
or die ();
}
//para obtener el valor de un parámetro
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 sección dinámica y el fichero PHP para los artículos (productos)
Para el caso de la sección Productos, cuando el usuario pulsa en el enlace del menú de la página principal index.php "Productos", lo emplazaremos al fichero "productos.php", que en primer lugar mostrará el encabezado típico HTML de nuestro sitio web con el diseño deseado, el menú, las noticias en la parte izquierda (como hemos explicado aquí) y las categorías de los productos de nuestro sitio web dinámico. Quedará de la siguiente forma:
1. Si no se ha pulsado en una categoría (si se ha accedido a los productos) mostrará las categorías:
Si se ha pulsado una categoría, pasaremos como parámetro por la URL el ID de la categoría, por lo que mostrará los productos de esta categoría:
Utilizaremos el fichero productos.php, como siempre, con su correspondiente encabezado HTML con el diseño de la página. En la parte en que queramos que aparezcan las categorías de los productos (si no se ha pulsado en una categoría) o los productos de la categoría seleccionada (si se ha pulsado en el enlace de una categoría) añadiremos el siguiente código PHP incrustado en el HTML:
cellspacing="0" bgcolor="#FFFFFF"> //si se ha pulsado en una categoría 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 " "; echo ""; } } else {?>
A continuación podrá visualizar un listado de nuestros productos agrupados por categorías.
Categorías
$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 " - " . $titulo . " "; } echo"
"; echo "
"; } mysql_close($enlace); ?>
Ventana de detalle (ficha técnica) del producto
A continuación mostramos el código fuente PHP para mostrar el detalle del productos (artículo) cuando el usuario pulsa "Más info", dicho código quedará en el fichero detalle.php:
session_start();
?>
Detalles del producto
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"];
?>
style="width:99%; height:99%; background-color:#FFFFFF;">
//mostramos el precio si ha iniciado sesión if (! empty($_SESSION["nombre_usuario"])) { if (! empty($precio)) { echo "Precio estimado: " . $precio . " euros "; } } if ($descripcion != "") { echo "" . "Ficha técnica del producto: "; echo "
". $descripcion."
"; } ?>
echo "
";
}
}
mysql_close($enlace);
?>
Nota sobre el código: como se puede observar, usamos las sesiones de PHP para establecer si debemos mostrar el precio del producto o artículo en función de si es un usuario registrado (que ha iniciado sesión) o no. En el siguiente artículo explicamos el uso de las sesiones de PHP para este cometido:
Otras secciones de nuestro sitio web con una parte dinámica
De la misma forma que hemos explicado para las secciones anteriores, si en alguna otra sección queremos mostrar las noticias (siguiendo el diseño establecido), como por ejemplo en la sección "Empresa", utilizaremos el mismo código 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 añadir más secciones dinámicas sólo tendremos que añadir la tabla correspondiente en MySQL y el fichero PHP con el código para mostrar estos datos.
En la siguiente URL podremos descargar de forma gratuita un sitio web dinámico de ejemplo con el código PHP, HTML, script de creación de las tablas y aplicación de gestor de contenidos:
La aplicación AjpdSoft Gestor de contenidos Web en Delphi para modificar contenidos
Detalles técnicos y funcionamiento de AjpdSoft Gestor de contenidos Web
Lo explicado anteriormente servirá para mostrar la página web dinámica al usuario que la visite. Dicho código HTML y PHP mostrará las secciones fijas (HTML) y las secciones dinámicas (HTML y PHP). Para el caso de las secciones dinámicas, el código PHP mostrará los datos que el usuario administrador haya decidido. A continuación explicamos cómo hemos desarrollado la aplicación AjpdSoft Gestor de Contenidos Webpara permitir al usuario administrador introducir datos para las secciones dinámicas.
AjpdSoft Gestor de Contenidos Web ha sido desarrollada en Delphi, como ya hemos comentado la administración de la web también podría haberse realizado en PHP (solicitando usuario y contraseña), pero hemos optado por una aplicación de escritorio porque ofrece más posibilidades y es más sencilla de desarrollar (subir ficheros al FTP, control de errores, petición de datos al usuario, etc.).
Para aquellos usuarios desarrolladores que quieran realizar alguna modificación en el código fuente de la aplicación 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.
Descarga y configuración inicial de la aplicación AjpdSoft Gestor de contenidos Web
Si eres usuario registrado (puedes hacerlo desde aquí gratuitamente), puedes descargar la aplicación AjpdSoft Gestor de Contenidos Web, el código fuente en Delphi 6 así como el sitio web dinámico completo de este ejemplo desde:
Código fuente en Delphi 6 de la aplicación AjpdSoft Gestor de contenidos Web.
Ficheros PHP, css, jpg y png del sitio web dinámico completo de ejemplo.
Script SQL de creación de las tablas para la base de datos del sitio web dinámico.
Una vez realizada la descarga, si ya disponemos del hosting y hemos creado las tablas de la web dinámica como explicamos aquí, podremos configurar la aplicación AjpdSoft Gestor de Contenidos Web para acceder y gestionar los contenidos dinámicos. Ejecutaremos el fichero adminweb.exe (sólo necesita la librería libmysql41.dll que incluimos en la descarga, el resto de ficheros pertenece al código fuente y puede ser eliminado, si no se quieren realizar cambios en la aplicación).
En el primer acceso a la aplicación AjpdSoft Gestor de Contenidos Web, puesto que aún no hemos configurado los datos de acceso a la base de datos y al servidor FTP, nos mostrará la pestaña "Configuración". 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".
Contraseña: contraseña del usuario de la base de datos, en el ejemplo "123456".
Nombre BD: nombre del catálogo o base de datos dado de alta en el hosting, como explicamos aquí, en el ejemplo "bddinamica".
Protocolo: versión 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 librería. En la descarga de este artículo incluimos la librería 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 opción cada vez que ejecutemos el fichero adminweb.exe se conectará directamente al servidor MySQL con los datos guardados.
En "FTP:
URL: dirección del servidor ftp, en nuestro caso "ftp.ajpdsoft.com".
Usuario: nombre del usuario FTP con permisos de acceso a las carpetas del sitio web.
Contraseña: contraseña del usuario FTP anterior.
Una vez introducidos los datos de acceso, pulsaremos en "Guardar configuración" y en "Conectar":
Si todo es correcto, al pulsar en "Conectar" nos mostrará en la parte inferior los parámetros de configuración de la aplicación que previamente insertamos ejecutando el script SQL (como indicamos aquí). Deberemos cambiar el valor de estos parámetros para adaptarlo a nuestras necesidades:
Una vez configurada la aplicación AjpdSoft Gestor de Contenidos Web podremos usarla para personalizar los contenidos de nuestro sitio web dinámico. Por ejemplo, desde la pestaña "Noticias", pulsando en el botón "+" e introduciendo los datos correspondientes y pulsando en Validar (como indicamos en este vídeo):
Cómo preparar un hosting para instalar nuestro sitio web dinámico
Requisitos del hosting para instalar una web dinámica
Para que nuestra web dinámica funcione, como ya hemos comentado, necesitaremos un hosting con soporte de base de datos MySQL (u otra como PostgreSQL), 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 aplicación AjpdSoft Gestor de Contenidos Web). Lógicamente también necesitaremos espacio web, con unas 100MB será suficiente, aunque esto dependerá de la cantidad de productos, descargas e imágenes que queramos publicar en el sitio web.
Preparación de la base de datos MySQL y las tablas para el sitio web dinámico
Una vez contratado un hosting con estas características, accederemos al panel de control del hosting para crear la base de datos y las tablas de nuestro sitio web dinámico. En este ejemplo usamos el hosting de la empresa española Dinahosting (aunque para el resto de hosting el proceso es similar). Accederemos al panel de control y buscaremos la opción de base de datos MySQL (o la elegida):
Crearemos una nueva base de datos (Creación 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 contraseña para este usuario (en nuestro caso "123456"). Anotaremos estos datos que luego necesitaremos para la aplicación 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 vía web que suelen tener todos los hosting:
Desde phpMyAdmin pulsaremos en "Ventana de consulta":
Pulsaremos en el enlace "Importar archivos", a continuación pulsaremos en "Examinar":
Buscaremos la carpeta "Script SQL creación tablas" de la descarga de AjpdSoft Gestor de Contenidos Web (disponible en esta web) donde está el fichero sql con el script de creación de las tablas necesarias para el sitio web dinámico:
A continuación pulsaremos en "Continuar" para ejecutar el contenido del fichero "Script SQL Creación tablas.sql":
Si todo es correcto en phpMyAdmin aparecerán 10 tablas: articulo, cliente, configuración (con 6 registros), descarga, destacado, imagen, noticia, seccion, sesion y usuario. Todas estas tablas serán usadas, como ya hemos explicado en este artículo, por nuestro sitio web dinámico:
Preparación de los ficheros de nuestro sitio web dinámico (logos, imágenes, diseño, etc.)
Por supuesto, antes de subir los ficheros que compondrán nuestro sitio web al servidor FTP para hacerlos públicos a los usuarios que visiten nuestra web, deberemos modificar y cambiar el diseño de los ficheros PHP, estilos css, imágenes 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 diseño deseado, principalmente los ficheros que componen el banner del encabezado (img/cabecera.png), y la página principal (img/cabecera02.png y img/inicio.jpg). También la imagen de la sección "Empresa": img/empresa01.png, así como el mapa de localización 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 dinámico AjpdSoft" y otros datos particulares por los de la empresa en cuestión.
Y, además, 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:
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 diseño 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 contraseña 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.
Contraseña: contraseña 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 continuación pulsaremos el botón del gestor de sitios y seleccionaremos el sitio FTP creado anteriormente:
Si todo es correcto realizará la conexión 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 dinámico de ejemplo de este artículo. Lo normal es subir los ficheros al raíz 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 dinámica (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 raíz de nuestro sitio FTP (normalmente www). Seleccionaremos todos los ficheros de la parte izquierda que queramos subir, pulsaremos con el botón derecho del ratón sobre ellos y seleccionaremos la opción 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 visualización de nuestro sitio web dinámico, desde cualquier navegador web escribiremos la URL de nuestro sitio web, en nuestro caso:
. " border='0' align='left' width='67' height='15'>
echo "$referencia "; ?> 
