Crear sitio web con PHP y MySQL paso a paso capitulo 1Buenosdasamigos de la comunidad Tupale, hoy he decidido crear un tutorial muy sencillo que explique una forma eficiente decrear sitios web con el lenguaje deprogramacinPHP y el sistema de bases de datos MySQLpero empezando desde cero, veremos paso a paso como utilizar las herramientas y crear las secciones de una manerasencillapara que una vez termines con el tutorial puedas salir a crear sitios webdinmicosde una manera eficiente y sencilla.Lo primero que tendremos que hacer sera empaparnos un poco del tema, y de eso se trata este capitulo, conocer que es unsitio webdinmico,esttico, saber que es php, que es una base de datos, etc, y aunque muchosdirnque es contenido superfluo considero que si vamos a hacer un tutorial o curso para todo el mundo debemos partir por lo masbsicopara asegurarnos que todos los que toman este tutorialestnen un mismo nivel o similar de conocimiento.

proceso de sitio estticos y dinmicosCual es la diferencia entre un sitio webestticoy unodinmico?Es muy sencillo, los sitios webestticosson aquellos que no cambian ni manejaninformacincon respecto al usuario o al administrador, siempre que los visitas son exactamente iguales y sunicafuncines mostrar unainformacinque no se va a actualizar, por otra parte, los sitiosdinmicosson aquellos que tomaninformacindel usuarios o de otra fuente para generar cambios en el funcionamiento y contenido del sitio. Por ejemplo el sitio web de tupale es un ejemplo de un sitiodinmico, ya que los post o noticias o contenidos son agregados dinamicamente a travez de un panel de administracion echo en PHP que guarda lainformacinen una base de datos MYSQL (si muchos diran que es un simple wordpress pero solo intento dar una idea), ademas de ellos los usuarios pueden agregar contenido a travez de los comentarios y realizar un registro.Una de las principales diferencias entre los sitiosestticosydinmicoses el lenguaje deprogramacincon los queestnechos, ya que para lograr el dinamismo del que hablamos se necesita que el lenguaje en el que se trabaja pueda procesar datos. Voy a intentar explicarlo mejor:Los sitios enHTMLplano son sitios estaticos pues HTML por si solo no puede procesar informacion del usuario o del servidor o de alguna otra aplicacion, HTML es un lenguaje que simplemente sirve para crear documentos y mostrarlos en el navegador, pero es muy importante saber HTML ademas no es muy complicado.HTML es un lenguaje que se interpreta en cliente, quiere decir que simplemente es traducido por tu navegador o browser.Los sitios webdinmicospor lo general echos en PHP ofrecen lainteractividaddeinformacinde la que estamos hablando, donde el sitio puede leerinformacinde diferentes fuentes y transformarlas en eventos. Ojo PHP no es una alternativa a HTML, ya que PHP no es un lenguaje de marcas sino de scripting, quiere decir que lo que haces con PHP no se visualiza sino que se interpreta, y el resultado no es un documento sino un comportamiento, unafuncino un evento que produce algo con lainformacinque se le suministra, pero no te asustes aun con tantostecnicismossolo es unaexplicacinmas adelante explicaremos mejor todo esto.PHP es un lenguaje activo en servidor, quiere decir que se procesa en el servidor deInternet en el que alojas tus archivosy no necesariamenteenvadatos al cliente(navegador o browser).Que es una base de datos MySQL?MySQL por otra parte no es un lenguaje deprogramacinsino un gestor de bases de datos, sufuncines simplemente guardarinformacinde una manera organizada y con una estructura que facilite el acceso a dichainformacin, por ejemplo un sitio como este tiene una base de datos con varias tablas, una de ellas seria por ejemplo contenidos y dentro de la tabla de contenidostendramoscampos con lainformacinde los contenidos (ej. titulo, fecha, autor, etc), de manera que todos los contenidos los puedo almacenar en una tabla y poder utilizarlos en el momento que sea necesario. Para que te sea mas claro imaginate una tabla de MySQL como una hoja de excel, donde los campos son las columnas (vertical) y los registros son las filas (horizontal).

Tabla MySQLComo pueden ver en el ejemplo hay una columna para cada dato y una fila para cada registro, en este ejemplo se ve una tabla llamada usuarios donde tenemos listados los usuarios de un sitio web con su nombre de usuario, password, correoelectrnicoy nivel de acceso ademas de otros datos.Noten que cada registro (fila) tiene un idusuario este es un identificador, nos sirve para diferenciar un usuario de otro asi que si decido ver la informacion del usuario 8 tendre el nombre Luis Henao, correo lhenaou@sofasa.com.co yassucesivamente.MySQL no funciona solo, debe ser llamado por un lenguaje activo en servidor (en este caso PHP) para poder trabajar.MasinformacinsobreHTML,PHPyMYSQLQue es un servidor web?Un servidor web o servidor de hosting es una maquina que alojara los archivos de tus sitios web, cuando tecleas Google.com o cualquier otradireccinestas viendo los archivos almacenados en un servidor web, algunas herramientas indispensables para el desarrollo de sitios web como PHP y MySQL solo funcionan en servidores web. De ay la exprecion de lenguaje activo en cliente o en servidor, depende de donde se ejecuta el codigo (ej. Javascript es un lenguaje activo en cliente pero PHP es un lenguaje activo en servidor).Que software necesito para crear sitio webestticosydinmicos?Bueno esta parte es muy importante ya que los programas queaqumencionamos son fundamentales para continuar tomando el curso tecreacinde sitios webdinmicoscon PHP y MySQL. Aunque existen muchas alternativas a los programas queaquvoy a mencionar, recomiendo que usenespecficamenteestos ya que el resto del curso hablara de estas herramientas en especial. Adobe Creative Suite mejor conocida como Adobe CS3, Adobe CS4 o Adobe CS5.Aunque finalmente este tutorial o curso se basara solamente en dosherramientasbsicasdel Adobe Creative Suite: Adobe Dream Weaver y Adobe Fireworks.Descargar Adobe CS4 Master Collection XAMPPXampp es una herramienta que crea un servidor local en tu equipo ya que elcdigoPHP solo puede ser ejecutado en servidor, esto lo hacemos para poder probar los sitios que hagamos de manera local antes de subirlos aInternet. (Incluye: APACHE, PHP, MySQL, PHPmyAdmin).Descargar Xampp server NicoFTP3Este es un simple cliente de FTP que utilizaremos cuando vallamos a publicar nuestro sitio enInternet, es muyfcilde usar y defcilconfiguracin.Descargar NicoFTP3Creo que ya tienes suficiente tarea que hacer, lee sobre servidores web, sobre hosting, sobre HTML y PHP, instala el software del que hablamos y pasa al siguiente capitulo.Crear sitio web con PHP y MySQL paso a paso capitulo 2Antes de comenzar este nuevo capitulo del curso tengo que dar gracias por laacogidaque tubo el capitulo 1,recibmuchos comentarios y correos sobre el post que hacen valer el trabajo de sentarmeaqua darles el conocimiento que tengo.Esperando que ya hallan estudiado un poco sobre los temas del capitulo 1 (Crear sitio web con PHP y MySQL paso a paso capitulo 1) vamos a entrar en materia, y aunque se queestnanimados para empezar a programar sus sitios con PHP y MySQL este capitulo lo dedicare a explicar una cosa que me hubiera sido muytilcuando empece en esto. Laplanificacindel sitio web. Ya que considero que el 80% del tiempo de un desarrollo y lamayorade inconvenientes y errores que se presentan se deben a una malaplanificacindel proyecto.Marcolgicootericodel proyectoPrimero abarquemos el marcotericolgico, que es simplemente analizar el tipo de sitio que vamos a desarrollar, el objetivo, quien es nuestro publico, que pretendemos hacer con el, etc. Pero como este es un curso paso a paso, no me limitare a decirlo sino quepondrun ejemplo con un proyecto real en el cual ahora me encuentro trabajando.Mi proyecto es un sitio web sobre el Visual Rock 2010 (Festival Colombiano de rock), de manera que buscare hacer uso de la multi-media, audio yvdeosya que hay quepromocionarbandas, entonces quiero las siguientes secciones de contenido: Seccindevdeosy cadavdeotendrla siguienteinformacin: Nombre delvdeo,descripcindelvdeo, artista, archivo devdeo, genero, imagen miniatura, fecha depublicacin ypuntuacin. Seccinde Fotos y cada fototendr: Nombre de la foto, archivo de imagen, miniatura, fecha depublicacinypuntuacin. Seccinde noticias y cada noticiatendr: Titulo de la noticia, contenido de la noticia, imagen de la noticia, fecha depublicacin ypuntuacin. Seccinde eventos y cada eventotendr: Nombre del evento, fecha derealizacin, lugar del evento,descripcindel evento ypuntuacin.No se si lo han notado pero este simple procesoautomticamentenos dice cual es la estructura de la base de datos, que mas adelante explicare como crear.La importancia de este proceso radica en saber por anticipado todo lo que vamos a necesitar y hacer cada modulo pensando en el siguiente. Imaginemos que creamos el sitio y a la mitad del desarrollodecidimosagregar una imagen miniatura en losvdeos, si no lo planeamos conanticipacinpodragenerar varios problemas.Ahora sobre el comportamiento del usuario en el sitio y los servicios que estedeberaofrecerle.Es un sitio joven y pretende mantener informado al publicoasque los enganchare con un sistema de registro de usuarios, y comoestarnregistrados me proporcionaran sus datos para crear un sistema queenviunboletnpublicitario constantemente.Por el mismo punto anterior se que lamayorausa redes socialesasque agregare herramientas para compartir los contenidos (Noticias, fotos,vdeos yeventos) atravsde las principales redes sociales.Maquetabsica(borrador)Tambinconsidero muy importante esta parte, y es igualmente importante que se haga en una hoja de papel y preferiblemente conlpizen lugar debolgrafo.Aques dondedefinirncomoestarorganizado el sitio y como van a distribuir los bloques dentro de la pagina. La importancia de hacerlo alpiz radica en que cuando hacemos la parte creativadetrsde un ordenador nos sometemos a las herramientas que nos brinda y no exploramos mas posibilidades, en pocas palabras terminamos haciendo lo que el ordenador nos entrega y no lo que nosotros queremos (Cranmea mi me pasa todo el tiempo).

