UNIVERSIDAD DON BOSCO FACULTAD DE INGENIERIA ESCUELA DE ... · Insertar en la entrada (Insert Into...
Transcript of UNIVERSIDAD DON BOSCO FACULTAD DE INGENIERIA ESCUELA DE ... · Insertar en la entrada (Insert Into...
1
UNIVERSIDAD DON BOSCO
FACULTAD DE INGENIERIA
ESCUELA DE COMPUTACIÓN
Ciclo I
Desarrollo de Aplicaciones Web con Gestores de Contenido
Guía N° 5
Instalación del CMS WordPress
En esta guía de práctica se pretende que el estudiante sea capaz de:
1. Descargar al paquete instalador de WordPress en los sitios oficiales del programa.
2. Instalar y configurar WordPress localmente y en un servidor web en línea.
3. Personalizar el sitio web creado con WordPress.
4. Utilizar con facilidad el tablero de controles (escritorio) para la administración del sitio web.
WordPress es otro de los sistemas de gestión de contenido o CMS (por sus siglas en inglés,
Content Management System) enfocado a la creación de blogs (sitios web periódicamente
actualizados).
WordPress ha sido desarrollado en PHP para entornos que ejecuten
MySQL y Apache, bajo licencia GPL y código modificable, y su
fundador es Matt Mullenweg.
WordPress fue creado a partir del desaparecido b2/cafelog y se ha
convertido junto a Movable Type en el CMS más popular de la
blogosfera y en el más popular con respecto a cualquier otro CMS
de aplicación general.
Las causas de su enorme crecimiento son, entre otras, su licencia, su facilidad de uso y sus
características como gestor de contenidos.
Otro motivo a considerar sobre su éxito y extensión es la enorme comunidad de desarrolladores y
diseñadores, encargados de desarrollarlo en general o crear complementos y temas para la
comunidad. En agosto de 2013 era usado por el 18,9% de todos los sitios existentes en internet.
WordPress nació del deseo de construir un sistema de publicación personal, elegante y con una
buena arquitectura. Basado en PHP, MySQL y con licencia GPL, WordPress pone especial
atención a la estética, estándares web y usabilidad.
En principio, está configurado para usar un blog por sitio o instalación, pero también es posible
tener varios blogs con varias o una única base de datos desde la versión 3.0.
I. RESULTADOS DE APRENDIZAJE
II. INTRODUCCIÓN
2
III. MATERIALES Y EQUIPO
No. Requerimiento Cantidad
1 Guía de práctica #5 1
2 Computadora con SO Windows y WampServer instalados 1
3 Paquete de instalación de WordPress versión 5.3 o superior 1
4 Conexión a Internet 1
IV. PROCEDIMIENTO
Ejercicio #1: Instalación de WordPress
1. Descargar el paquete de instalación de WordPress desde su sitio web oficial
(www.wordpress.org) y guardarlo en alguna carpeta en el disco fijo de su computadora.
Imagen 1. Sitio web oficial de WordPress.
Imagen 2. Paquete de instalación de WordPress dentro de carpeta web.
3
2. Copie el archivo .zip (wordpress-5.3-es_ES.zip) del paquete de instalación de WordPress
hacia la carpeta web del servidor local. En el caso de Wamp, cópielo dentro de la carpeta
www.
3. Extraer ahí a los archivos del paquete de WordPress. Espere a que finalice el proceso de
extracción del archivo comprimido del WordPress.
Verificar que se ha extraído el paquete con la creación de la carpeta WordPress dentro de la
carpeta web (tal como lo muestra la Imagen 2).
4. En el navegador de su preferencia ingrese la dirección http://localhost/wordpress
5. Puede ocurrir que en la primera pantalla que se cargue en el navegador se muestre un listado
de idiomas.
Si este es el caso, habrá que elegir uno para
realizar la instalación en dicho idioma
Si esta pantalla no se presenta, la instalación se
realizará por defecto en inglés.
Imagen 3. Selección de idioma de instalación
6. Leer las indicaciones para continuar con la creación del archivo de configuración wp-
config.php con el instalador de WordPress.
Observe la Imagen 4. WordPress solicita que antes de continuar, debe crear la base de datos
en MySQL que usara y el usuario administrador de la misma.
7. Ingrese a la interface phpMyAdmin. Luego, bajo MySQL, cree una base de datos llamada
wpudb y asigne todos los privilegios de su administración al super usuario root:
• Nombre de la base de datos: wpudb
• Usuario administrador de la base de datos: root
• Contraseña: (ninguna, por defecto asignada a root)
4
8. Retorne a la ficha/pestaña donde espera el asistente de instalación local de WordPress y dar
clic sobre botón ¡Vamos a ello!
Imagen 4: Parámetros de la base de datos que WordPress solicita para continuar con la
instalación
Imagen 5. Verificación de las direcciones solicitadas.
9. En el siguiente paso (observe un ejemplo en Imagen 5), se solicita los parámetros de la base
de datos en MySQL que usara WordPress. Proporcione los datos listados a continuación
(mostrados también en la Imagen 5) y luego presione el botón Enviar.
◼ Nombre de la base de datos: wpudb
◼ Nombre de usuario: root (es el usuario por defecto de MySQL en Wamp)
5
◼ Contraseña: vacía (por defecto para el usuario root no hay contraseña establecida)
◼ Servidor de la base de datos: localhost
◼ Prefijo de tabla: wpudb_
Nota: Prefijo de tabla: prefijo que llevaran los nombres de las tablas que creara este gestor
WordPress para su funcionamiento.
En este paso, puede ocurrir que se obtenga un mensaje que indique que no pudo seleccionarse la
base de datos indicada, así:
Imagen 7. Pantalla de error en la selección de la base de datos.
En este caso, retorne al paso anterior y luego, redacte correctamente los parámetros de la bdd.
Para solucionar lo anterior, lo que hay que hacer es confirmar la creación de la base de datos
(wpudb) haciendo uso de la consola de MySQL o de alguna interfaz gráfica para MySQL como
phpMyAdmin y confirmar permiso para administración a usuario root. Posteriormente presione el
botón Inténtalo de nuevo.
10. Si reconoce la bdd de MySQL, se informa que todo ha sido correcto. Presione el botón
Ejecutar la instalación.
Imagen 8: confirmación de acceso a la base de datos brindada durante la instalación
11. Proporcione la información de configuración del sitio web WordPress que acaba de instalar,
llenando cada uno de los campos de formulario.
Observe un ejemplo de configuración en la Imagen 9. La cuenta de usuario se llamará su
primer nombre.su primer apellido, utilice una contraseña débil (123456) y a uno de sus
emails.
Luego hace clic en el botón Instalar WordPress.
6
Imagen 9. Ejemplo de ingreso de información de configuración de la
cuenta de administrador del sitio web.
11. Si la instalación se llevó a cabo correctamente, se mostrará la página de la Imagen 10.
Presione el botón Acceder para autenticarse como administrador de su sitio web con
WordPress.
Imagen 10. Presionar el botón acceder para ingresar al sitio web WordPress.
11. Digite el usuario y contraseña de Administrador (ver Imagen 11) para acceder al área de
administración (Back-end) de su sitio local bajo WordPress, denominado Tablero de controles
o Escritorio (Dashboard) de WordPress (ver Imagen 12).
7
Imagen 11. Ingresar el usuario y contraseña para acceder al área administrativa de WordPress.
Imagen 12. Escritorio (Dashboard), el back-end en WordPress.
Ejercicio #2: Personalización del sitio web
13. Abra una nueva ficha/pestaña en su navegador, para luego escribir y entrar a la siguiente
URL:
localhost/wordpress/
Accede a la vista de presentación (front-end) de su sitio bajo WordPress, observe la
imagen 13. Haga un recorrido del contenido por defecto de la ventana.
8
Imagen 13: Vista inicial del Front-End de su sitio con WordPress.
14. Retorne a la ficha/pestaña con el Escritorio de WordPress. Luego, haga clic en botón
Personaliza tu sitio (Customize Your Site).
Se genera una vista de diseño del front-end del sitio (ver Imagen 14) que brinda
WordPress por defecto y la identificación de cada una de las partes de la página principal.
9
Imagen 14: Personalización del Front-end del sitio con WordPress
15. En el panel de la izquierda observar las distintas pestañas que se utilizan para poder
personalizar el sitio web.
16. Del Panel izquierdo, localice al Tema activo. Este tiene al tema predeterminado Twenty
Twenty.
17. Luego de clic en la pestaña Identidad del sitio, para poder personalizar el título y la
descripción corta (con su propio nombre) del sitio web.
10
Observe el cambio en la presentación del diseño preliminar del contenido del front-end
18. Para actualizar la vista front-end, presione el botón Publicar. Vaya a la pestaña/ficha del
navegador con el front-end del sitio y presione F5. Confirme que se actualiza la
descripción del sitio.
19. Retorne al Escritorio de WordPress. Para regresar al panel de menú, de clic en botón [ < ] de la pestaña Personalizacion Identidad del sitio,.
20. De clic en pestaña Colores. Localice color para fondo de cabecera y pie de pagina y de
clic en botón Elegir color. Seleccione un color para el texto y observe la aplicación en
vista temporal.
21. Retorne a la barra del Panel de control, dando clic en botón [ < ].
22. Ingrese a ficha Imagen de fondo. Elija y suba una imagen para el fondo de su sitio web.
Luego, retorne al Panel de control.
23. De clic a la pestaña Ajuste de la pagina de inicio y luego, de la pareja elija la
opción Tus últimas entradas como forma de presentación de la página de inicio del sitio
(portada).
24. Haga clic en botón Publicar y luego, retorne al Panel de control. Cierre la vista diseño
(ver imagen) y luego, cierre sesión (ubique la opción en la esquina superior derecha).
11
25. Cierre la ficha/pestaña con el acceso al back-end del sitio web.
26. Abra la ficha/pestaña del navegador que tiene a la pagina de inicio (portada) del sitio web,
presione F5 y observe los cambios realizados.
Ejercicio #3: Edición de la entrada predeterminada.
1. Abra una ficha/pestaña vacia en el navegador web. Luego, escriba y ejecute la URL:
http://localhost/wordpress/wp-admin
2. Se abre la ventana para acceder al tablero de administración (Escritorio o Dashboard) de
WordPress. Ingrese la cuenta y contraseña del administrador del sitio.
3. Del panel izquierdo, localice y haga clic en la siguiente secuencia de opciones
Entradas→Todas las entradas (Posts→All Posts) en el menú de la parte izquierda.
2. Se muestren los títulos de las diferentes Entradas publicadas. En este momento la única
entrada es ¡Hola Mundo! (Hello world).
3. Debajo debajo del título de esta entrada, haga clic en Editar (Edit).
12
3. Cuando cargue el contenido de la entrada, cambiar el título ¡Hola Mundo! (Hello
world) por un título de un tema personal que le llame su atención.
Luego, en el texto de la entrada, borre el que aparece por defecto y digite en su
lugar a unos 3 o 4 párrafos extensos que describan a su título elegido para su
primera página de entrada.
Importante: Todos los párrafos deben tener un estilo de texto uniforme.
4. Descargue de internet a una imagen general relacionada al tema que agrego en el
paso anterior.
5. Luego, dentro del contenido agregado en su entrada, cree una línea vacía entre la
primera pareja de párrafos. Ubique el cursor en esta línea vacía intermedia y
presione el botón Añadir objeto (Add media).
6. En la página Insertar multimedia (Insert Media) presionar el botón Selecciona
archivos (Select Files). Ubique y seleccione el archivo de imagen que ya descargo
sobre su tema elegido.
7. Nota: Tenga en cuenta el tamaño máximo del archivo que se puede adjuntar
(8MB).
8. Seleccione la imagen de su disco a subir e insertar dentro de la entrada.
9. Al presionar el botón Abrir podrá visualizar la imagen seleccionada en el servidor y
en la página previa Insertar multimedia.
Ingrese la información solicitada por WordPress para su imagen y presione el botón
Insertar en la entrada (Insert Into Post).
Observe un ejemplo de la descripción dada para una imagen a incluir:
10. Seleccione la imagen y céntrela con los botones de la barra de herramientas del
editor WYSIWYG.
13
11. Actualice la entrada con el botón Actualizar (Update) y visualice en la página
de portada el resultado.
12. Haga los pasos necesarios para incluir 2 Entradas mas, cuyo contenido (texto,
imagenes) tendrá relación con el presentado en la Entrada inicial
13. Llamé a su instructor para que evalué la instalación local de Wordpress y
configuración realizada en todo el procedimiento de esta práctica.
VI. BIBLIOGRAFÍA
➢ Linux Guía para Administrador de redes, Tony Bautts, 1a edición.
➢ Linux - Manual de referencia, Richard Petersen, 2a edicion, 2005.
➢ Instala, administra, securiza y virtualiza Entornos Linux, Antonio Ramos, Primera
edicion, 2009.
14
Alumno:
HOJA DE EVALUACIÓN
DE GUÍAS DE PRÁCTICA
Actividad a
evaluar
Criterio a evaluar Cumplió Puntaje
SI NO
Desarrollo de la
Práctica
Logro terminar todas las partes de la guía de
laboratorio (30%)
Presentó la evidencia del desarrollo de cada una de las
partes a su docente (35%)
Trabajo de manera correcta y ordenada la guía de
laboratorio (25%).
Funcionamiento de todas las configuraciones
planteadas en la misma (10%)
PROMEDIO:
Carnet:
Docente: Fecha:
Título de la guía: No.: