Comunidad de diseño web y desarrollo en internet online

Galería de imágenes en PHP y MySQL, desde cero

Citar            
MensajeEscrito el 01 Oct 2007 04:28 am
Les cuento que hace poco empecé con PHP y mi primer proyecto fue una galería de imágenes (creo que es el primer proyecto de todos los que empiezan con PHP jeje).
Navegué por la red buscando info de acá y de allá, y finalmente termine la galería, y ha llegado el momento de compartirla con quienes recién empiezan en el mundo de PHP, para que no tengan que andar dando vueltas por la red de un lado para otro sin encontrar lo que buscan.
Bueno, empecemos. Quiero aclarar que esta galería la estoy haciendo con Bases de Datos MySQL, y que cualquiera que la haga tiene que tener instalado un servidor en su máquina como Apache.


Primera parte: Creación de las bases de datos



Lo primero que tenemos que hacer es crear nuestras bases de datos MySQL. Para esto la mejor forma es entrando desde el PHPMyAdmin (Generalmente http://localhost/phpmyadmin), les va a pedir que ingresen el usuario y la contraseña, yo uso root, pero si alguien tiene miedo de mandarse alguna "cagada", puede crear algún otro usuario, que tenga permisos de edición solamente en la base de datos que vamos a utilizar.

Bueno, una vez que entramos al PHPMyAdmin, lo primero que hacemos es crear una base de datos con un nombre, en este caso se va a llamar galería.

El siguiente paso es crear las tablas que contienen la información de las imágenes, categorías, etc.
para esto nos fijamos en donde dice Crear nueva tabla en la base de datos galería, y creamos nuestra primer tabla que se va a llamar imágenes, y le decimos que va a contener 5 campos. Damos aceptar y nos va a aparecer un formulario con filas y columnas en donde debemos introducir los campos que va a contener nuestra tabla, y vamos a poner lo siguiente:
En la primera fila donde dice campo vamos a escribir id (siempre respetando mayúsculas/minúsculas, y sin espacios ni acentos), en tipo vamos a elegir INT (para indicarle que los valores de ese campo van a ser un valor entero), en longitud/valores vamos a poner la cantidad de cifras que va a llevar el id yo le puse 5, pero si alguien tiene pensado postear millones de imágenes le recomiendo que le ponga un poco mas como 10 o 20, luego de esto vamos donde dice extra y le ponemos el valor auto_increment, para que vaya aumentando solo a medida que se va creando registros, y hacemos click en el icono que tiene una llavecita amarilla para indicarle que es la "primary key".
el resto de los campos van a ser así:

Código :

CAMPO           |    TIPO   |  LONGITUD
nombre      -       VARCHAR    -   50
descripcion     -    TEXT
fecha        -       VARCHAR    -   30
imagen     -       LONGBLOB

Y cuando terminen le dan click al botón Grabar que está en la parte inferior (más adelante le voy a ir agregando categorías y subcategorías. Primero empecemos con lo simple.

Bueno, aca ya tenemos la tabla que va a contener las imágenes que iremos subiendo con PHP.

El siguiente paso es crear el archivo que va a subir las imágenes.

Segunda Parte: crear los archivos



El primer archivo que crearemos lo llamaremos conectar.php. Este archivo lo único que hará es conectarse con la base de datos, para poder ver, modificar, crear, o eliminar registros:

el archivo sera algo como esto:

Código :

<?php 
$server='localhost';
$user='root';
$pass=' "[i]aca va la contraseña que ustedes le hayan puesto sin las comillas[/i]" ';
$db='galeria';
$link = mysql_connect($server,$user,$pass);
mysql_select_db($db,$link);
?>


este archivo lo usaremos en todo el resto de los archivos que creemos de aquí en adelante, cada vez que necesitemos conectarnos a la base de datos.

El siguiente archivo que vamos a crear es el que va a subir las imágenes a la base de datos, y este es un poco mas complejo, lo vamos a llamar agregar.php.
Empezaremos creando el formulario HTML:

Código :

<form action="agregar.php" method="post" enctype="multipart/form-data" name="form1">
 Nombre:<input type="text" name="nombre"> <br>
  Descripcion: <input type="text" name="descripcion">  <br>
  Imagen: <input type="file" name="imagen"><br>
    <input type="submit" name="Submit" value="Enviar">
</form>


lo que vamos a hacer ahora es el código PHP que va a ir en el mismo archivo en el que creamos el formularios, entonces vamos a crear una instrucción if que va a verificar si se a apretado el botón enviar en el formulario

Código :

<?
if ($_POST['Submit']){

}
?>


Ahora lo que tenemos que hacer es poner el código que va a subir la información a las base de datos, dentro de la instrucción if(lo hacemos dentro de la instrucción if para que solamente se ejecute cuando pulsamos el botón Enviar)

Dentro de la instrucción if lo primero que hacemos es incluir el archivo conectar.php con la siguiente instrucción:

Código :

include('conectar.php');

Ahora que ya estamos conectados con la base de datos vamos a declarar algunas variables:

Código :

$img_name=$_FILES['imagen']['name'];

Con esto le decimos que guarde el nombre de la imagen en la variable $img_name...

Para que funcione, tienen que crear una carpeta dentro de la misma carpeta de la galería que es en donde se van a guardar la imágenes, en este caso la vamos a llamar "fotos", para no confundirnos con la base de datos.


Continuará...

Por UliK

15 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 22 Oct 2007 08:04 pm
Cuándo sigue este tutorial? ... lo sigo atentamente
muy bueno!

Por loadiX

5 de clabLevel



 

msie7
Citar            
MensajeEscrito el 23 Oct 2007 04:33 pm
se te agradece esto me servira mucho... estaremos pendientes de la segunda parte..!

Por jripper

228 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 23 Oct 2007 05:28 pm
ahora estoy sin tiempo, pero en cuando pueda voy a poner la segunda parte...

Por UliK

15 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Nov 2007 04:06 pm
Hola esta super chéver el tema y en verdad me interesa por favor puedes ser que pongas ya una segunda parte de tu tema... si xfa me ayudarás un montón

gracias :wink:

Por nelisita

0 de clabLevel



Genero:Femenino  

firefox
Citar            
MensajeEscrito el 01 Dic 2007 02:23 pm
Necesitaria algo así. Espero que puedas continuar pronto

Por lineagrafica

189 de clabLevel

1 tutorial

Genero:Masculino  

Diseño, Desarrollador, Marketing

firefox
Citar            
MensajeEscrito el 02 Dic 2007 06:24 pm
Muy bueno, estaría bueno que pongas el resultado final osea los Archivos en un .rar/.zip

Gracias

Por iaN-

15 de clabLevel



Genero:Masculino  

Argentina

firefox
Citar            
MensajeEscrito el 21 Ene 2008 09:58 pm
y al fin cuando sera la segunda parte..?

Por jripper

228 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 30 Abr 2009 07:56 am
NO SE VALE QUE PONGAS UN TUTORIAL A MEDIAS CUANDO PONES LA SEGUNDA PARTE
GRACIAS
O CUAL ES TU MAIL PARA QUE ME PASES LA SEGUNDA PARTE
PARA QUE PUEDA FUNCIONAR

Por GOLIATH25

6 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 11 Sep 2009 03:44 am
ey bro muy explicado realmente promete este tutorial. la verdad yo me encuentro en la fase incial que describes, buscando por aqui por alla para poder aprender php, en fin. Por favor, motivate con la segunda parte.

Por Bufa

0 de clabLevel



 

firefox
Citar            
MensajeEscrito el 22 Feb 2010 03:36 pm
Lastima, seria mejor guardara el path :/

Por vinnie

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 22 Oct 2010 11:21 am
eh.. cuando pones la segunga parte men, de tu tutorial..
yo estube aciendo una galeria en php y msql..
utilizando js+css
pero a la hora de llamar desde php a los campos de la tabla galeria.. no me sale.. exactamente..
ya que los campos... q se deberian mostrar en la galeria.. son titulo, detalle, fecha, imagen
pero como mi galeria es con paginacion.. pues no se como hacerlo... alguna ayuda..

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

msie8

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.