Maqueta basicaDes esta manera podemos hacernos una idea clara de como va a estar construido nuestro proyecto y nuestra labor sera mas sencilla, ya no volveremos a preocuparnos pordecisionesde objetos o sobre el que colocar y que no, y nos dedicaremos solamente a conseguir el sitio tal cual lo ideamos en laplanificacin.Recoleccinde contenidoOjo, en lamayorade los sitios debes considerar la diagramacin del sitio a partir del contenido, por ejemplo en mi caso, ya que mi sitio sera demsicay bandas de rock, necesito losvdeosy debo crear el planobsicodel sitio web basado en esa necesidad, ademas de determinar la cantidad de material a mostrar para definir como se organizara.Si tu sitio va a tener un solovdeo, puedes incluirlo en alguna parte del diseo o si va a tener solo algunos (5 o 10vdeos) puedes crear un bloque en eldiseodonde los listes, pero si esperas tener muchosvdeosprobablementetendrsque idear una estructura con buscador yseparacinporcategorasoalgntipo de filtro para que los usuarios puedan accederfcilmentea cualquiervdeo.Por lo tanto recuerda el diseo del sitio web o la maquetabsicadebe trabajar enfuncindel contenido del sitio.Mira a tu competencia, directa oplatnica.Una de las maneras mas sencillas de ver que seria lo mas util para nuestro proyecto es ver la competencia o los sitios que manejan el mismo tema o la misma corriente, para mi caso personal (Visual Rock) miro muy bien sitios comohttp://www.rockalparque.gov.co/ohttp://www.bogotaciudadrock.com/cmsbcr/y aqui veo que es lo que mas leconvienea mi sitio web.Los buenos artistas copian, los grandes artistas roban. Pablo R. PicassoTambinconsultagalerasde sitios web donde puede copiar muy buenas ideas para tu proyecto, como botones, estructuras, diseos, herramientas, modos denavegacin, etc. Mi recomendado para esto eshttp://www.cssmania.com/pero existen muchas alternativas.Y eso fue todo por hoy, aunque algunos les parezca que este curso va mas lento que una carrera de caracolesparalticos, pues esa es la idea, paso a paso, analizar cada aspecto posible del desarrollo del sitio de una manera masticable para cualquier usuario. Hasta laprxima.Crear sitio web con PHP y MySQL paso a paso capitulo 3Bienvenidos a una entrega mas del tutorial que seconvirtien curso Crear sitio web con PHP y MySQL paso a paso capitulo 3 y de nuevo debo comenzar dando las gracias, ya que el capitulo 2tambintubo una granaceptacin.Para los que no conocen loscaptulosanteriores de este cursoaqulos dejo. Crear sitio web con PHP y MYSQL paso a paso capitulo 1 Crear sitio web con PHP y MySQL paso a paso capitulo 2Espero que esta nueva entrega sea de su agrado y que coloquen mucho empeo pues comenzaremos con el desarrollo del sitio, masespecficamentecon lainstalacinde las herramientas que vamos a utilizar y lacreacindel sitio de trabajo en dreamweaver.Bueno pues como ya dije lo primero que debemos hacer es instalar un par de herramientas con las que espero yaestsfamiliarizado aunque si no lo estas no hay problema iremos viendo parte por parte como usarlas aunque no las estudiaremos a profundidad solo nos fijaremos en lo que necesitamos para crear el sitio conPHP y MySQL.Software que necesitaremos para comenzar: Adobe Dreamweaver:Esta es una de las herramientas mas importantes, de echo considero que es la fundamental para realizar nuestro proyecto.Sera el software con el cual creemos los documentos HTML y PHP que necesitaremos para nuestro sitio. Aaunque existen muchas soluciones diferentes para lacreacinde sitios (frontpage, quanta, notepad, etc) esta sin duda es la mas popular del mercado y la que ofrece la mayor capacidad y posibilidades, ademas se adapta de manera perfecta para el proyecto que vamos a desarrollar a lo largo de este curso. Actualmente Adobe Dreamweaver se encuentra en laversinCS5 pero para poder trabajar en un nivel mas sencillo usaremos laversinCS3 entonces solo deben pulular un poco enInternetyhacersecon una copia de Adobe Dreamweaver CS3. Adobe Fireworks:Este es un software de manejo deimgenesy aunque me imagino que haz escuchado hablar mucho de Photoshop es mejor usar Fireworks ya que este ultimo esta enfocado completamente en la web, en crear archivos de dimensiones ycaractersticasideales para visualizar en un navegador web (browser). Igual que con el anterior, usaremos laversinCS3 para tener un mejor juego de compatibilidad con Dreamweaver, aunque laversinCS4 incluye una serie de efectos muy interesantes, pero eso en este momento no es muy importante. Servidor XAMPP:Como yasabrnpor el capitulo 1, para tener nuestro sitio enInternetes necesario contar con un servidor de hosting o alojamiento web para tener nuestro sitio en linea ytambinsabrnque PHP es unatecnologaque solo funciona en servidor. Sin embargo mientras desarrollamos nuestro sitio seria muy engorroso estar subiendo los archivos a un servidor deInternetpara hacer pruebas,asque usaremos XAMPP para instalarsimultneamenteen nuestro pc un servidor local llamado localhost quetendrservicio apache, bases de datos MySQL, lenguaje activo PHP y otras herramientas como FTP que en este momento no son importantes.Xampp es un software gratuito que puedes descargar e instalar sin problemas,aqute dejo el enlace paradescargarlo.Instalar Xampp:Antes de empezar a trabajar deberemos tener el xampp activo y con los servicios corriendo, aunque solo necesitaremos el servicio de apache y el servicio de MySQL, esto lo hacemos dando click en el icono de xampp que nos abrira una ventana en la cual presionaremos start en estos dos servicios (Apache y MySQL), luego podremos ver que que el servicio a quedado funcionando notando que el servicio aparece con la palabra Runing (Corriendo) en verde (tal como esta en la imagen de abajo) y porque podremos acceder al sitio http://localhost que es nuestro servidor local.La primera vez que accedas a http://localhost veras una pagina de bienvenida del xampp, este es un sitio que viene por defecto con lainstalacin, personalmente prefiero borrarlo para tener mi carpeta de trabajo libre de archivos que no seanmos, pero Como hago esto?, bueno primero debes saber que todos los archivos que guardes en estaubicacinC:/xampp/htdocs son los quepodrsacceder por protocolo http en http:// localhost por lo tanto solo tienes que entrar en la carpeta C:/xampp/htdocs y eliminar todos los archivos y carpetas que encuentresaqudentro, luego cuando entres de nuevo a localhost te debe salir un aviso que dice Index Of Localhost y si colocas archivos en esta carpeta (htdocs) al ingresar a tu localhost (http://localhost) veras los archivos que hallas colocado en la carpeta, pero comodecaantes, los veras atravsdel protocolo http deInternetpor lo tanto si subes una imagen laabrirscon el navegador y si subes un archivo digamos .rar veras que alaccedersera como descargarlo deInternet.Importante: http://localhost es unaubicacinsolo accesible desde tu maquina, para que otras personas puedan acceder a tu localhost tendrian que copiar tu ip publica ytendrasque tener configurado tu router para permitir conexiones por puerto 80, pero eso es algo que no necesitaremos durante el cursoasque si deseas aprenderlo pues usa Google.

