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.: