DE LAS OLIMPIADAS GRIEGAS A LAS DEL MUNDO MODERNO.ppt
Como crear blog
1. Unidad 21. Cómo crear un Blog (I)
21.1. Introducción
Hasta ahora hemos visto cómo empezar a manejarnos con páginas dinámicas de acceso a datos utilizando
PHP y un servidor MySQL.
La complejidad de las páginas que creemos dependerá de la profundidad de nuestros conocimientos de
ambas tecnologías, por lo que muchas veces (sobre todo al principio) nos será difícil alcanzar algunos
objetivos que nos propongamos.
Vamos a dedicar este tema a la elaboración de un proyecto complejo en el que deberemos emplear estas
técnicas de un modo más completo.
Para ello crearemos un blog o bitácora y utilizaremos herramientas y procedimientos que hemos visto hasta
ahora. No te pierdas este tema, introduciremos algunos conceptos que quizá te resulten interesantes.
Un blog es una página web donde se introduce contenido periódicamente sobre un tema en particular.
Su contenido suele organizarse en entradas que se van añadiendo con una asiduidad relativa.
Normalmente, estas entradas pueden comentarse. Es decir, cualquier usuario (o a veces solamente los
registrados) pueden dejar su opinión sobre la entrada o sobre el blog en general.
Para facilitar la navegación por la página estas entradas suelen estar organizadas por temas o categorías,
de modo que si te interesa poder leer todas las entradas relacionadas con un tema en concreto te sea
mucho más sencillo.
Todo blog deberá tener, del mismo modo, una parte privada desde donde el usuario dueño de la bitácora
pueda administrar y gestionar los contenidos del blog.
Desde el panel de administración, que debe estar protegido para que sólo tengan acceso aquellas personas
con privilegios suficientes, podremos añadir, modificar o eliminar entradas, comentarios y categorías.
De hecho, la función de esta parte privada es que puedas actualizar el contenido sin necesidad de tener
que recurrir a la interfaz de phpMyAdmin para insertar nuevos registros como vimos en el tema anterior.
El objetivo de este tema no es entrar en profundidad en cada uno de los detalles, porque podríamos no
terminar nunca. Explicaremos el modo en el que deberemos actuar para alcanzar una estructura cerrada
que cumpla los requisitos mínimos que un blog necesita.
El aspecto y funcionalidades finales están en tus manos, puedes añadir tantas cosas como quieras.
Así que vamos a empezar...
21.2. Estructura de datos
Nuestro primer paso para la creación de un blog será crear la estructura de datos que contendrá la
información de las entradas y otros elementos del sitio.
En un sitio simple deberemos crear como mínimo 4 tablas: categorias, entradas, comentarios y usuarios.
• En la tabla categorías deberemos listar el nombre de las categorías en las que se dividen las
entradas.
• En la tabla entradas deberemos almacenar el texto de la entrada con su título y fecha. Obviamente
aquí deberemos hacer referencia a qué categoría pertenece la entrada. En un blog más complejo
podríamos incluso almacenar qué integrante de la tabla de usuarios creó la entrada...
• En la tabla comentarios deberemos almacenar el texto del comentario junto con la información del
autor, como su nombre y correo electrónico, por ejemplo. Con conocimientos más profundos de PHP
podríamos guardar hasta su dirección IP.
• Finalmente en la tabla usuarios guardaremos el nombre y contraseña de los usuarios que tendrán
acceso a la edición del blog. Más adelante verás que incluso se podrían establecer niveles de
privilegios entre ellos.
El punto en cuestión en este caso es el hecho de que en la forma más simplificada las tres primeras tablas
se encuentran relacionadas del siguiente modo:
2. Como puedes ver en la imagen en la tabla entradas existe un campo que apunta al ID de categorías, y del
mismo modo en la tabla comentarios tenemos que tener un campo que apunte a la entrada a la que
pertenece dicho comentario.
El problema nos surge, por ejemplo, cuando insertemos una página que nos ayude a eliminar entradas.
¿Qué hacemos con los comentarios asociados a ella? ¿Deberemos crear una página más para que cuando
se borre una entrada también lo hagan sus comentarios relacionados? ¿Y repetirlo para las categorías y sus
entradas?
No va a hacer falta.
Podremos utilizar una característica de la definición de la base de datos que existe en mySQL (no existía en
las primeras versiones) y en otros sistemas gestores de bases de datos, el borrado y actualización en
cascada.
Para poder utilizar esta característica, debemos de utilizar InnoDB como Motor de almacenamiento. Esta
opción la encontramos al definir los campos de la tabla, y por defecto está seleccionado MyISAM.
Desde el entorno de phpMyAdmin podremos definir esta característica en la vista de relaciones.
Podrás encontrar el enlace a esta vista desde la vista de detalle de cualquier tabla que emplee InnoDB
como motor de almacenamiento:
Haz clic sobre él y verás una nueva ventana como ésta:
3. Desde aquí podremos especificar las relaciones que tiene la tabla con las demás tablas de la base de datos
y qué hacer cuando un elemento relacionado se borra o modifica.
Fíjate que en el ejemplo solamente los campos Id e Id_Categoría son susceptibles de esta opción. Eso es
debido a que hemos definido ambos como índices, el primero por ser clave primaria y el segundo porque así
lo indicamos en el momento de su creación utilizando el botón Índice o seleccionado la opción Index del
desplegable Índice.
El modo en el que deberemos definir nuestro objetivo es el siguiente. A un campo indexado podemos
asignarle una relación con otro campo indexado de otra tabla (en el ejemplo Id_Categoria está relacionado
con el campo Id de la tabla categorias).
Deberemos decirle a phpMyAdmin qué hacer cuando se borre un elemento en la tabla relacionada
categorias (ON DELETE) o cuando se modifique el valor de clave de un elemento (ON UPDATE).
La opción que nos interesa en este caso es CASCADE que actúa aplicando los cambios en cascada. Esto es,
si borramos un elemento en la tabla categorias, se borrarán todos los registros en la tabla entradas que
tengan el mismo ID en el campo Id_Categoria.
En el caso de que modificásemos el ID en la tabla categorias también se actualizaría en todos los registros
de entradas con el mismo Id_Categoria si tenemos indicado ON UPDATE CASCADE.
Piensa que esa tabla podría estar relacionada con otra. Por tanto, al actualizar o borrar esta en cascada,
pasaría lo mismo con la tabla relacionada, y así sucesivamente.
Estructura de datos de un Blog (I)
Objetivo
Practicar las operaciones necesarias para crear la estructura de datos de un blog.
Ejercicio
1. Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2. Si el servicio de MySQL no se está ejecutando, lánzalo para poder tener acceso a las bases de datos.
3. Haz clic izquierdo sobre el icono de WampServer en el área de notificación y selecciona la opción
phpMyAdmin.
4. Se abrirá la ventana principal del programa, escribe bd_blog en el campo de texto de la imagen.
5. Selecciona utf-8_spanish_ci en el desplegable Cotejamiento.
6. Pulsa Crear para crear la base de datos.
7. Pasaremos a un nueva ventana con la estructura de la base de datos, para crear una nueva tabla
escribe Entradas en Nombre y 5 en Campos.
4. 8. Pulsa el botón Continuar para seguir.
9. Ahora vamos a configurar los campos.
Al primer campo lo llamaremos Id, de tipo INT, con índice de tipo PRIMARY y marcando la opción A_I
(auto incremento). Pues será un campo numérico entero, autoincremental (cada vez que se graba un
registro el sistema le asigna un número más que el anterior), y será la clave principal de la tabla
(primario).
10. Al segundo lo llamaremos Titulo, de tipo VARCHAR y con longitud 100.
11. Al tercero lo llamaremos Texto, de tipo LONGTEXT.
12. Al cuarto lo llamaremos Fecha, de tipo DATE.
13. Al último lo llamaremos Id_Categoria, de tipo INT, con longitud 11 con índice de tipo INDEX. Lo
definimos indexado para poder relacionarlo con la tabla Categorias.
14. Por último, cambiamos el Motor de almacenamiento a InnoDB para poder trabajar con relaciones.
15. Haz clic en Grabar para guardar los cambios y la tabla ya estará lista para utilizarse.
16. Repite los mismos pasos para crear una tabla llamada Categorias con 2 campos.
17. Al primero lo llamaremos Id, de tipo INT, con A_I y un índice PRIMARY .
18. Al segundo lo llamaremos Nombre, de tipo VARCHAR y con longitud 15.
19. Emplearemos el Motor de almacenamiento del tipo InnoDB.
20. De nuevo, repite los pasos para crear una tabla llamada Comentarios con 6 campos.
21. Al primero lo llamaremos Id, de tipo INT, con A_I y PRIMARY .
22. Al segundo lo llamaremos Autor, de tipo VARCHAR y con longitud 30.
23. Al tercero lo llamaremos Correo_Autor, de tipo VARCHAR y con longitud 30.
24. Al cuarto lo llamaremos Comentario, de tipo LONGTEXT.
25. Al quinto lo llamaremos Fecha, de tipo DATE.
26. Al último lo llamaremos Id_Entrada, de tipo INT, con longitud 11 e INDEX. Indexado para relacionarlo
con la tabla Entradas.
27. Emplearemos el Motor de almacenamiento del tipo InnoDB.
28. Por último crearemos una tabla llamada Usuarios con 3 campos.
29. Al primero lo llamaremos Id, de tipo INT, con A_I y PRIMARY.
30. Al segundo lo llamaremos Usuario, de tipo VARCHAR y con longitud 20.
31. Al tercero lo llamaremos Password , de tipo VARCHAR y con longitud 20.
32. Emplearemos el Motor de almacenamiento del tipo InnoDB.
33. En el marco de la izquierda haz clic sobre la tabla Comentarios y una vez en su ventana haz clic en
Vista de Relaciones.
34. En Id_Entrada selecciona en el segundo desplegable bd_blog.entradas.Id. Para indicar que en este
campo habrá un id que deberá estar en la tabla Entradas.
35. En el desplegable ON DELETE selecciona CASCADE.
36. Y por último en ON UPDATE seleccionar CASCADE.
37. Pulsa Grabar.
38. En el marco de la izquierda haz clic sobre la tabla Entradas y una vez en su ventana haz clic en Vista
de Relaciones.
39. En Id_Categoria selecciona en el segundo desplegable bd_blog.categorias.Id.
40. En el siguiente desplegable selecciona CASCADE.
41. Para terminar, en el siguiente vuelve a seleccionar CASCADE.
42. Pulsa Grabar.
43. Ahora vamos a rellenar las tablas, importaremos los datos de unos ficheros de texto.
Vuelve a la tabla Categorias seleccionándola en el menú de la izquierda.
44. Haz clic en la opción Importar que encontrarás en el menú horizontal en la parte superior de la
ventana:
5. 45. En la siguiente ventana pulsa el botón Examinar y busca el archivo categorias-latin1.txt que se
encuentra en la carpeta de ejercicios, dentro de la carpeta blog.
46. El archivo se encuentra codificado en latin1 así que selecciónalo en la lista de Juego de caracteres
del archivo.
47. Pulsa el botón Continuar.
48. Asegúrate de que se han introducido datos en la tabla pulsando la opción Examinar de la tabla
Categorias.
49. Repite los mismos pasos con el archivo entradas-latin1.txt para introducir datos en la tabla Entradas.
50. Repite los mismos pasos con el archivo comentarios-latin1.txt para introducir datos en la tabla
Comentarios.
51. Repite los mismos pasos con el archivo usuarios-latin1.txt para introducir datos en la tabla Usuarios.
52. Ahora crearemos un usuario y le asignaremos privilegios para que pueda modificar los datos
almacenados.
Haz clic sobre bd_blog en el marco de la izquierda y haz clic sobre .
53. Haz clic en el vínculo Agregar un nuevo usuario.
54. En la nueva ventana escribe escritor en Nombre de usuario.
55. En Servidor escribe localhost.
56. En Contraseña escribe aulaclic.
57. En Debe volver a escribir escribe aulaclic de nuevo.
58. Pulsa el botón Continuar para crear el usuario.
59. Estamos definiendo los privilegios para la base de datos bd_blog. Observa que están todos
seleccionados. Deselecciónalos para que sólo queden seleccionados SELECT, INSERT, UPDATE y
DELETE. Si te das cuenta están todos en el marco de Datos.
Vamos a darle a este usuario únicamente permiso de escritura y lectura sobre la base de datos.
Los permisos de Administración y Estructura los dejaremos en blanco para que este usuario no
pueda acceder a la parte administrativa ni pueda modificar la estructura de las tablas.
60. Pulsa Continuar para asignarle al usuario estos privilegios y habremos terminado.
21.3. Interfaz pública
Una vez creada la estructura podemos empezar a crear las páginas que mostrarán la información
almacenada en ella.
En este caso, los pasos a seguir serán muy parecidos a los que vimos en el tema anterior.
En principio, la página más importante será el índice. Allí deberemos mostrar un listado de un número
determinado de entradas.
Esto, como ya hemos visto, es muy fácil de conseguir, aunque ahora es posible que necesitemos mostrar
mucha más información.
Veamos un ejemplo de entrada:
6. Como puedes ver, incluimos el título, texto y fecha de la entrada. Eso es muy sencillo porque pertenece
todo a una misma tabla.
Pero deberemos incluir también un recuento de los comentarios asociados a esa entrada y el nombre de la
categoría a la que pertenece.
¿Cómo lograremos esto? Tendremos que utilizar sentencias de SQL avanzadas.
En los ejercicios paso a paso encontrarás la sentencia que te servirá para este ejemplo en particular. Podrás
variarla un poco en función de tus necesidades, pero te volvemos a repetir que si quieres crear juegos de
registros más complejos deberás aprender SQL, llegados a este punto no te será muy complicado.
También será necesaria una página que muestre las entradas filtradas por categoría. Ten en cuenta que
nuestro visitante querrá seguramente ver aquellas entradas pertenecientes a un tema en particular. De
hecho para eso hemos creado el menú de salto desplegable y los enlaces en cada una de las entradas.
Esta página deberá ser prácticamente igual que el índice, por lo que la sentencia SQL será prácticamente la
misma.
Finalmente deberemos incluir una página que muestre los comentarios de cada entrada en particular y que
a su vez permita añadir nuevos.
Esta tarea no es muy complicada porque simplemente deberemos pasarle un parámetro que indique el ID
de la entrada y mostrar los comentarios asociados a ella.
Puedes utilizar el asistente Insertar registros para crear el formulario de entrada de comentarios.
Interfaz Pública (I)
Objetivo
Practicar las operaciones necesarias para crear las páginas de la interfaz pública de un blog.
Ejercicio
1 Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2 Si los servicios de MySQL o Apache no se están ejecutando, lánzalos para poder tener acceso a las bases
de datos y a la ejecución de archivos PHP.
Empezaremos por definir una conexión a la base de datos.
1. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él.
2. Para poder trabajar, necesitas tener un documento dinámico abierto. Así que abre la plantilla
blog.dwt.php.
7. 3. Abre el panel Bases de Datos con la combinación de teclas CTRL + MAYUS + F10 o desde el menú
Ventana → Bases de datos.
4. Haz clic en el botón y selecciona Conexión MySQL para crear una nueva conexión.
5. En Nombre de conexión escribe blog_aulaclic.
6. En Servidor MySQL escribe localhost.
7. En Nombre de usuario escribe escritor.
8. En Contraseña escribe aulaclic.
9. En Base de datos selecciona bd_blog.
10. Pulsa Probar para comprobar que todo es correcto. Si no lo es, revisa los datos introducidos.
11. Pulsa Aceptar para crear la conexión.
Ahora vamos a modificar el menú de salto que introdujimos en temas anteriores en la plantilla para que
se visualicen en él las categorías.
Primero deberemos definir un juego de registros para obtener las categorías.
1. Abre la plantilla blog.dwt.php si no la tenías abierta, ya que vamos a editarla.
2. Haz clic en el botón para crear un nuevo juego de registros.
3. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
categorias_para_menu.
4. En Conexión selecciona blog_aulaclic.
5. En Tabla selecciona categorias.
6. En Ordenar selecciona Nombre y en el desplegable de al lado Ascendente.
7. Haz clic en el botón Aceptar para crear el juego de registros.
8. Ahora hay que modificar el menú de salto.
Selecciónalo y edita su lista de valores, eliminando los valores que pusimos como ejemplo.
9. Con el menú seleccionado, pulsa el botón Dinámico del Inspector de propiedades.
10. En Opciones del juego de registros elige categorias_para_menu.
11. En Valores elige el campo Id.
12. En Etiquetas elige el campo Nombre.
13. Pulsa Aceptar.
14. Cierra la plantilla guardando los cambios.
Interfaz Pública (II)
Crearemos ahora la página index.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantillas).
2. Guárdalo como index.php, dándole el título Bienvenidos al Blog aulaClic.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá haz clic en Avanzado...
5. En Nombre escribe listado_entradas.
6. En Conexión selecciona blog_aulaclic.
7. En SQL deberás pegar la siguiente sentencia SQL:
8. SELECT entradas.Id, entradas.Titulo, entradas.Texto, entradas.Fecha,
9. categorias.Nombre as Nombre_Categoria, categorias.Id AS Id_Categoria,
10. COUNT(comentarios.Id) AS Cuenta_comentarios
11. FROM (entradas LEFT JOIN comentarios ON entradas.Id=comentarios.Id_Entrada)
12. INNER JOIN categorias ON entradas.Id_Categoria=categorias.Id
13. GROUP BY entradas.Id, entradas.Titulo, entradas.Texto, entradas.Fecha,
8. 14. categorias.Nombre, categorias.Id
ORDER BY entradas.Fecha DESC
Con esta sentencia obtenemos un juego de registros con las entradas con el nombre de la categoria
correspondiente y el número de comentarios que tiene la entrada. Las entradas aparecerán
ordenadas por fecha de la más antigua a la más reciente.
15. Haz clic en el botón Aceptar para crear el juego de registros.
16. En la única región editable deberás escribir un párrafo de clase titulo que muestre el elemento Titulo
que habrás arrastrado del panel Vinculaciones.
17. A continuación arrastra el elemento Texto, este no deberá estar dentro de un párrafo.
18. En un nuevo párrafo de clase datos escribe aulaClic - y a continuación añade el elemento Fecha
arrastrándolo desde el panel Vinculaciones.
19. Crea un párrafo de clase datos y en él escribe Categoría:, a continuación arrastra el elemento
Nombre_Categoria.
20. Sobre este elemento crea un vínculo que vaya a categorias.php?id=
21. Añade el elemento Id_Categoria arrastrándolo desde el panel Vinculaciones para que te quede el
enlace de este modo:
categorias.php?id=<?php echo $row_listado_entradas['Id_Categoria']; ?>
22. Finalmente inserta un último párrafo de clase datos que diga Comentarios.
23. A continuación, en el mismo párrafo, arrastra el elemento Cuenta_comentarios.
24. Crea un enlace en el elemento Cuenta_comentarios que vaya a comentarios.php?id=.
25. Añade el elemento Id arrastrándolo desde el panel Vinculaciones para que te quede el enlace de
este modo.
comentarios.php?id=<?php echo $row_listado_entradas['Id']; ?>
26. Selecciona el texto que acabas de insertar y haz que se repita para que muestre 6 registros. Utiliza
la opción Repetir Región. Asegúrate de elegir el juego de registros listado_entradas.
27. Cierra el documento guardando los cambios y pruébalo.
Interfaz Pública (III)
Ahora crearemos la página para las entradas por categoría.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Guárdalo como categorias.php y dale el título Blog aulaClic - Categorías.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá haz clic en Avanzado...
5. En Nombre escribe listado_por_categoria.
6. En Conexión selecciona blog_aulaclic.
7. En SQL deberás pegar la siguiente sentencia SQL:
8. SELECT entradas.Id, entradas.Titulo, entradas.Texto, entradas.Fecha, COUNT(comentarios.Id) AS
Cuenta_Comentarios,
9. categorias.Nombre AS Nombre_Categoria
10. FROM (entradas LEFT JOIN comentarios ON entradas.Id=comentarios.Id_Entrada)
11. INNER JOIN categorias ON entradas.Id_Categoria=categorias.Id
12. WHERE Id_Categoria = colname
13. GROUP BY entradas.id, entradas.Titulo, entradas.Texto, entradas.Fecha, categorias.Nombre
ORDER BY Fecha DESC
14. Pulsa el botón en el siguiente cuadro para añadir un parámetro (variable).
15. En el cuadro de diálogo escribe los siguientes valores:
o Nombre: colname
o Tipo: INT
o Valor predeterminado: -1
9. o Valor en tiempo de ejecución: $_GET['id']
16. Haz clic en el botón Aceptar para crear el juego de registros.
17. En la única región editable deberás escribir un párrafo de clase datos que diga Categoría:
18. A continuación incluye el elemento Nombre_Categoria arrastrándolo desde el panel Vinculaciones y
ponlo en negrita.
19. Seguidamente escribe un párrafo de clase titulo que contenga el elemento Titulo que habrás
arrastrado desde el panel Vinculaciones.
20. A continuación arrastra el elemento Texto, este no deberá estar dentro de un párrafo.
21. En un nuevo párrafo de clase datos escribe aulaClic - y a continuación añade el elemento Fecha
arrastrándolo desde el panel Vinculaciones.
22. Finalmente inserta un último párrafo de clase datos que diga Comentarios.
23. A continuación, en el mismo párrafo, arrastra el elemento Cuenta_comentarios.
24. Crea un enlace en el elemento Cuenta_comentarios que vaya a comentarios.php?id=.
25. Añade el elemento Id arrastrándolo desde el panel Vinculaciones para que te quede el enlace de
este modo.
comentarios.php?id=<?php echo $row_listado_por_categoria['Id']; ?>
26. Selecciona este último bloque (a partir del título) y haz que se repita para que muestre 6 registros.
Utiliza la opción Repetir región. Asegúrate de elegir el juego de registros listado_por_categoria.
27. Coloca el cursor al final del todo e incluye un navegador de registros utilizando la opción Barra de
Navegación de juego de registros .
28. Selecciona la opción Imágenes para que se muestre el navegador con flechas.
29. Guarda los cambios.
Interfaz Pública (IV)
Para terminar crearemos la página para los comentarios.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Dale el título Blog aulaClic - Comentarios y guárdalo como comentarios.php.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá haz clic en Simple...
5. En Nombre escribe listado_comentarios.
6. En Conexión selecciona blog_aulaclic.
7. Vuelve al modo Simple. En Tabla selecciona comentarios.
8. Cambia la opción Filtro para que pueda leerse ID_Entrada = Parámetro URL id.
9. Cambia la opción Ordenar para que pueda leerse Fecha Descendiente.
10. Haz clic en el botón Aceptar para crear el juego de registros.
11. En la única región editable escribe un párrafo que contenga el elemento Autor que habrás arrastrado
desde el panel Vinculaciones y ponlo en negrita.
12. Luego añade el elemento Comentario a continuación, sin contenerlo en un párrafo.
13. A continuación incluye un nuevo párrafo de clase datos que contenga el elemento Fecha.
14. Para terminar inserta una regla horizontal (Insertar → HTML → Regla horizontal), o escribe <hr /> en
el código fuente.
15. Selecciona el bloque que acabamos de añadir y haz que se repita para que muestre todos los
registros de la tabla. Utiliza la opción Repetir región. Asegúrate de tener seleccionado el recordset
listado_comentarios.
16. Selecciona de nuevo el bloque que te ha quedado y haz que sólo se muestre si hay algún registro en
el recordset. Utiliza la opción Mostrar si el juego de registros no está vacío. Asegúrate de tener
seleccionado el recordset listado_comentarios.
17. Seguidamente, tras la repetición, escribe un párrafo que diga Introduce aquí tu comentario:
10. 18. Ahora introduce un formulario de inserción de registros. Haz clic en el botón Asistente de formulario
de inserción de registros .
19. Selecciona la tabla Comentarios.
20. Deberás excluir el campo Id pues se generará automáticamente. Selecciónalo de la lista de campos
y pulsa el botón
21. El campo Comentario se debe mostrar como un área de texto.
22. El campo Fecha será oculto y con un Valor predeterminado de <?php echo date('ymd'); ?>. Esto
generará la fecha actual.
23. El campo Id_Entrada también será oculto y tomará el Valor predeterminado de <?php echo
$_GET['id']; ?>. El parámetro con el ID de la entrada.
24. Pulsa Aceptar y habremos terminado.
25. Cambia la etiqueta del correo a Correo, y cambia el tamaño del área de texto a Ancho car 45 y
Líneas num 10.
26. Cierra el documento guardando los cambios.
21.4. Interfaz privada
Ahora es cuando viene la parte más laboriosa, pero que tampoco es muy complicada.
Deberemos crear la parte de administración del sitio.
Cuando tenemos un blog es mucho más cómodo poder acceder a la información y poder modificarla y
eliminarla a través de una interfaz web.
Resultaría más engorroso tener que entrar cada vez a la base de datos del servidor para insertar una nueva
entrada o modificar las existentes.
Además, crear nosotros mismos las páginas de administración nos da la libertad de crear las opciones que
queramos y de la forma en que nos sea más cómoda.
Así que nuestro primer paso será crear un índice de administración que nos muestre las opciones a las que
podemos acceder:
En nuestro caso hemos decidido crear el menú más sencillo posible, incluye dos grupos: la creación de
nuevos elementos y la modificación (o borrado) de los ya existentes.
Creación de un Menú de Administración
Objetivo
Practicar las operaciones necesarias para crear un menú de administración en un blog.
Ejercicio
1. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él.
11. 2. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
3. Dale el título Blog aulaClic - Administración y guárdalo como admin.php.
4. En la única región editable deberás escribir un párrafo de clase titulo que diga Crear nuevas:
5. Luego escribe un nuevo párrafo que diga Nueva entrada, deberás hacer que este texto tenga un
enlace a nueva_entrada.php.
6. A continuación añade un nuevo párrafo en el que pueda leerse Nueva categoría, este texto deberá
tener un enlace a nueva_categoria.php.
7. Añade un párrafo vacío.
8. Incluye un nuevo párrafo de clase titulo que diga Modificar existentes:
9. Crea un último párrafo que diga Modificar comentarios, este texto debe enlazarse con
listado_comentarios.php.
10. Cierra el documento guardando los cambios.
21.5. Insertar nuevos elementos
Lo más sencillo de realizar será crear las dos páginas que nos ayudarán a crear registros.
Crear un formulario de nueva categoría sólo nos obligaría a insertar un nuevo nombre de categoría para
crear un nuevo registro.
El campo Id de la tabla, al ser autonumérico, no deberá aparecer en el formulario porque se rellenará
automáticamente.
Un poco más complicado será el formulario de creación de entradas.
Veamos un ejemplo:
En principio los campos de entrada serán tal cual los que nos ofrece el asistente Insertar registro.
Deberemos tener cuidado en que el campo Fecha: se envíe como de tipo fecha.
La dificultad la encontraremos en el desplegable Categoría:.
Deberemos cargar un recordset a parte donde sacaremos el listado de categorías con sus Id
correspondientes.
Deberemos editar el campo desplegable de forma que el valor que se guarde sea el valor del Id, mientras
muestra el nombre de la categoría.
nserción de elementos
12. Objetivo
Practicar las operaciones necesarias para crear las páginas de inserción de elementos.
Ejercicio
1. Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2. Si los servicios de MySQL o Apache no se están ejecutando, lánzalos para poder tener acceso a las
bases de datos y a la ejecución de archivos PHP.
3. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él.
Empezaremos por crear la página para introducir nuevas categorías.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Dale el título Blog aulaClic - Nueva categoría y guárdalo como nueva_categoria.php.
3. En la única región editable deberás escribir un párrafo de clase titulo que diga Escribe el nombre de
la nueva categoría:
4. Ahora deberemos introducir un formulario de inserción de registros. Haz clic en el botón Asistente de
formulario de inserción de registros .
5. Deberás crearlo para la tabla Categorías, excluyendo el campo Id quitándolo de la lista de campos,
pues se generará automáticamente. El resto lo dejaremos como está.
6. Cierra el documento guardando los cambios.
Ahora crearemos la página para crear nuevas entradas.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Dale el título Blog aulaClic - Nueva entrada y guárdalo como nueva_entrada.php.
3. Vamos a crear un nuevo juego de registros para mostrar las categorías. Pulsa en el icono del
panel Insertar.
Observarás que ya tenemos un juego de registro con las categorías, el definido en la página
maestra. No podemos emplear este, porque los juegos de registros sólo pueden leerse una vez, por
lo que no podemos llevar varias listas.
4. Llámalo listado_categorias. Selecciona la tabla categorías y ordénalo por el Nombre
ascendentemente. Pulsa Aceptar.
5. En la única región editable escribe un párrafo de clase titulo que diga No hay categorías en la base
de datos.
6. Escribe un segundo párrafo que diga Crea una nueva desde aquí, enlazada la última palabra con el
archivo nueva_categoria.php.
7. Selecciona estos dos párrafos que acabas de introducir y haz que se muestre si no existen registros
de categorías.
Si no hay categorías no podremos asociar la entrada a ninguna de ellas.
Utiliza la opción Mostrar si el juego de registros está vacío, seleccionando el recordset
listado_categorias.
8. Seguidamente escribe un párrafo de clase titulo que diga Introduce los datos de la nueva entrada:
9. Ahora deberemos introducir un formulario de inserción de registros. Haz clic en el botón Asistente de
formulario de inserción de registros .
10. Selecciona la tabla Entradas.
11. Deberás excluir el campo Id pues se generará automáticamente.
12. El campo Texto se deberá mostrar como un área de texto.
13. El campo Fecha deberá enviarse como tipo Fecha.
14. El campo Categoría deberá mostrarse como un menú. Pulsa el botón Propiedades de menú.
15. En las propiedades del menú, en Rellenar elementos de menú elige De base de datos.
16. En juego de registros, elige listado_categorias.
13. 17. En Obtener etiquetas de selecciona Nombre, y en Obtener valores de elige Id.
18. Pulsa Aceptar para cerrar el diálogo.
19. Cambia la etiqueta del menú a sólo Categorías.
Ya casi hemos terminado.
20. Finalmente selecciona la última parte de la página, el segundo párrafo que has escrito y el
formulario y haz que se muestre si existen registros en el recordset de listado_categorias.
Utiliza la opción Mostrar si el recordset no está vacío.
21. Cierra la página guardando los cambios.
21.6. Listado de elementos
Luego deberemos crear las páginas que se ocuparán de modificar los elementos del blog, ya sean
categorías, entradas o comentarios.
Esta parte deberemos planificarla adecuadamente para evitar crear páginas redundantes.
Lo más sencillo es crear una página que muestre un listado de los elementos que se encuentran en la base
de datos con enlaces creados para eliminar o modificar el registro que prefieras:
De esta forma el trabajo se reducirá a crear un listado completo de los registros de las tablas y crear
enlaces pasando como parámetro el ID del registro.
Este enlace irá dirigido a la página con la función de borrar o modificar (según cuál elijas) donde se
recogerá el parámetro de ID que utilizaremos para filtrar el recordset.
Quizás la página más complicada, debido a su extensión, sea la que deba mostrar el listado de comentarios.
Para ella, la forma más práctica sería poder localizar la entrada donde se encuentra el comentario y luego
mostrar el listado completo de los comentarios de esa entrada en concreto.
Puedes crear dos páginas para ello, aunque si lo resumimos en una única, la estructura del sitio se
benificiará al quedar más claro qué hace cada página.
Nota: Puedes incluir campos de búsqueda como hicimos en el ejercicio de Librería del tema anterior.
Bastará con que apliques los mismos procedimientos.
Listado de elementos
Objetivo
Practicar las operaciones necesarias para crear las páginas de listados de elementos.
Ejercicio
1. Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2. Si los servicios de MySQL o Apache no se están ejecutando, lánzalos para poder tener acceso a las
bases de datos y a la ejecución de archivos PHP.
3. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él. Vamos a crear la página que
muestre un listado de comentarios.
14. 4. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
5. Dale el título Blog aulaClic - Listado de comentarios y guárdalo como listado_comentarios.php.
6. En la única región editable deberás escribir un párrafo de clase titulo que diga Selecciona una
entrada:.
7. Crearemos un recordset para cargar los títulos y fechas de las entradas.
Haz clic en el botón para crear un nuevo juego de registros.
8. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
listado_entradas.
9. En Conexión selecciona blog_aulaclic.
10. En Tabla selecciona entradas.
11. En Ordenar selecciona Fecha y en el desplegable de al lado Descendente, para que se muestre la
más reciente.
12. Haz clic en el botón Aceptar para crear el juego de registros.
13. Debajo del párrafo que hemos añadido deberás insertar una tabla con 10 píxeles de relleno de celda
y un ancho del 100%. En esta tabla listaremos las entradas.
La tabla deberá tener 2 filas y 2 columnas, siendo la primera fila un encabezado.
14. A las celdas de la primera fila, aplícales el estilo borde_inferior. Alinea las celdas de la segunda
columna a la derecha.
15. Escribe en la primera celda de la primera fila Título.
16. Escribe en la segunda celda de la primera fila Fecha.
17. En la primera celda de la segunda fila arrastra el elemento Titulo desde el panel Vinculaciones, del
juego listado_entradas.
18. Asígnale un enlace a listado_comentarios.php?id=
19. Empleando la vista código, modifica el vínculo arrastrando el elemento Id del juego listado_entradas
desde el panel Vinculaciones para que se muestre de este modo:
<a href="listado_comentarios.php?id=<?php echo $row_listado_entradas['Id']; ?>">
20. En la segunda celda de la segunda fila inserta el elemento Fecha arrastrándolo desde el panel
Vinculaciones. Ponlo en cursiva empleando un estilo en línea aplicado a la celda.
21. Selecciona la segunda fila de la tabla y haz que se repita para que muestre 6 registros.
22. Utiliza la opción Repetir Región para el juego listado_entradas.
23. Luego coloca el cursor al final del contenido editable e introduce una barra de navegación de
registros para el juego listado_entradas. Utiliza imágenes, y centra la tabla en la página.
24. Ahora añadiremos el listado de comentarios.
Escribe el siguiente párrafo de clase titulo con el texto Selecciona un comentario a modificar o
eliminar.
25. Crearemos un recordset para cargar el autor, correo y fecha del comentario.
Haz clic en el botón para crear un nuevo juego de registros.
26. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
listado_comentarios.
27. En Conexión selecciona blog_aulaclic.
28. En Tabla selecciona Comentarios.
29. En Ordenar selecciona Fecha y en el desplegable de al lado Descendente.
30. Modifica los desplegables de Filtro para que pueda leerse: Id_Entrada = Parámetro URL id.
31. Haz clic en el botón Aceptar para crear el juego de registros.
32. Debajo del párrafo que has añadido inserta una tabla con 10 píxeles de relleno de celda.
15. 33. La tabla deberá tener 2 filas y 5 columnas, con un ancho del 100% y la primera fila de encabezados.
34. Aplica a las celdas de la primera fila el estilo borde_inferior.
35. En la primera celda de la primera fila escribe Autor en negrita.
36. En la segunda celda de la primera fila escribe Correo en negrita.
37. En la tercera celda de la primera fila escribe Fecha en negrita.
38. Arrastra el elemento Autor del juego listado_comentarios a la primera celda de la segunda fila.
39. Arrastra el elemento Correo_Autor del juego listado_comentarios a la segunda celda de la segunda
fila y ponlo en cursiva.
40. Arrastra el elemento Fecha del juego listado_comentarios a la tercera celda de la segunda fila y
ponlo en cursiva.
41. Centra horizontalmente cuarta celda de la segunda fila, e inserta la imagen imagenes/edit.png y
enlázala a modifica_comentario.php?id=. No olvides establecer su atributo Alt como Editar.
42. Arrastra el elemento Id del juego listado_comentarios para que el enlace quede de este modo:
modifica_comentario.php?id=<?php echo $row_listado_comentarios['Id']; ?>
43. En la quinta celda de la segunda fila inserta la imagen imagenes/trash.png y enlázala a
elimina_comentario.php?id=
44. Arrastra el elemento Id para que el enlace quede de este modo:
elimina_comentario.php?id=<?php echo $row_listado_comentarios['Id']; ?>
45. Selecciona la segunda fila de la tabla y haz que se repita para que muestre todos los registros del
recordset.
46. Utiliza la opción Repetir Región, sobre el juego listado_comentarios, seleccionando Todos los
registros.
47. Para terminar, selecciona el primer párrafo y la primera tabla y haz que se muestren si no hay
registros en el recordset de listado_comentarios. Utiliza la opción Mostrar si el juego de registros está
vacío.
Si es la primera vez y al listado_comentarios no le hemos pasado un Id de entrada, o si la entrada no
tiene comentarios lo que hay que hacer es visualizar el listado de entradas (la primera tabla).
Si por el contrario la entrada seleccionada tiene comentarios tenemos que visualizar la segunda
tabla (la que contiene el lista de comentarios):
48. Selecciona el segundo párrafo y la segunda tabla y haz que se muestren si hay registros en el
recordset de listado_comentarios. Utiliza la opción Mostrar si el juego de registros no está vacío.
Hemos creado un listado de entradas que al hacer clic sobre una de ellas envía su ID a la misma
página que genera un listado de los comentarios correspondientes a esa entrada.
49. Para acabar, añade el estilo necesario a la hoja de estilos para que las imágenes con enlace se
muestren sin borde a img {border-style: none;}.
50. Cierra el documento guardando los cambios.
21.7. Modificación de elementos
Las páginas de modificación de elementos deberán recoger el parámetro que envíe el listado.
De este modo, filtraremos el recordset y podremos mostrar la información de la entrada, categoría o
comentario que queramos modificar.
Es aconsejable que muestres el contenido del elemento para que antes de modificarlo tengas una vista
total de él y veas mejor qué quieres hacer en él.
El resto es sencillo, utiliza el asistente Actualizar registro y seguro que no encontrarás muchas más
complicaciones.
De nuevo en el caso de la página de modificación de entrada deberemos tener especial cuidado en enviar
la fecha como tal y de mostrar los nombres de categoría en un desplegable:
16. Modificar elementos
Objetivo
Practicar las operaciones necesarias para crear las páginas de modificación de elementos.
Ejercicio
1. Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2. Si los servicios de MySQL o Apache no se están ejecutando, lánzalos para poder tener acceso a las
bases de datos y a la ejecución de archivos PHP.
3. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él. Vamos a crear una página para
modificar comentarios.
4. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
5. Dale el título Blog aulaClic - Modificar comentarios y guárdalo como modifica_comentario.php.
6. En la única región editable deberás escribir un párrafo de clase titulo que diga Modificando el
comentario:
Crearemos un recordset para cargar el comentario que queremos modificar.
7. Haz clic en el botón para crear un nuevo juego de registros.
8. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_comentario.
9. En Conexión selecciona blog_aulaclic.
10. En Tabla selecciona comentarios.
11. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
12. Haz clic en el botón Aceptar para crear el juego de registros.
13. Ahora visualizaremos el comentario para asegurarnos de que es éste el que queremos modificar.
14. Escribe un párrafo en negrita que muestre el Autor del comentario. Arrastra el elemento desde el
panel Vínculos.
15. Luego inserta el elemento Comentario.
16. Añade un nuevo párrafo de clase datos y colócale la Fecha del comentario.
17. Finalmente inserta una regla horizontal (Insertar → HTML → Regla Horizotal).
18. Pulsa el botón Asistente de formulario de actualización de registros .
19. En el cuadro de diálogo que se abrirá seleccionarla tabla a modificar comentarios.
20. En Seleccionar registro de selecciona detalle_comentario.
21. Cuando se termine la actualización deberemos volver a la página admin.php.
22. Haz que el campo Id sea oculto.
23. El campo Fecha debe enviarse como Fecha.
24. El campo Comentario debe mostrarse como un Área de texto.
25. Pulsa Aceptar para cerrar el cuadro de diálogo.
26. Guarda los cambios y cierra el documento.
En realidad lo deberíamos de haber hecho un poco más complejo. En vez de mostrar el ID de la entrada,
habría que mostrar un menú con las distintas entradas, como hacíamos con las categorías.
21.8. Eliminación de elementos
Para terminar con las páginas de administración deberemos crear las páginas que recogerán el parámetro
del listado y eliminarán el elemento.
En este caso es casi indispensable que muestres el contenido del registro junto con un botón de Eliminar.
De esta forma le estaremos pidiendo confirmación al usuario y nos aseguraremos de que el registro que
estamos a punto de borrar es el que hay que borrar.
Ningún programa debría de tener un botón que borre registros sin pedir confirmación al usuario.
17. Nota: Sigue los pasos que explicamos en el tema anterior y no tendrás ningún problema.
Eliminar elementos
Objetivo
Practicar las operaciones necesarias para crear las páginas de eliminación de elementos.
Ejercicio
1. Si WampServer no se está ejecutando, lánzalo para realizar este ejercicio.
2. Si los servicios de MySQL o Apache no se están ejecutando, lánzalos para poder tener acceso a las
bases de datos y a la ejecución de archivos PHP.
3. Ejecuta Dreamweaver y abre el sitio blog, vamos a trabajar sobre él. Vamos a crear la página para
eliminar comentarios.
4. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
5. Dale el título Blog aulaClic - Eliminar comentario y guárdalo como elimina_comentario.php.
6. Crearemos un recordset para cargar el comentario que queremos eliminar.
7. Haz clic en el botón para crear un nuevo juego de registros.
8. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_comentario.
9. En Conexión selecciona blog_aulaclic.
10. En Tabla selecciona comentarios.
11. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
12. Haz clic en el botón Aceptar para crear el juego de registros.
13. En la única región editable escribe un párrafo de clase titulo que diga Se va a eliminar a eliminar el
comentario:
14. Un segundo párrafo en negrita deberá mostrar el Autor del comentario. Arrástralo desde el panel
Vinculaciones.
15. Luego añade el Comentario.
16. Finalmente crea un último párrafo de clase datos y arrastra en él el elemento Fecha.
17. Crea un formulario (Insertar → Formulario → Formulario).
18. En él crea un campo oculto (Insertar → Formulario → Campo Oculto).
19. En el panel Propiedades dale el nombre campoOculto al campo que acabamos de crear.
20. Ve a la vista código. Si el campo oculto no muestra el atributo value, añádelo (value=""). Arrastra
entre las comillas el Id del juego detalle_comentario.
21. Crea también un botón (Insertar → Formulario → Botón).
22. En el Inspector de propiedades, cambia el valor del botón por Borrar comentario.
23. Selecciona el formulario. En el campo Acción indica la página actual elimina_comentario.php, y
cambia el método de envío a GET.
24. Estamos listos para insertar el comportamiento de Eliminar Registro.
25. Haz clic en el botón Eliminar Registro en la barra Datos.
26. En Comprobar si hay una variable definida, elige Parámetro URL y escribe campoOculto. Así solo
intentará borrar si se ha recibido este parámetro.
27. Rellena los datos del cuadro de diálogo, en Valor de clave principal escribe Parámetro URL
campoOculto.
28. En Después de borrar ir a escribe admin.php.
29. Pulsa Aceptar para terminar.
30. Cierra el documento guardando los cambios.
21.9. Restringir acceso
Como has visto hemos creado dos zonas completamente independientes en nuestro sitio: la interfaz pública
donde mostramos el contenido del blog, y la interfaz privada desde donde podemos acceder a las opciones
de administración de la base de datos.
18. Naturalmente, queremos que la parte privada no sea accesible por cualquiera. Únicamente nosotros y
aquellas personas autorizadas deberán poder ver las páginas de administración que hemos creado.
Es por eso que en el apartado de Estructura de datos creamos la tabla usuarios.
En el panel Insertar Datos encontramos la opción Autenticación de usuarios que aún no hemos utilizado:
Podemos utilizar estas páginas para crear niveles de seguridad dentro de nuestro sitio.
Restringiendo la visualización de ciertas páginas a usuarios que almacenaremos en nuestra base de datos y
que necesitarán introducir una contraseña para verificar su identidad.
El primer paso será crear una página de acceso en la que requeriremos que el usuario introduzca su nombre
y contraseña para que podamos validarla.
Para ello deberemos crear un formulario en el que colocaremos dos campos, uno para el nombre y otro para
la contraseña.
Crea un botón que active el formulario y selecciona la opción Conectar a usuario en el desplegable de la
imagen.
Se abrirá este cuadro de diálogo:
Aquí deberemos establecer la configuración de conexión a la zona privada.
• Deberemos indicar en la opción Obtener entrada de formulario el nombre que tiene el formulario que
hemos creado.
• En el Campo Nombre de usuario deberemos indicar cuál de las dos cajas de texto del formulario
contendrá el Nombre de usuario.
• En el Campo Contraseña seleccionaremos la caja de texto que contendrá la Contraseña.
Luego estableceremos las opciones para la comunicación con la base de datos.
• Deberemos indicar la Conexión y Tabla que vamos a utilizar para validar la entrada del usuario.
19. • En Columna Nombre de usuario indica cuál es el nombre del campo de la tabla que guarda los
nombres de usuario.
• En Columna Contraseña selecciona el campo que guarda en la tabla las contraseñas.
En la siguiente sección deberás establecer a qué página redirigirás si el usuario y contraseña son correctos
rellenando el campo Si la conexión es correcta, ir a:.
En Si falla la conexión, ir a escribirás la URL de la página a la que se deberá redirigir si la entrada fue
incorrecta. Sería por ejemplo un página de error.
Marca la casilla Ir a URL anterior (si existe) si en ambos casos la redirección es a la misma página.
Finalmente podrás escoger entre utilizar diferentes niveles de acceso o no.
Para ello deberás seleccionar una de las dos opciones en el cuadro Restringir acceso por:.
Ten en cuenta que si decides crear varios niveles deberás añadir un campo a la tabla para que almacene el
nivel de cada usuario. Este campo será el que indicaremos en el desplegable Obtener nivel de:.
Una vez hayas rellenado todos los datos, pulsa Aceptar y se añadirá el código necesario a la página.
Nota: El método que utiliza Dreamweaver para recordar la entrada del usuario hasta su desconexión utiliza
cookies. Así que si tu navegador o el navegador del usuario las tiene deshabilitadas esté código no podrá
realizar su función. Lo normal en el tratamiento de usuarios es emplear variables de sesión del servidor.
El siguiente paso será proteger cada una de las páginas que quieras que permanezcan bajo acceso
privado.
Para ello sólo tendrás que abrir la página que quieras restringir y seleccionar la opción Restringir acceso a
página .
Verás el siguiente cuadro de diálogo:
Aquí deberás indicar si estás creando la restricción respecto a un mismo nivel o por el contrario estás
usando diferentes niveles de acceso.
Selecciona la opción que escogiste en el cuadro de diálogo de Conectar usuario, en el caso de que hubiesen
niveles, especifica el nivel que le quieres asignar a la página.
Deberás escribir una URL en Si se deniega el acceso, ir a: para que los usuarios que intenten acceder a esta
página sin haber hecho login sean redirigidos a otra ventana. Normalmente será a la ventana de inicio de
sesión.
También deberás incorporar algún enlace para que el usuario pueda desconectarse y salga del área
privada (cerrar sesión).
20. Para ello tienes dos opciones, al seleccionar la opción Desconectar Usuario verás el siguiente cuadro de
diálogo:
Puedes crear un enlace para que el usuario pulse sobre él para desconectarse. Para ello deberás seleccionar
la opción Vínculo en el que se ha hecho clic y seleccionar un vínculo existente en la página o seleccionar la
opción Crear nuevo vínculo: "Desconectar" para que se añada automáticamente el vínculo.
O también puedes hacer que la página sobre la que estás aplicando la opción sea una página de
desconexión. De esta manera cuando la visites te desconectará automáticamente.
Utiliza la opción Cargarse la página si estás en una página de desconexión.
Necesitarás crear un enlace a esta página y que un usuario lo siga para desconectarse.
Finalmente en el campo Al terminar, ir a: deberás introducir una URL a la cual se redirigirá al usuario una
vez se haya desconectado. Normalmente una URL no restringida, como el index.
Puedes crear una página para dar de alta nuevos usuarios para hacer crecer el número de escritores en tu
blog.
Para ello necesitarás introducir un formulario de inserción de registros que cree un nuevo registro en la
tabla usuarios.
Puedes utilizar la opción Comprobar nuevo nombre de usuario para que se chequee antes de guardar si el
usuario ya existe con ese nombre.
Lo deberás indicar en este cuadro de diálogo:
Selecciona el campo del formulario que corresponde con el nombre de usuario.
Y elige una URL a la que redirigir si el nombre ya está ocupado.
Ten en cuenta que si creas diferentes niveles de acceso puedes tener varios escritores que sólo puedan
crear nuevas entradas, mientras que el acceso al resto de páginas de administración puede estar permitido
para una única persona.
21. Si no tienes abierto Dreamweaver, ábrelo para realizar los ejercicios planteados a continuación.
Ejercicio 1:
1 Modifica el archivo admin.php para añadirle dos nuevos párrafos antes del que dice Modificar
comentarios.
En el primero debe leerse Modificar entrada, y debe estar enlazado a listado_entradas.php.
El segundo debe decir Modificar categoría, y debe estar enlazado a listado_categorias.php.
2 Crea un archivo llamado listado_entradas.php basado en la plantilla blog.dwt.php que liste el título y la
fecha de cada una de las entradas.
Al lado del registro deberás introducir la imagen imagenes/edit.png que enlace con el archivo
modifica_entrada.php para modificar esa entrada.
Luego añade la imagen imagenes/trash.png que enlace con el archivo elimina_entrada.php para eliminar
esa entrada.
Es decir, sigue el mismo formato que listado_comentarios.php.
3 Haz que se muestren los registros de 6 en 6 y añade al pie del listado una barra de navegación de
registros.
4 Crea un archivo llamado listado_categorias.php basado en la plantilla blog.dwt.php que liste el nombre de
cada una de las categorías.
Al lado del registro deberás introducir la imagen imagenes/edit.png que enlace con el archivo
modifica_categoria.php para modificar esa categoría.
Luego añade la imagen imagenes/trash.png que enlace con el archivo elimina_categoria.php para eliminar
esa categoría.
5 Haz que se muestren los registros de 6 en 6 y añade al pie del listado una barra de navegación de
registros.
Ejercicio 1:
Apartado 1 Abre el sitio libreria y sigue las instrucciones del enunciado para modificar el archivo
admin.php.
Apartado 2.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, pestaña
Plantillas).
2. Dale el título Blog aulaClic - Listado de entradas y guárdalo como listado_entradas.php.
22. 3. En la única región editable deberás escribir un párrafo de clase titulo que diga Selecciona una
entrada a modificar o eliminar.
Crearemos un recordset para cargar los títulos y fechas de las entradas.
4. Haz clic en el botón para crear un nuevo juego de registros.
5. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
listado_entradas.
6. En Conexión selecciona blog_aulaclic.
7. En Tabla selecciona entradas.
8. En Ordenar selecciona Fecha y en el desplegable de al lado Descendente.
9. Haz clic en el botón Aceptar para crear el juego de registros.
10. Debajo del párrafo que hemos añadido inserta una tabla con 10 píxeles de relleno de celda.
11. La tabla deberá tener 2 filas y 4 columnas, siendo la primera fila encabezado.
12. Aplica a las celdas de la primera fila el estilo borde_inferior.
13. Escribe en la primera celda de la primera fila Título en negrita.
14. Escribe en la segunda celda de la primera fila Fecha en negrita.
15. Arrastra el elemento Titulo a la primera celda de la segunda fila.
16. Arrastra el elemento Fecha a la segunda celda de la segunda fila y ponlo en cursiva.
17. En la tercera celda de la segunda fila inserta la imagen imagenes/edit.png, con el atributo Alt Editar.
18. Deberás enlazarla a modifica_entrada.php?id=
19. Arrastra el elemento Id del juego listado_entradas para que el enlace quede de este modo:
modifica_entrada.php?id=<?php echo $row_listado_entradas['Id']; ?>
20. En la cuarta celda de la segunda fila inserta la imagen imagenes/trash.png.
21. Deberás enlazarla a elimina_entrada.php?id=
22. Arrastra el elemento Id para que el enlace quede de este modo:
elimina_entrada.php?id=<?php echo $row_listado_entradas['Id']; ?>
Apartado 3.
1. Selecciona la segunda fila de la tabla y haz que se repita para que muestre 6 registros.
Utiliza la opción Repetir Región, para el juego de registros listado_entradas.
2. Luego coloca el cursor al final del contenido editable, después de la repetición e introduce una barra
de navegación de registros , sobre el juego de registros listado_entradas.
3. Cierra el documento guardando los cambios.
Apartado 4.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Dale el título Blog aulaClic - listado de categorías, y guárdalo como listado_categorias.php.
3. En la única región editable deberás escribir un párrafo de clase titulo que diga Selecciona una
categoría a modificar o eliminar
4. Crearemos un recordset para cargar los nombres e ids de categorías.
Haz clic en el botón para crear un nuevo juego de registros.
5. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
listado_categorias.
6. En Conexión selecciona blog_aulaclic.
7. En Tabla selecciona categorias.
23. 8. En Ordenar selecciona Nombre y en el desplegable de al lado Ascendente.
9. Haz clic en el botón Aceptar para crear el juego de registros.
10. Debajo del párrafo que hemos añadido deberás insertar una tabla con 10 píxeles de relleno de celda.
11. La tabla deberá tener 2 filas y 3 columnas, siendo la primera un encabezado.
12. Selecciona las celdas de la primera fila y aplícales el estilo borde_inferior.
13. Escribe en la primera celda de la primera fila Nombre
14. Arrastra el elemento Nombre del juego listado_categorias a la primera celda de la segunda fila.
15. En la segunda celda de la segunda fila inserta la imagen imagenes/edit.png.
16. Deberás enlazarla a modifica_categoria.php?id=
17. Arrastra el elemento Id para que el enlace quede de este modo:
modifica_categoria.php?id=<?php echo $row_listado_categorias['Id']; ?>
18. En la tercera celda de la segunda fila inserta la imagen imagenes/trash.png.
19. Deberás enlazarla a elimina_categoria.php?id=
20. Arrastra el elemento Id para que el enlace quede de este modo:
elimina_categoria.php?id=<?php echo $row_listado_categorias['Id']; ?>
Apartado 5.
1. Selecciona la segunda fila de la tabla y haz que se repita para que muestre 6 registros.
Utiliza la opción Repetir Región, sobre el juego listado_categorias.
2. Luego coloca el cursor al final del contenido editable e introduce una barra de navegación de
registros , sobre el mismo juego.
3. Cierra el documento guardando los cambios.
Ejercicio 2:
1 Crea un página de modificación de entradas llamada modifica_entrada.php basada en la plantilla
blog.dwt.php que funcione de la misma forma que la página modifica_comentario.php.
2 Crea un página de modificación de categorías llamada modifica_categoria.php basada en la plantilla
blog.dwt.php que funcione de la misma forma que la página modifica_comentario.php.
Ejercicio 2:
Apartado 1.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
2. Dale el título Blog aulaClic - Modificar entrada y guárdalo como modifica_entrada.php.
Crearemos un recordset para cargar la entrada que queremos modificar.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_entrada.
5. En Conexión selecciona blog_aulaclic.
6. En Tabla selecciona entradas.
7. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
8. Haz clic en el botón Aceptar para crear el juego de registros.
9. Ahora visualizaremos la entrada para asegurarnos de que es la que queremos borrar.
10. Escribe un párrafo de clase titulo que contenga el Título de la entrada.
11. Arrástralo desde el panel Vínculos, desde el juego detalle_entrada.
12. Luego arrastra el elemento Texto bajo el Título, este no deberá estar incluido en un párrafo.
24. 13. Finalmente inserta una regla horizontal (Insertar → HTML → Regla Horizontal).
14. Antes que nada necesitaremos crear un juego de registros para cargar las categorías en el
desplegable.
15. Haz clic en el botón para crear un nuevo juego de registros.
16. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
listado_categorias.
17. En Conexión selecciona blog_aulaclic.
18. En Tabla selecciona categorias.
19. En Ordenar selecciona Nombre Ascendente.
20. Haz clic en el botón Aceptar para crear el juego de registros.
21. Pulsa el botón Asistente de formulario de actualización de registros .
22. En el cuadro de diálogo que se abrirá deberás seleccionar la tabla a modificar entradas.
23. En Seleccionar registro de, elige detalle_entrada.
24. Cuando se termine la actualización deberemos volver a la página listado_entradas.php.
25. Haz que el campo Id sea oculto.
26. El campo Fecha debe enviarse como Fecha.
27. El campo Texto debe mostrarse como un Área de texto.
28. El campo Id_Categoria deberá mostrarse como un Menú. Pulsa el botón Propiedades de menú.
29. En las propiedades del menú, en Rellenar elementos de menú elige De base de datos.
30. En juego de registros, elige listado_categorias.
31. En Obtener etiquetas de selecciona Nombre, y en Obtener valores de elige Id.
32. En Seleccionar valor igual a, pulsa sobre el botón de datos dinámicos y elige el Id_Categoria del
juego detalle_entrada.
33. Pulsa Aceptar para cerrar el diálogo.
34. Pulsa Aceptar.
Apartado 2.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, pestaña
Plantillas).
2. Dale el nombre Blog aulaClic - Modificar categoría y guárdalo como modifica_categoria.php.
3. En la única región editable escribe un párrafo que diga Modifica el nombre de la categoría:, con la
clase titulo.
4. Crearemos un recordset para cargar la categoría que queremos modificar.
Haz clic en el botón para crear un nuevo juego de registros.
5. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_categoria.
6. En Conexión selecciona blog_aulaclic.
7. En Tabla selecciona categorias.
8. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
9. Haz clic en el botón Aceptar para crear el juego de registros.
10. Pulsa el botón Asistente de formulario de actualización de registros .
11. En el cuadro de diálogo que se abrirá deberás seleccionar la tabla a modificar categorias.
12. En Seleccionar registro de, elige detalle_categoria.
13. Cuando se termine la actualización deberemos volver a la página listar_categorias.php.
14. Haz que el campo Id sea oculto.
25. 15. Pulsa Aceptar el cuadro de diálogo.
16. Guarda los cambios y cierra el documento.
Ejercicio 3:
1 Crea un página de eliminación de entradas llamada elimina_entrada.php basada en la plantilla
blog.dwt.php que funcione de la misma forma que la página elimina_comentario.php.
2 Crea un página de eliminación de categorías llamada elimina_categoria.php basada en la plantilla
blog.dwt.php que funcione de la misma forma que la página elimina_comentario.php.
Ejercicio 3:
Apartado 1.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, pestaña
Plantillas).
2. Dale el título Blog aulaClic - Eliminar entrada y guárdalo como elimina_entrada.php.
Crearemos un recordset para cargar la entrada que queremos eliminar.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_entrada.
5. En Conexión selecciona blog_aulaclic.
6. En Tabla selecciona entradas.
7. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
8. Haz clic en el botón Aceptar para crear el juego de registros.
9. En la única región editable escribe un párrafo de clase titulo que muestre el Título de la entrada.
Arrástralo desde el panel Vinculaciones.
10. Luego deberás añadir el elemento Texto bajo el Titulo, pero sin embargo, este no debe estar en un
párrafo.
11. Añade un nuevo párrafo a continuación de clase datos que muestre el elemento Fecha.
12. Inserta una regla horizontal (Insertar → HTML → Regla horizontal).
13. Y finalmente escribe un último párrafo que diga Si eliminas una entrada, sus comentarios también se
eliminarán.
14. Crea un formulario (Insertar → Formulario → Formulario).
15. En él crea un campo oculto (Insertar → Formulario → Campo Oculto).
16. Crea también un botón (Insertar → Formulario → Botón). Cambia su valor a Borrar entrada.
17. En el panel Propiedades dale el nombre campoOculto al campo que acabamos de crear.
18. Pulsa sobre el icono de datos dinámicos (el del rayo) y haz que tome el valor del campo Id del juego
detalle_entrada.
19. Selecciona el formulario. Cambia su método de envío a GET, y su acción a la página actual.
Estamos listos para insertar el comportamiento de Eliminar Registro.
20. Haz clic en el botón Eliminar Registro en la barra Datos.
21. En Comprobar si hay una variable definida, elige Parámetro URL y escribe campoOculto.
22. En Valor de clave principal escribe Parámetro URL campoOculto.
23. En Después de borrar ir a escribe listado_entradas.php.
24. Pulsa Aceptar para terminar.
25. Cierra el documento guardando los cambios.
Apartado 2.
1. Abre un nuevo archivo dinámico basado en la plantilla blog.dwt.php (Archivo → Nuevo, Página de
plantilla).
26. 2. Dale el título Blog aulaClic - Eliminar categoría y guárdalo como elimina_categoria.php.
Crearemos un recordset para cargar la categoría que queremos eliminar.
3. Haz clic en el botón para crear un nuevo juego de registros.
4. En el cuadro de diálogo que se abrirá rellena los datos de la siguiente forma: en Nombre escribe
detalle_categoria.
5. En Conexión selecciona blog_aulaclic.
6. En Tabla selecciona categorias.
7. En Filtrar selecciona lo siguiente: Id = Parámetro URL id.
8. Haz clic en el botón Aceptar para crear el juego de registros.
9. En la única región editable deberás escribir un párrafo de clase titulo que diga Eliminar categoría.
10. Luego inserta un nuevo párrafo en el que se pueda leer Vas a eliminar la categoría:
11. Arrastra a continuación el Nombre de la categoría desde el panel Vinculaciones. Ponla en cursiva y
negrita.
12. Inserta una regla horizontal (Insertar → HTML → Regla horizontal).
13. Y finalmente añade un último párrafo que diga Si eliminas una categoría, sus entradas y comentarios
también se eliminarán.
14. Crea un formulario (Insertar → Formulario → Formulario).
15. En él crea un campo oculto (Insertar → Formulario → Campo Oculto).
16. Crea también un botón (Insertar → Formulario → Botón). Cambia su valor a Borrar categoría.
17. En el panel Propiedades dale el nombre campoOculto al campo que acabamos de crear.
18. Pulsa sobre el icono de datos dinámicos (el del rayo) y haz que tome el valor del campo Id del juego
detalle_categoria.
19. Selecciona el formulario. Cambia su método de envío a GET, y su acción a la página actual.
Estamos listos para insertar el comportamiento de Eliminar Registro.
20. Haz clic en el botón Eliminar Registro en la barra Datos.
21. En Comprobar si hay una variable definida, elige Parámetro URL y escribe campoOculto.
22. En Valor de clave principal escribe Parámetro URL campoOculto.
23. En Despues de borrar ir a escribe listado_categorias.php.
24. Pulsa Aceptar para terminar.
25. Cierra el documento guardando los cambios.
Ejercicio 4:
Apartado 1.
1. Abre el documento elimina_categoria.php.
2. Selecciona la opción Restringir acceso a página .
La página ahora estará protegida.
3. Cierra el documento guardando los cambios.
Repite los pasos anteriores para todas las páginas que indica el enunciado.
Apartado 2.
Para terminar crearemos un enlace Desconectar en las páginas para que el usuario pueda terminar la
sesión.
1. Abre el documento elimina_categoria.php.
2. AL principio de la región editable, crea un párrafo con la clase datos y sitúa el punto de inserción en
él.
3. Selecciona la opción Desconectar usuario .
27. 4. En el cuadro de diálogo que se abrirá selecciona la opción Crear nuevo vínculo: "Desconectar".
5. En Al terminar, ir a escribe index.php.
6. Pulsa Aceptar.
7. Cierra el documento guardando los cambios.
Repite los pasos anteriores para todas las páginas que indica el enunciado.
Ejercicio 4:
1 Restringe el acceso a las páginas:
elimina_categoria.php
elimina_entrada.php
listado_categorias.php
listado_entradas.php
modifica_categoria.php
modifica_entrada.php
2 Crea un enlace Desconectar en la parte superior de las páginas anteriores.
El enlace deberá estar en un párrafo de clase datos.
Ejercicio 4:
Apartado 1.
1. Abre el documento elimina_categoria.php.
2. Selecciona la opción Restringir acceso a página .
La página ahora estará protegida.
3. Cierra el documento guardando los cambios.
Repite los pasos anteriores para todas las páginas que indica el enunciado.
Apartado 2.
Para terminar crearemos un enlace Desconectar en las páginas para que el usuario pueda terminar la
sesión.
1. Abre el documento elimina_categoria.php.
2. AL principio de la región editable, crea un párrafo con la clase datos y sitúa el punto de inserción en
él.
3. Selecciona la opción Desconectar usuario .
4. En el cuadro de diálogo que se abrirá selecciona la opción Crear nuevo vínculo: "Desconectar".
5. En Al terminar, ir a escribe index.php.
6. Pulsa Aceptar.
7. Cierra el documento guardando los cambios.
Repite los pasos anteriores para todas las páginas que indica el enunciado.