Xampp crear sitio web con php mysql 1Bien manos a la obra, lo primero que tenemos que hacer una vez instalados todos los programas que mencione anteriormente es crear el sitio de trabajo, de manera que abriremos Dreamweaver.1. Ve a la ventana de sitio en elmensuperior y selecciona nuevo sitio.

Dreamweaver crear sitio php y mysql 12. En el cuadro de dialogo que te aparece deberas definir dos cosas, primero el nombre del sitio, que puede ser el que tu quieras, en mi caso es Visual Rock y el segundo campo que es la url del sitio, aqui debes colocar siempre localhost/nombre de tu sitio, tal como aparece en la imagen.

Dreamweaver crear sitio php y mysql 23. En la siguiente ventana nos preguntara si deseamos trabajar con alguna tecnologia de servidor, en este caso diremos que si y seleccionaremos PHP y MySQL.

Dreamweaver crear sitio php y mysql 34. En la siguiente ventana nos preguntara como deseamos trabajar los archivos durante la etapa de desarrollo, aqui seleccionaremos la ultimaopciny buscaremos la carpeta C:/xampp/htdocs en la cual crearemos una carpeta para nuestro proyecto, esta carpeta debe tener el mismo nombre que especifiquemos en la url, por ejemplo, si mi url es http://localhost/visualrock la carpeta debe llamarse visualrock, te recomiendo no usar espacios ni caracteres extraos en el nombre de la carpeta, para evitar problemas con el desarrollo.

Dreamweaver crear sitio php y mysql 45. Al dar siguiente iremos a la ventana deconfirmacinde archivos, donde deberemos ingresar la URL de nuevo, pero es muy importante que la coloques con un / al final, luego pulsas el boton Comprobar URL y debe aparecerte una ventana que dice La prueba del prefijo URL ha sido correcta en caso de que aparezca un error deberar verificar los pasos anteriores en busca del problema.

Dreamweaver crear sitio php y mysql 56. Por ultimo la ventana del final nos confirmara lainformacinque hemos ingresado, recomiendo que revisen los datos una ultima vez para evitar problemas con rutas en un futuro.

Dreamweaver crear sitio php y mysql 67. Una vez que hallamos pulsado elbotncompletar podremos abrir el panel de archivos (Mensuperior ventana >> Archivos)) y ver que nuestro sitio ya esta creado, como aparece en la imagen acontinuacin.

Dreamweaver crear sitio php y mysql 7Bien es todo durante este capitulo del curso, en laprximaentrega estructuraremos la base de datos y crearemos el esquemabsicode funcionamiento del sitio.Crear sitio web con PHP y MySQL paso a paso capitulo 4Bienvenidos a la 4 entrega del tutorial que se convirtio en curso Crear sitio web con PHP y MySQL paso a paso. Como es costumbre comenzare agradeciendo a las personas que siguen el curso ydisculpndomepor la demora en lapublicacinde este nuevo capitulo del mismo.Tambincomo es normal les dejo los anteriorescaptulospara aquellos usuarios que no los han visto.1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 3Ahora si entremos en materia, este capitulo lo dedicaremos a estructurar la base de datos, y aunque suena muytcnicorealmente es algo que no necesita muchos conocimientos, sin embargo serequerirde muchalgicay sentidocomn. De la correctaconstruccinde nuestra base de datosdependeren gran parte el tiempo que tardemos desarrollando el sitio.Lo primero que debemos hacer (teniendo en cuenta que ya tenemos instalado Xampp y todo el software del que hable en el capitulo anterior) es abrir nuestro PHPMyAdmin, que es el gestor de bases de datos, es simplemente una interfaz que nos permite manipular las bases de datos de nuestro servidor. Para acceder a nuestro PHPMyAdmin solo debemos ir al sitio http://localhost/phpmyadmin y nos debe aparecer una pagina muy similar a esta.

Estructurar base de datos mysqlBueno entonces lo primero que vamos a hacer es crear nuestra base de datos en el campo del centro.Es importante tener mucho cuidado con laortografaen estos casos ya que un fallo en una letra puede significar el fallo total de nuestro sistema,tambinte recomiendo que uses solo caracteresalfabticos(letras a-z) enminsculay si necesitas separar palabras usa guiones bajos _, porfavor no utilices espacios en blanco o acentos, tildes, ees ocualquierotrocarcterextrao.En mi caso mi base de datos se llama visualrock, y ahora procedemos a crear las tablas, pero primer unaexplicacindetrminosimportantes sobre bases de datos: Base de datos: es un conjunto de tablas, como el sitio donde almacenaras toda lainformacinde un sitio o proyecto. Tablas: Es como una hoja de excel, con filas y columnas. Campos: Son las columnas en las tablas y seran las variables donde se almacenan los datos. Registros: Son las filas, cadainsercindeinformacinen la base de datos. Datos: Esta es lainformacinque finalmente guardas y que manipulas en el sitio, cada dato se almacena en el cruce de un campo (columna) con un registro (fila).

