Jul 23
Si bien pueden diferir un poco los nombres de los botones dependiendo del theme del cPanel y del lenguaje, este ejemplo esta hecho con la versión X3 y lenguaje español.
Los pasos son similares.
1) Entramos en el cPanel desde www.tudominio.com/cpanel
2) Dentro del grupo de funciones Bases de Datos hacemos click en MySQL Bases de Datos.
3) En el cuadro Nueva Base de Datos ingresamos el nombre, por ejemplo “MiBase“. Al presionar en Crear Base nos indicará el nombre de la base que será formado por el usuario de acceso al cpanel y el nombre dado por nosotros. Por ejemplo “usuario_MiBase”
4) Luego de regresar vamos a la seccion MySQL usuarios y creamos el usuario undicando nombre por ejemplo “userDB“y password. Al igual que en la base de datos el usuario será el nombre será el formado por el usuario de cPanel y el que ingresaron. Ejemplo: “usuario_userDB“. La contraseña no se modifica, es la misma que se ingreso en la pantalla anterior.
5) Al regresar vamos a la sección añadir Usuario a Base de Datos y allí seleccionamos el usuario y la base creados anteriormente y presionamos Añadir. Una vez en esta ventana hay que seleccionar todos los privilegios que tendra ese usuario en esa base de datos. Recomiendo seleccionar todos, salvo que estemos seguros de los requerimientos de la aplicación en la cual usaremos esa base de datos.
6) Ya esta terminado. Ahora tenemos los datos necesarios para utilizar una base de datos MySQL. Para la coneccion ademas deberán tener el nombre del servidor, que generalmente es localhost.
En este tutorial veremos como agregar a nuestras galería de fotos un buen efecto para hacerlas dinamicas, rápidas y atractivas para nuestros usuarios sin tener que recurrir a alguna aplicación flash.
Primero debemos descagar la aplicación completa de huddletogether.com y descomprimir el archivo en la raiz de nuestro sitio web.
Una vez que tenemos todos los archivos en su lugar debemos agregar en el head de nuestro html los JS y CSS que son necesarios para hacer funcionar Lightbox2.
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
Y ahora solo debemos agregar desde cada imagen miniatura un link a la imagen grande segun el siguiente codigo.
<a rel="lightbox" href="images/image-1.jpg">image #1</a>
Si queremos agregar una descripción para cada foto, lo podemos hacer seguen el siguiente ejemplo
<a title="descripcion" rel="lightbox" href="images/image-1.jpg">image #1</a>
Si lo que tenemos es una serie de imágenes que forman parte de un mismo grupo se le puede agregar un código a cada una para que desde una imagen podamos tener los botones SIGUIENTE y PROXIMO.
<a rel="lightbox[grupo]" href="images/image-1.jpg">image #1</a>
<a rel="lightbox[grupo]" href="images/image-2.jpg">image #2</a>
<a rel="lightbox[grupo]" href="images/image-3.jpg">image #3</a>
Los textos para cerrar, próximo, anterior, etc. son imágenes y están en inglés. Desde aca pueden descargar las imágenes traducidas al español. Solo deben descomprimir el archivo dentro de la carpeta IMAGES de la aplicación, reemplazando las originales.
Ver ejemplo de Lightbox2
Descargar Lightbox2
Descargar traducción a español de Lightbox2