Estructurar base de datos mysqlBueno, ahora si procederemos a crear nuestras tablas basados en lo que hicimos encaptulospasados de idear el contenido del sitio y suorganizacin.Comenzare con la tabla de administradores, ya quetendrvarios usuarios con niveles de administrador para que puedan agregar contenido al sitio.Asque creo una nueva tabla en mi base de datos llamada administradores y en numero de campos colocaremos la cantidad de campos que usaremos, pero un momento como se cuantos campos voy a necesitar?. Primero antes de crear cada tabla haz un esquema conlpizy papel para saber la cantidad exacta de campos que vas a utilizar y el tipo de campos que deben ser.Los campos almacenan informacion dependiendo del tipo de campo que sean (NO TODOS LOS CAMPOS SON IGUALES) hay varios valores pero aqui te nombrare los mas importantes. INT: Quiere decir entero y solo almacenanmerosenteros. Se usa para almacenar edades, valores, cantidades, todo lo que dependa solo denmeros, como un contador de visitas por ejemplo, solo almacenar un numero. VARCHAR: Este almacena cadenas de texto demximo256 caracteres. Ideal para almacenar nombres de usuario, o contraseas, o comentarios, palabras o frases, nada que requiera mas de 256 caracteres. TEXT: Es igual que varchar pero para textos grandes, es decir almacena cualquier tipo de texto con un limite muy amplio,aqupor ejemplo sealmacenarael contenido de las noticias oartculosde tu sitio quepodrantener muchas paginas de texto. DATE: Almacena fechas con un formato especial de fecha AAAA-MM-DD DATETIME: Almacena datos con fecha y hora, similar al anterior pero agrega la hora: AAAA-MM-DD hh:mm:ssExisten otras tipos de campos pero no profundizare en ellos porque los que acabo de nombrar son todos los que usaremos dentro del curso.Entonces dibujemos el esquema de nuestra primera tabla para saber cuando campos debe tener:Tabla: administradoresidadministrador (INT, PRIMARY, AI)usuario (VARCHAR, 255)password (VARCHAR, 255)nivel (INT)Esta echo!, son solo 4 campos pero ahora explicare cada uno de ellos: idadministrador: Es un campo deidentificacin, todas las tablas deben tener un id que identifica cada registro, recomiendo que este campo lo definas igual en todas las tablas de tu base de datos.Es un campo INT (entero) solo recibe numero, y en la parte de propiedades le asigne el valor PRIMARY (Primario) que me indica que el campo es el identificador de los registros y por ultimo AI (auto incrementar) lo quehares que cada vez que agreguemos un registro le asignara un valor consecutivo. Los campos INT no requieren que se defina el largo de caracteres. usuario: Este sera el nombre del usuario y es un campo VARCHAR (cadena de texto), a estos campos varchar si debemosdefinirel largo de caracteres por lo que tiene asignado 255 (no coloco 256 porque el cero tambien cuenta comocarcter). password: Este campo es igual al anterior. nivel: pensando en quehabrdiferentes niveles de acceso al panel deadministracincoloque este campo,tambincomo INT (Entero), de manera que si un administrador tiene nivel digamos 1tendrun mayor o menor acceso que un administrador con nivel 2.

Estructurar bases de datos mysqlEsto generara un codigo SQL como asi:`idadministrador`INTNOTNULLAUTO_INCREMENTPRIMARYKEY,`usuario`VARCHAR(255)NOTNULL,`password`VARCHAR(255)NOTNULL,`nivel`INTNOTNULLNo se preocupen por este codigo, es solo la parte trasera de lo que esta sucediendo en mysql, solo es importante si quieren aprender SQL a fondo pero lo iremos estudiando paso a paso.

Estructurar base de datos mysqlListo !!! ya tenemos creada nuestra primera tabla, esta es nuestra primera hoja de excel para administrarinformacin, en elmensuperior de la tabla encontraras algunas herramientas como: Examinar:Aqupuedes navegar entre los registros que has insertado, al principio no te dejara acceder pues aun no hayningnregistro en la base de datos. Estructura: Te mostrara los campos de la tabla con sus propiedades, desde esta pestaapodrshacer cambios en la estructura, pero entre menos cambios tengas que hacer mejor. SQL: es para ejecutar el lenguaje deprogramacin de bases de datosSQL. Insertar: desdeaqupuedes insertar algunos registros en tu base de datos,tilcomo para que hagas pruebas ya que la base de datos la manejaremos dinamicamente desde nuestro sitio web una vez terminado.Ahora repite el proceso con lasdemstablas siguiendo los pasos anteriores,aqute dejare un ejemplo de las tablas que tiene mi sitio para que veas como se puede hacer.

tabla mysql estructura

tabla mysql estructuraEso es todo por este capitulo, en elprximocapitulo empezaremos con el montaje en fireworks del diseo y como pasarlo a dreamweaver. Por ahora los dejo con algunas recomendaciones finales. Recuerda siempre agregar el campo de ID (identificacin) en cada tabla con valor entero, primario y auto incrementar, si olvidaste hacerlo con alguna tabla es mejor borrar la tabla y crearla de nuevo. Usar siempre caracteresalfabticos(a-z) enminsculay sin espacios. Asignar el tipo de campo dependiendo de lainformacinque vas a agregar en el, si es un numero debe ser INT, si es fecha que NO sea varchar, etc.He habilitado el foro para que puedan hacer las preguntas que quieran con respecto a este curso.http://tupale.org/foro/tutoriales/

Crear sitio web con PHP y MySQL paso a paso capitulo 5Buendaamigos de Tupale, comenzamosaquotro capitulo mas de curso para Crear sitios web con PHP y MySQL paso a paso y como es habitual debo comenzar agradeciendo a todos los que retwitearon y compartieron el capitulo anterior en redes sociales, ademas de dar un especial agradecimiento a los usuarios que dejaron sus comentarios atravsdel sitio.Y como es costumbre tambien aqui les dejo los enlaces a los otros capitulos del curso:1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 34. Crear sitio web con PHP y MySQL paso a paso capitulo 4Este capitulo lo dedicaremos a la parte del diseo, la cualtambinva a ser paso a paso y en la que enseare algunas costumbre que nopondrnmuy felices a los diseadores pero todo en pro de ser eficiente y lograr un producto web de alta calidad en poco tiempo. Si eres diseador hardcore y solo te interesa este curso por la parte de PHP y MySQL puedes saltarte este capitulo, el cual solo va orientado a disear la plantilla.Bueno para comenzar debo remontarme a otro capitulo de este curso donde publique la maqueta que esta acontinuaciny lesdecaque es muy importante disear primero en papel el sitio que queremos tener, aunque nunca va a llegar igual a la pantalla pero es bueno hacerse a la idea de que se quiere.

Maqueta basicaUna vez que tenemos esto dibujado en papel abrimos nuestro Fireworks y comenzamos a trabajar. Si nunca en tu vida has usado Fireworks, pues no croe que haya un buen curso de como hacerlo, es mas bien un juego deexperimentacin. debes jugar mucho con las herramientas y aprender a utilizarlas, no es muy dificil, algunos dicen que Fireworks es como un power point con esteroides.Bueno ahora comencemos con las malas costumbres de las que yo hablaba que no son muy bien vistas desde el campo del diseo pero de seguro ahorraran mucho trabajo. La primera de ella se basa en una frase de Pablo Piccaso:Los buenos artistas copian, los grandes artistas roban.Es por eso que a la hora de disear siempre acostumbro buscar material interesante para usar algunos elementos,aqules dejo un listado de sitios de donde pueden sacar muy buenas ideas, aunque larecomendacinprincipal es navegar mucho para conocer muchos sitios web con muchos estilos diferentes. CSS Mania Template Monster Web Digiti Ceeces Vecindad GraficaUna formafcilde utilizar estos sitios es con la tecla imprimir pantalla, lo que normalmente hago es buscar un diseo con una arquitectura acorde a la que necesito y luego imprimir pantalla, llevo la imagen a Fireworks y comienzo a trabajar sobre la imagen de pantalla que acabo de sacar.

Como copiar plantillas fireworksEspero que esta imagen ejemplifique mas cual es el proceso para copiar el estilo de un sitio con Fireworks. xDDe echo ahora que lo pienso bien la mayor parte del diseo y desarrollo de sitios consiste en labsquedade herramientas y recursos que nos seantiles. Otro ejemplo de esto son los iconos, que le dan mucha vida a nuestro sitio web, y tambien hay muchos sitios que ofrecen sets de iconos gratis para que uses como este (Free Web icons). es importante mantener la unidadgrficaen los iconos para que la pagina seafcilde navegar, si los iconos no coinciden van a tener muchos problemas denavegacin.De la misma manera pueden hacer con lasfotografas, para ahorrar tiempo y dinero pueden usar bancos deimgenesy buscar el materialnecesariopara su proyecto web, una de las paginas que mas recomiendo esSXCque es un banco deimgenesmuy grande con la ventaja de ser gratuito.Bueno para ayudar a los son novatos en Fireworks (yotambinlo fui)aqules dejo unvdeotutorial que ensea lo masbsicoytil.Aclaracin, estosvdeotutorialestambinhablan de un modo deexportacindeimgenesque no es recomendado, sin embargo pueden utilizarlo, finalmente cada persona termina diseando y exportando pero no recomiendo elmtodoque se emplea en estevdeotutorial, solo los publico para queconozcanmas de Fireworks.Consejos importantes antes de continuar:1. El anchomximode tureade contenido no debe pasar los 1000 pixeles pues asumiremos que el sitio esta echo para usuariosestndarcon pantallas de 1024*768px deresolucin.2. Mantnseparadaslas secciones como el header (cabecera), el sidebar (menu lateral), el body (cuerpo de pagina) y el footer (pie de pagina) para evitar problemas a la hora de pasarlo a Dreamweaver.3. Si eres nuevo en maquetacin de sitio procura usarreascuadradas para ahorrar trabajo y dolores de cabeza en el montaje.4. Trabaja con unaresolucinsuperior a 100 pero inferior a 200asmantendrstus archivos con buena calidad pero con un peso optimo.5. Para exportar lasimgeneste recomiendo hacerlo en PNG 32 o JPG con calidad de 75, es optimo para web.6. Cualquier pregunta que tengas puedes hacerla en elforo de webmasters.Otra formafcilde ahorrar tiempo en este paso del desarrollo del sitio y que es muy buena cuando te interesa mas laprogramacinque la apariencia o no tienes el tiempo para disear un buen template es usar un template gratis. Enfree web templatespuedes encontrar muchos que te pueden interesar, de esta manera solo debes cambiar lasimgenesy retocar algunos detalles para tener lista la apariencia de tu sitio.Ahora pasar el contenido de Fireworks a Dreamweaver.Imaginemos que ya tenemos listo el diseo en Fireworks, como consejo personaltambinrecomiendo que guarden los PNGs de Fireworks en una carpeta para cuando necesiten hacer modificaciones sobre el diseo, pueden hacerlo dentro de la misma carpeta del sitio que ya hemos creado previamente en elcapitulo 3de este curso.

Archivo PNG Visual RockConsejos para hacer masfcillaexportacinde lasimgenes:1. Lasreasque son fondos repetitivos puedesexportarlasen pequeas piezas y desde CSS laspondrsa repetir.2. No exportes los textos, estos debes agregarlos desde dreamweaver.3. Separa muy bien lasimgenesquesernparte del contenido de las quesernparte del diseo, por ejemplo en la plantilla que estoy trabajando el fondo es parte del diseo pero la imagen que dice visual rock 09 es parte del contenidoasque no las combino en una sola imagen.4. Los nombres de los archivos que exportesgurdalos enminsculasy sin espacios o caracteres extraos para evitarte problema con las rutas.Aqui les dejo un ejemplo de todas lasimgenesque componen mi template (visual rock) para que se hagan una idea de como se exportan.Descargar:imagesvisualrockYa que este capitulo se esta tornando demasiado largo cortare aqui por hoy pero prometo que maana publicare una segunda parte explicando el proceso deconstruccinde la pagina en dreamweaver con lasimgenesqueobtuvimosatravsde este capitulo.Crear sitio web con PHP y MySQL paso a paso capitulo 6Bienvenido a la mas demorada entrega del curso Crear sitio web con PHP y MySQL paso a paso, lamento mucho la larga ausencia de mas de una semana pero misobligacionesme impidieron continuar con el curso, sin embargoaquestamos de nuevo con un capitulo mas y como es costumbreaqupublico loscaptulosanteriores para que aquellos que no conocen en curso.1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 34. Crear sitio web con PHP y MySQL paso a paso capitulo 45. Crear sitio web con PHP y MySQL paso a paso capitulo 5Ahora si comencemos con el montaje del sitio en Dreamweaver, para esto primero deberemos estudiar dos cosas fundamentales, primero que es HTML aunque se supone que desde el capitulo 1 ya lohabanestudiado por lo tantoaqusolo lespedirque lo repacen MUCHO, HTML es elcoraznde la web y aunque algunas personaspiensenque no es importante yo considero que es elncleode todo y de ay empezamos a expandir nuestros proyectos web.Como siempre trato de apoyarlosaqules dejo un sencillo PDF que muestra las etiquetasbsicasde HTML solo para que se familiaricen pero es muy importante conocer la mayor cantidad de etiquetas posibles.Listado de etiquetas HTMLTambines muy importante aprender CSS ya que la diferencia entre una web optimizada, agradable,rpido, etc, y una web, lenta, desagradable, desorganizada, etc, esta en el CSS, este lenguaje se usa simplemente para maquetar los sitios y dar apoyo al HTML de manera que puedas delegar el diseo enteramente a CSS y el contenido a formatearlo con HTML.Espero que la siguientegrficaejemplifique mejor lo que quiero decir.

Con CSS y Sin CSSBueno ahora si debemos ir a Dreamweaver para comenzar a maquetar nuestro sitio. lo primero que debemos saber es que hay dos formas de maquetar, la salidafcilusar tablas y las salidaestticade alta calidad aunque un tanto mas complicada usar DIV de CSS, pero para que entendamos las dos lo que voy a hacer es una especie dehbridodonde usare tanto tablas como CSS y varias cosas diferentes para que puedan conocer diferentestcnicasy determinen cual es la que mas les gusta a ustedes.Lo primero que haremos sera crear el primer documento que sera nuestroncleode sistema, nuestro index.php es importante que para este paso ya tengan definido el sitio en Dreamweaver y configurado con el Xampp como servidor de prueba como se menciona en elcapitulo3luego creamos un nuevo documento del tipo PHP.

Crear documento PHP desde DreamWeaverAhora procederemos a definir la propiedades de la pagina dando clic derecho y luego en laopcinPropiedades de pagina, al rellenar el formulario que nos aparece en este cuadro de dialogo Dreamweaver nos generara un CSS con las propiedadesbsicasde la pagina que podremos ver en la vista decdigoEl codigo CSS se colorea de rosado por defecto.Aqudefiniremos cosasbsicascomo el tamao de la fuente, el tipo de fuente, el color, el color de fondo y la imagen,tambinlasmargenesy otras generalidades.Tambines importante abrir laopcindevnculosen la parte izquierda y definir los colores de los enlaces y el efecto sobre (a:hover).

Definir propiedades de pagina en dreamweaverComenzaremos a diagramar primero con tablas para que se hagan una idea de como es estemtodo, iremos almeninsertar y luego insertaremos Tabla. con lo que nosaparecerun cuadro de dialogo que nosharunas preguntasbsicassobre la tabla que queremos insertar. Es muy importante que antes de insertar la tabla uses lalgicapara definir que tipo de tablas necesitas y con que cantidad de filas y columnas. Como es normal voy a hacer un ejemplo.

Diagramacion con tablas en DreamweaverEn este ejemplomostrcomo debe estar definida la tabla con 4 filas y una columna aunque la ultima fila tiene 4 columnas, para hacer estamodificacinsimplemente nos situamos sobre la fila y vamos al icono de dividir celda en la barra de propiedades.

Insertar tabla DreamweaverSi seleccionamos la tabla, en la parte inferior podremos ver el panel de propiedades de la tabla,aqupodremos definir las propiedades como el ancho en pixeles o porcentajes y laalineacinde la tabla.

Propiedades de la tabla DreamweaverNuestro siguiente paso sera comenzar a agregar los contenidos o bloques de contenido dentro de nuestro diseo inicial en mi caso inserte una imagen total como cabezote (Header)asque solo debo situarme en la primera celda y luego ir a laopcinInsertar >> Imagen. De la misma manera que con las tablas, al seleccionar la imagen que has insertado puedes ver el panel de propiedades donde te recomiendo poner border = 0.Advertencia, no es recomendable de echodeberaser prohibido redimencionar lasimgenesdesde Dreamweaver. Si necesitas cambiar el tamao de alguna imagen abre dicha imagen en Fireworks y exportala con el nuevo tamao.Ahora vamos a situarnos en la siguiente celda que sera la delmendenavegacin, en este caso deberemos utilizar un poco de HTML y CSS muy simple, pero esto lo he publicado en un tutorial aparte para las personas que buscan este contenido independientemente del curso.Crear unmendesplegable en CSS pero sin JavascriptEn la tercera celda coloque un scroll, slide o carrusel deimgenesen jquery, esto es algoascomo un plugin o uncdigoque se encuentrafcilmenteenInternety se loadherimosa nuestra pagina, estatcnicadebes usarla mucho para los widgets omdulosque quieras incluir. De ese carruseltambinhe puesto un ejemplo en un tutorial aparte.Carrusel jQuery compatible con sexy light-boxY de la misma manera que en el capitulo anterior siento que este se esta haciendo demasiado largoasque terminareaqupor hoy prometiendo no tardar tanto para lacontinuacindel curso, sobretodo porque este capitulo queda incompleto ya que no termine de explicar la parte de CSS, sin embargo les recomiendo que estudien muy bien HTML y CSS para el siguiente capitulo.Crear sitio web con PHP y MySQL paso a paso capitulo 7Bienvenidos a una nueva entrega del curso sobre comoCrear sitios web con PHP y MySQL paso a paso. Se que muchos han esperado por largo tiempo esta entrega y me disculpo por ello pero el trabajo no da mucho tiempo para las webs personales.Quiero agradecer especialmente a los usuarios que me han enviado sus mensajes de apoyo y sus opiniones sobre el curso,tambina los que dejan sus comentarios, muchas gracias por el apoyo, pero ahora necesito que apoyen aun mas el sitio recomendando atravsde las redes sociales (twitter y facebook), en la parte superior hay unos botones para cada red, nada cuesta twittear o facebookear este capitulo del curso y siestarnapoyando al creador.Ahora volvamos con los tradicional, el listado de loscaptulosanteriores de este curso:1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 34. Crear sitio web con PHP y MySQL paso a paso capitulo 45. Crear sitio web con PHP y MySQL paso a paso capitulo 56. Crear sitio web con PHP y MySQL paso a paso capitulo 6En el capitulo anteriorestbamosviendo como maquetar un sitio, bueno creo que hay mucho y poco que decir sobre este tema, cada quien tiene una forma de maquetar y siempreexistirla dualidad entre maquetar con tablas o con divs CSS, yo personalmente recomiendo hacer unhbridode los dos ya que aunque usar divs mejorara su posicionamiento y un poco el rendimiento de su sitio, usar tablas les ahorrara mucho trabajo y dolores de cabeza acomodando objetos ysernmucho mas eficientes a la hora de trabajar.Ahora quiero ensearles como quedo finalmente el sitio que inspiro este curso Visual Rock 2010. aunque sinceramente termino un poco desordenada debido a una serie de cosas que no se plantearon antes de comenzar el desarrollo.Ahora vamos a comenzar con la parte interesante que es el administrador de contenido y lacreacinde los comportamientosdinmicos, en resumen lo que nospermitiradministrar nuestro sitio web desde un panel de control sin tener que abrir dreamweaver cada vez que queramos hacer un cambio. es aqui donde nace la magia de usar PHP y MySQL.Debido a que este es un curso enfocado solo en lacreacindel sitio, no voy a profundizar en las funciones PHP o en las consultas MySQL solo en las herramientas que nos da Dreamweaver para crear un sitio de este alcance.Entonces manos a la obra, vamos a construir nuestro sistema o panel deadministracin, de manera que crearemos una carpeta nueva dentro de nuestro sitio llamada admin o administrador o como quieran llamarle, en esta carpeta guardaran todos los archivos de su panel deadministracin. Te recomiendo que por anticipado coloques estas cosasbsicasen tu carpeta deadministracin.1. Un set de iconos, te puede ser muy util puedes conseguir varios enhttp://www.freeiconsweb.com/procura tener mucho iconos para cualquieraccinque realices y que tenga una lineagrficasimilar para que se vean bien.2. Un editor Wisyng, es un simple script para colocar editores HTML a tusreasde texto asi cuando vallas a agregar contenido desde tu administrador podras usar, negrillas,prrafosy en fin muchos elementos que facilitaran el trabajo de quien agrega el contenido. Existen dos editores Widyng que yo recomiendo, uno es el CKeditor que es que mas uso en mis proyectos por surobustezy su soporte, aunque debo reconocer que TinyMCE suele ser mucho mas eficientes en muchasocasiones.CKEditor:http://ckeditor.com/demoTinyMCE:http://tinymce.moxiecode.com/examples/full.php3. Scripts que puedas necesitar, que te puedan sertiles,librerasde PHP, aunque no es obligatorio y tal vez no entiendas que son laslibreraspero bueno son pequeos scripts que en determinado momento nos pueden ahorrar trabajo, por ejemplo si voy a enviar muchos correoelectrnicosdesde mi sitiopodrausar lalibrerao clase PHPmailer.Sin embargo no te preocupes mucho por esto, durante el curso voy a publicar loscdigosque utilizo frecuentemente para que te faciliten la vida.4. Extensionesde Dreamweaver para ahorrar trabajo, hay muchasextensionesde Dreamweaver que nos pueden ayudar a la hora de realizarciertosprocesos quepodranser un poco tediosos o complicados. Por ejemplo para paginar registros yo recomiendo elFX Record set, que es una herramienta excelente ademas que sera muy utilizada durante este cursoasquedeberaninstalarla.Bien una vez que estamos preparados comenzaremos creando el sistema de login o sistema de usuarios, de manera que crearemos un archivo llamado login.php y lo colocaremos dentro de nuestra carpeta administrador, en este archivoobviamentedeberemos hacer el formulario de login para acceder al sitio deadministracin.Recuerda usar el panel de propiedades para asignar el nombre al campo dle formulario y procura llamarlo igual que el campo en la base de datos, eso te ahorrara tiempo.tambines buena idea definir el nombre del formulario y generalidades, es muy importante que este formulario seenvimediante POST ytambinrecuerda colocar la propiedad de password al campo de contrasea como aparece en la siguiente imagen.

Propiedades de campos passwordEs simple un formulario con un campo de usuario y uno de contrasea. este formulario enviara los datos queserncomparados con los existentes en la tabla de usuario o administradores en la base de datos. Tabla quecreamos en el capitulo 4 de nuestro curso.

Como crear un login formUna vez creado el formulario vamos a crear el comportamiento de logueo, esaqucuando el PHP entra en juego pero nos vamos a apoyar en Dreamwaver para hacer este proceso mucho mas sencillo. Vamos a ir almenventana y seleccionamos Bases de datos, recuerden que a este punto esimportanteque ya hallan creado el sitio de su proyecto y que actualmente se encuentren trabajando sobre elcomo explicamos en el capitulo 3. Continuemos, una vez abierto el panel de Bases de datos usaremos el icono + para agregar una nueva base de datos a nuestro proyecto.

Ventana Databases DreamweaverDesde el cuadro de dialogo que nos aparece crearemos nuestro archivo deconfiguracin yconexina la base de datos, paracomenzarel nombre de laconexinse la das tu, puede ser el nombre que escojas, recuerda no agregar, caracteres extraos ni espacios. Ya que estamos usando Xampp el servidor sera localhost el usuario sera root y no usara contrasea, esta es unaconfiguracinpor defecto en XAMPP y en lamayorade servicios de host local. Luego de colocar estos datos selecciona la base de datos dandoclicen elbotnSeleccionar, ay teaparecerun listado de las bases de datos que tienes en MySQL, selecciona la de tu proyecto y dale aceptar.

Crear base de datos dreamweaverBien una vez que hayamos echo lo anterior podremos confirmar que laconexinha sido creada porque aparece en nuestro panel de Bases de datos y podemos navegar las tablas y los procesos almacenados desde ay.

Ver base de datos en dreamweaverBien voy a terminar aqu por falta de tiempo y seguir maana con el uso de los juegos de registros y la creacin del sistema de login (usuario y contrasea).Ahora unas aclaraciones importantes: Recuerden que me pueden escribir para hacerme cualquier pregunta sobre el tutorial y yo con gusto lesresponder. Tambinpueden usar los comentarios o elForopara realizar y solucionar sus dudas. En la parte superior del capitulo del curso hay un contador de redes sociales, quemuestracuantas veces se ha compartido esto en facbook, en twitter y otras redes, cuando el contador llegue a 20 voy a publicar el siguiente capitulo, de manera que si quieren otro capitulorpido, compartan esto en us facebook y en su twitter para llegar rapido a los 20 shares.hasta laprximaamigos. xDCrear sitio web con PHP y MySQL paso a paso capitulo 8Saludos a todos los seguidores de este curso y del sitio, gracias por compartir el capitulo anterior en redes sociales atravsde los links que aparecen en la parte superior ese es el apoyo que necesitamos para seguir publicando mas material.Primero hago el recuento de loscaptulosdel curso como es habitual.1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 34. Crear sitio web con PHP y MySQL paso a paso capitulo 45. Crear sitio web con PHP y MySQL paso a paso capitulo 56. Crear sitio web con PHP y MySQL paso a paso capitulo 67. Crear sitio web con PHP y MySQL paso a paso capitulo 6Y ahora entremos en material. Ya que en el capitulo anterior vimos como realizar laconexina la base de datos, este capitulo lo dedicaremos a crear el sistema de login de usuario y a restringir el acceso a las paginas del administrador, para que vean lo sencillo que pueden gestionar usuarios en su sitio usando tan solo las herramientas de Dreamweaver.Ahora seleccionamos nuestro formulario y vamos a la ventana de Comportamientos que esta justo al lado de la ventana de Conexiones, seleccionamos agregar comportamiento y dentro de laopcinAutenticar usuarios utilizaremos laopcinLogin de Usuario.

Logueo de usuario con dreamweaverEn el cuadro de dialogo que nos aparece debemos definir algunas cosas. Primero el formulario y los campos del formulario que se utilizaran. Luego la base de datos, la tabla y los campos con los que el script buscara si lainformacincoincideo no. Luego las paginas deconfirmaciny de error, es decir, si el logueo es correcto a que pagina debe ir, y si el logueo no es correcto a que pagina debe ir. Y por ultimo el nivel derestriccin, ya que en algunos casos necesitaras crear usuarios de diferente nivel de acceso, entonces en este caso seleccionamos usuario, password y nivel de acceso y definimos el campo de laDB (base de datos) que nosdarel nivel de acceso de cada usuario.Al darclicen aceptar Dreamweaver nos creara elcdigoque se veas:

Loguear usuarios con dreamweaver codigoEste comportamiento lo que hace es comprobar si los datos introducidos en el formulario concuerdan con los de un registro en la base de datos, y si esascrea unasesinde usuarioque podremos usar mas adelante para restringir el acceso a las paginas.Bueno ahora crearemos el archivo index.php o portada del administrador de contenidos, y lo primero que debemos hacer es restringir el acceso para que solo los administradores puedan acceder al dicho panel, esto lo haremos con otros comportamiento de Dreamweaver.

Restringir acceso con DreamweaverEstando en la pagina index.php o cualquier pagina que queramos restringir solo para usuarios administradores o registrados vamos a ir al panel de comportamiento y seleccionamos Restringir acceso a pagina, y en el cuadro de dialogo que nos aparece seleccionamos los niveles de usuario permitidos en la pagina y la pagina a la que se debe redirigir si el acceso es denegado.Despues de realizar este proceso es hora de hacer pruebas y testear que su sistema de login este funcionando bien, intenten con usuarios de prueba, generando errores, logeos falsos, etc.Pueden agregar nuevos registros a la tabla de usuarios o administradores desde PHPMyAdmin http://localhost/phpmyadmin solo tienen que seleccionar la base de datos, luego la tabla, luego dar clic en la pestaa insertar y listo.

Insertar registros desde PHPMyAdminBueno ya tiene su sistema de login, ahora deben comenzar a explorar las otras opciones del panel de comportamientos de servidor para poder realizar procedimientos mas complejos de muestreo de datos.nos vemos en laprximaentrega donde les enseare como crear las paginas para agregar, editar y eliminarinformacinde su base de datossegnla tabla oseccin. Recuerden compartir el tutorial para que laprximaentrega sea mas pronta. xDCrear sitio web con PHP y MySQL paso a paso capitulo 9Saludos a todos los que leen este curso, lamento mucho la espera para el nuevo capitulo pero mis obligaciones me han tenido bastante ocupado, ademas de ello me encuentro trabajando en una plataforma deeducacinvirtual para brindar mas y mejores cursos para todos ustedes de manera gratuita y un poco mas profesional, esperemos que en un par de semanas ya tengas lista dicha plataforma.Primero colocare como ya es costumbre el listado decaptulosanteriores para quienesestnleyendo esto por primera vez.1. Crear sitio web con PHP y MySQL paso a paso capitulo 12. Crear sitio web con PHP y MySQL paso a paso capitulo 23. Crear sitio web con PHP y MySQL paso a paso capitulo 34. Crear sitio web con PHP y MySQL paso a paso capitulo 45. Crear sitio web con PHP y MySQL paso a paso capitulo 56. Crear sitio web con PHP y MySQL paso a paso capitulo 67. Crear sitio web con PHP y MySQL paso a paso capitulo 78. Crear sitio web con PHP y MySQL paso a paso capitulo 8Tambincree una pagina dentro del sitio llamadaCURSOSdondeestaractualizando el listado de cursos disponibles dentro del sitio aunque actualmente solo tenemos dos curso y solo uno es creado por nosotros pero trabajaremos para traer mas material, y en el foro esta elpost de este cursopara que sigan las actualizaciones y realicen sus preguntas.Ahora si vamos a entrar en materia, ya que en el capitulo pasado aprendieron a crear sistemas de usuario con PHP y bases de datos (login,restriccinde acceso, usuario y password, nivel de acceso) ahora debemos comenzar a trabajar en nuestro administrador de contenido, elreaque sera solo accesible para el administrador del sitio y desde donde agregaremos todo el contenido como las noticias, las paginas, lasimgenes, etc.Durante este capitulo del curso me centrare solamente en la funcionalidad dejando el aspecto visual y la navegabilidad de lado, el objetivo es que comprendan como funcionan los comportamientos de agregar, editar y eliminar registros para que puedan usarlos a su antojo en cualquier parte del sitio administrador.OK, vamos a comenzar por crear la pagina que va a administrar las noticias de mi sitio, de manera que voy a crear la pagina llamada noticias.php recuerden que este archivo debe estar dentro de la carpeta administradora (admin/) ytambines importante que lo primero que hagan cuando creen la pagina es asignarle el comportamiento de restringir acceso a la pagina para que solo el o los usuarios con nivel de administrador puedan acceder a esta pagina.

Paginas Administrar noticias 1Como pueden ver en la imagen de la izquierda he dividido la pagina en tres secciones que son las que necesitaremos en casi todas las paginas del administrador. Estas tres secciones son: Listado: donde listaremos todos los registros de una tabla determinada en este caso tendremos un listado con todas las noticias que se han agregado, en la parte derecha agregue un par de enlaces que son el de eliminar y el de editar la noticia. Agregar: Sera un simple formulario que agregara lainformacincomo registro a la base de datosaquusaremos algunas herramientas que explicare a lo largo de la creacion del formulario. Editar: Este sera un formulario muysimilaral de agregarexceptoquetendrcargada lainformacinde un registro para editarla ytendrun campo adicional deidentificacinpara poder actualizar o realizar un update de un registro especifico dentro de la tabla en nuestra base de datos.LISTAR NOTICIASMucho cuidado a esto porque en esta parte usaremos losjuegos de registros o recordsetque son una de las herramientas principales a la hora de realizar sitiosdinmicoscon PHP y MySQL. Un juego de registros es simplemente unabsquedaentre todas las filas (registros) de una o mas tablas con algunosparmetrosdefinidos.Por ejemplo si mi tabla noticias dentro de mi base de datos luce algoas:

Tabla noticias mysqlPodremos realizar una consulta como la siguiente:Seleccione todos los campos de la tabla noticias donde lacategoraes igual a 1 y el autor es igual a Kalvin Manson, ademas de ello ordeneme los resultados por fecha de la mas antigua a la mas reciente.Lo anterior seria lalgicade lo que es una consulta o juego de registros, la misma idea anterior en MySQL se traduciria de la siguiente forma:SELECT * FROM noticias WHERE idcategoria = 1 AND autor = Kalvin Manson ORDER BY fecha ASCVen que no es tandifciljejeje, pero tranquilos si les parece complicado usar la linea de comando MySQL no se preocupen porque este curso lo estamos basando en Dreamweaver por lo cual usaremos la herramientas de este programa para crear este tipo de comportamientos y secuencias.Para crear el listado de noticias deberemos crear un juego de registros desde el panel de comportamientos como se muestra en la siguiente imagen.

Crear juego de registros DWEn el cuadro de dialogo que nos aparece vamos a seleccionar nuestraconexincon la base de datos, nuestra tabla (en este caso noticias), seleccionamos todos los campos, en laopcinde filtro dejamos Ninguno y en orden seleccionamos por fecha descendiente. Luego de hacer esto debe aparecernos nuestro juego de registros en nuestro panel de vinculaciones como muestra la siguiente imagen.

Juegos de registros creadoDesde este panel podremos arrastrar los campos hasta nuestro documento para insertarlos en nuestra pagina sin embargo aun no se va a ver un listado ya que lo queobtenemosde esta manera es almacenar todos los resultados de nuestra consulta MySQL en un array llamado $row_noticias, y debemos usar unafuncinWhile para convertirlo en listado, pero de nuevo no se asusten este proceso es mas sencillo de lo que parece.Primero vamos a colocar el titulo de la noticia en la celda de nuestra tabla que esta junto a laopcinde editar eliminar.Tambinpodemos colocar la fecha oalgnotro dato que consideremos importante en el listado. Una vez que tenemos los datos en nuestro documento vamos a seleccionar la fila como aparece en la siguiente imagen y nos dirigimos de nuevo al panel de comportamientos donde usaremos laopcinRepetirregin.

Seleccionar fila de tablaEs importante que en la barra de estado teaparezcade ultimas la etiqueta esto indica que tienes seleccionada la fila entera. comodeca, luego de seleccionar la fila nosdirigimosal panel de comportamientos y seleccionamos repetirreginen donde nosaparecerun cuadro de dialogo igual a este:

Repetir regionEn el primer campo seleccionamos nuestro juego de registro que en este caso es noticias y luego determinamos cuantos registros queremos mostrar. Sencillo verdad? ahora podemos ver nuestro archivo en nuestro localhost y nos debe mostrar el listado de registros que tenemos en nuestra tabla de noticias ordenados por fecha descendente y mostrando unmximode 10 resultados.

Ejemplo listar juegos de registroSi al ver la pagina en localhost no les aparece nada es muy probable que aun no tengan registros en la tabla de noticias de manera que si quieren hacer pruebas hasta ay deben insertar los registros por medio de phpmyadmin, sin embargo vamos a pasar al formulario de agregar registros para que vean como se hace.Agregar noticiasLo primero que debemos hacer es un formulario con los campos necesarios, recomiendo que nombren los campos en el formulario de la misma manera que nombraron los campos en la base de datos, les ahorrara dolores de cabeza mas adelante.