Notas sobre wordpress

Notas sobre WordPress.

Santiago J Alba Implantaci贸n de Aplicaciones Web. 1

2

Contenido Qué es WordPress .................................................................................................................... 5 Blog .................................................................................................................................. 5 Web corporativa ............................................................................................................... 5 Tienda online ....................................................................................................................6 Y mucho más... .................................................................................................................6 Un recorrido por WordPress .....................................................................................................6 Barra de herramientas ..............................................................................................................9 Editando el perfil de usuario. .................................................................................................. 10 Configuración global .............................................................................................................. 11 Creando un artículo ................................................................................................................ 12 Formato de texto.................................................................................................................... 13 Añadiendo enlaces (links). ...................................................................................................... 14 Añadiendo imágenes. ............................................................................................................. 15 Galería de imágenes. .............................................................................................................. 17 Archivos Externos................................................................................................................... 18 Información adicional. ............................................................................................................ 21 Acciones en lote .....................................................................................................................22 Publicar artículos .................................................................................................................... 23 Crear páginas .........................................................................................................................24 Organizar páginas ..................................................................................................................26 17 Plantillas de páginas ........................................................................................................... 27 18 Modificar la página de inicio ...............................................................................................29 19 Administrar la librería multimedia...................................................................................... 30 20 La forma en que WordPress trabaja con las imágenes ....................................................... 32 21 Instalación de pluggins....................................................................................................... 32 22 Pluggins recomendados .................................................................................................... 34 23 Formularios de contacto .................................................................................................... 35 24 Actualizar pluggins ............................................................................................................ 35 25 Administrando las plantillas ............................................................................................... 36 26 Personalizando la plantilla ................................................................................................. 38 27 Personalizando la imagen de cabecera............................................................................... 38 28 Personalizando los menús .................................................................................................40 29 Widgets ............................................................................................................................. 41 3

30 Instalando plantillas desde el directorio de WordPress ...................................................... 43 31 Instalando y subiendo nuestras propias plantillas ............................................................... 45

4

Qué es WordPress WordPress es un sistema de gestión de contenidos (CMS) que permite crear y mantener un blog u otro tipo de web.

Con muchos años de existencia y más de un millar de temas (plantillas) disponibles en su web oficial, no es solo un sistema sencillo e intuitivo para crear un blog personal, sino que permite realizar toda clase de web más complejas.

WordPress es un sistema ideal para un sitio web que se actualice periódicamente. Si se escribe contenido con cierta frecuencia, cuando alguien accede al sitio web, puede encontrar todos esos contenidos ordenados cronológicamente (primero los más recientes y por último los más antiguos).

Es el sistema ideal para los principiantes, o para los que no tienen demasiados conocimientos técnicos.

WordPress dispone de un sistema de plugins, que permiten extender las capacidades de WordPress, de esa forma se consigue un CMS más flexible.

En muchas ocasiones se asocia WordPress con una herramienta que solo sirve para hacer blogs. Esto no es correcto: con WordPress podemos hacer un blog y mucho más: webs empresariales, tiendas online, periódico digital, central de reservas, etc. A continuación vamos a ver algunas de las cosas que podemos crear con este gestor de contenidos.

Blog

Es su función más conocida. WordPress incorpora, en su instalación por defecto todas las funcionalidades típicas de un blog: mostrar artículos en formato blog, opción de añadir comentarios a las entradas, posibilidad de organizar los artículos por categorías o etiquetas, etc..

Además se podrán agregar en la web diversos módulos, llamados widgets en WordPress, habituales de los blogs: listado de categorías del blog, listado de etiquetas, buscador, lista de artículos más leídos, lista de últimos comentarios, etc.

Con todo ello se puede decir que posiblemente WordPress sea la mejor herramienta para crear un blog, con más razón si cabe si tenemos en cuenta su sencillez de manejo.

Web corporativa

WordPress puede servir perfectamente para crear una web empresarial, entendiendo como tal una página donde podamos informar sobre todo lo que concierne a nuestra empresa o negocio: quiénes somos, servicios, clientes, etc.

5

Gracias a la multitud de plantillas disponibles para WordPress podremos conseguir diseños muy variados para nuestra web, que podrían ir desde una web con diseño minimalista y que muestre poca a información, a webs completas que carguen muchos datos en cada página.

Podremos crear distintos apartados en nuestra web para organizar los contenidos.

Estos no se limitan a páginas estáticas, o una página de blog, sino que gracias a los miles de plugins disponibles para WordPress podremos añadir más funcionalidades como formulario de contacto, foro, directorios, etc.

Tienda online

Aunque existan otros gestores de contenidos específicos para crear tiendas online (PrestaShop, Magento, etc.), WordPress puede ser una opción completamente válida, ya que dispone de varios plugins que nos permitirán incorporar una tienda online en nuestra web. De todos ellos, WooCommerce sería la opción más recomendable, aunque podemos elegir otro plugin.

Gracias a WordPress y el plugin WooCommerce podremos disponer de una tienda online con todas las funcionalidades típicas que esperamos encontrar en una aplicación de este tipo: creación de productos ilimitada, organización de productos por categoría, posibilidad de agregar atributos a los productos, diversos sistemas de pago y envío, gestión avanzada de pedidos, etc.

Las funcionalidades de nuestra tienda no se acabarán con las que incorpore el propio WooCommerce, sino que podremos añadir cientos de nuevas opciones gracias a los plugins específicos para él: importación masiva de productos, portes de envío por código postal, pasarelas de pago con tarjeta de crédito, precios de producto por cantidad, generación de facturas, etc.

Y mucho más...

Como habíamos comentado antes, los miles de plugins disponibles para WordPress nos permitirán extender las posibilidades de nuestra web en WordPress, para poder conseguir casi cualquier cosa: foro de soporte, web de gestión de reservas, directorio de empresas, canal de vídeos, etc. Si a esto le sumamos los miles de temas (plantillas) disponibles, las posibilidades para conseguir cualquier tipo de web son casi infinitas.

Un recorrido por WordPress Un sito WordPress tiene dos áreas claramente diferenciadas y a las que se accede mediante un navegador web:

6



El frontend, que es la parte pública a la que acceden los usuarios para consumir los contenidos.



El backend, o la parte desde se administra el sitio web y a la que solo pueden acceder los usuarios autorizados o administradores. Es aquí donde se crean los contenidos, se crean los diferentes roles de usuarios, se configura el aspecto, …

Para acceder tenemos que poner en la barra del navegador la_dirección_del_ dominio/wpadmin, que en nuestro caso, al ser una instalación local podemos acceder poniendo “localhost/wp-admin” . Hecho esto nos aparecerá la pagina de autenticación, donde necesitaremos escribir nuestro nombre de usuario y su contraseña para poder acceder. En caso de haber olvidado los datos de acceso en la parte inferior hay unos enlaces que nos permiten la recuperación de los mismos, para lo cual necesitaremos proporcionar el nombre de usuario o el correo electrónico que indicamos durante la instalación.

7

Una vez en el área de administración o backend podemos ver una serie de paneles en el área de escritorio.

Bienvenido a WordPress: Nos presenta algunas opciones e información básica o primeros pasos para comenzar a diseñar el sitio.

De un vistazo: Nos proporciona información sobre el sitio, número de entradas, de páginas, de comentarios, la versión de WordPress instalada y qué plantilla y si hay actualizaciones disponibles.

Actividad: Últimas entradas y comentarios (pendientes, aprobados, borrados o marcados como spam).

8

Borrador rápido: Nos permite crear un borrador de un artículo de forma rápida. Nos muestra además los borradores que tenemos creados y que están listos para su publicación.

Noticias de WordPress: Nos muestra las novedades de la plataforma WordPress para que podamos estar informados.

La barra de herramientas, que es la que aparece a la derecha, nos permite acceder a las diferentes opciones del menú de administración de WordPress, pudiendo diferenciar 3 grupos diferentes, las opciones de inicio, que ya hemos comentado, las opciones que nos permiten actuar sobre los contenidos (entradas, medios, páginas y comentarios), y la que nos permite modificar los ajustes y el funcionamiento (apariencia, plugins, usuarios, …).

Según el elemento del menú que seleccionemos, el contenido del escritorio cambiará.

Además nos informa de eventos que requieren nuestra atención, como pueden ser actualizaciones de diversos tipos o comentarios pendientes de leer.

Barra de herramientas En la parte superior podemos encontrar la barra de herramientas.

Nos permite acceder al sitio de WordPress para conseguir información sobre nuestra instalación y documentación adicional que nos puede ayudar, acceso a los foros y sugerencias.

Este enlace nos permite visualizar el “frontend” de nuestro sitio.

9

Este icono nos indica si hay alguna actualización de software disponible para nuestro sitio.

Nos informa si hay algún comentario que está esperando moderación.

Nos permite añadir nuevos elementos (Entradas, medios, páginas o usuarios).

Editando el perfil de usuario.

El perfil de usuario que se crea al instalar WordPress es la cuenta del administrador del sitio, pero puede haber más usuarios y cada uno tener su propio perfil.

Podemos acceder al perfil de nuestro usuario de dos maneras, bien a través de la barra de herramientas de la parte superior, a la derecha, haciendo click sobre nuestro avatar o nuestro nombre, o bien en el panel lateral a través de la opción Usuarios.

Ahí podemos elegir entre ver el perfil de todos los usuarios del sistema, añadir uno nuevo o editar nuestro perfil.

10

Debemos recordar que la información que ahí ponemos es pública, por lo que debemos ser cuidadosos.

Cuando editamos un perfil, a través de los diferentes menús de esta sección podemos cambiar los datos que mostramos de nuestra cuenta (usuarios, datos personales …), si queremos usar el editor visual (wysiwyg) o no, cambiar el esquema de colores, mostrar o no la barra de herramientas, elegir un avatar, cambiar contraseña, …

Configuración global Para realizar la configuración global accedemos a través del menú Ajustes del panel lateral.

Aquí encontramos varios apartados: 



Generales  Nos permite asignar un nombre y una descripción del sitio, su dirección (URL), si los usuarios pueden registrarse o no, el correo principal del sitio, el tipo de perfil de usuario por defecto, la zona horaria …

Escritura  Opciones por defecto para la escritura del contenido del sitio (formato, corrección automática del código html, categoría por defecto, activar la opción de marcadores o “activar esto”, activar diferentes tipos de edición de contenidos, activar el servicio de actualización, opciones de visualización, hacer visible el sitio a los buscadores …).

11





Comentarios  Ajustes por defecto del sitio. Por ejemplo, si se moderan los comentarios o no e incluso configurar algunos filtros para moderación automática, si se visualizan los avatares de los usuarios o no, asignar uno si el usuario no tiene uno propio. Normalmente las opciones que WordPress plantea por defecto suelen ser adecuadas.

Ajustes  Por defecto WordPress utiliza URLs que tengan signos de interrogación y montones de números, sin embargo WordPress te ofrece la posibilida de crear una estructura de URL personalizada para tus enlaces permanentes y archivos. Esto puede mejorar la estética, usabilidad y compatibilidad futura de tus enlaces y se puede hacer desde este menú.

Creando un artículo Hay dos maneras de crear un nuevo artículo, a través de la opción “+ Nuevo” en el menú de herramientas en la parte superior, o en el menú “Entradas>Añadir nueva” del menú lateral.

Se abrirá una nueva área de trabajo que nos permitirá escribir el contenido del artículo.

Lo primero que habría que hacer sería poner un título y posteriormente podemos escribir el contenido, pudiendo hacer de forma visual, es decir, podemos ir viendo el resultado mientras escribimos, o bien, en modo texto, que nos permite introducir código html. Por lo demás vemos una serie de herramientas similares a las que llevaría un procesador de texto sencillo.

Una vez terminemos pulsamos sobre el botón verde “Actualizar” de bloque “Publicar” y el contenido quedará guardado. Podemos ver el resultado pulsando en “Vista previa de los cambios” dentro del mismo bloque o en “Ver entrada” en el menú de herramientas.

12

Formato de texto.

Para que podamos dar el formato adecuado al contenido de las entradas WordPress nos proporciona una serie de herramientas, muchas similares a las que proporciona cualquier editor de texto.

Comentaremos solo algunas que pueden diferir de las de cualquier editor de texto.

Permite conmutar entre la barra de herramientas básica y la avanzada. En la imagen superior se muestra la barra de herramientas avanzada.

Sirve para escribir citas de forma que se diferencie del resto del texto.

Botón de “leer más”. Se mostraría de forma predeterminada en el frontend el contenido del artículo hasta el punto donde hemos marcado con esta opción. Ahí aparecería un botón con la leyenda “Leer más” que al ser pulsada por el usuario desplegaría el resto del artículo.

Nos permite poner el editor en pantalla completa, eliminando todo lo que le rodea y que puede distraernos a la hora de crear contenidos.

Nos permite pegar como texto plano desde el portapapeles del sistema operativo.

13

Eliminar formato del texto. Si algún texto que hemos importado del portapapeles viene con algún formato, esta opción nos permite eliminarlo.

Sirve para insertar caracteres especiales. Nos despliega una tabla con diferentes símbolos entre los que nos permite elegir el que queremos insertar.

Nos muestra los atajos de teclado que tenemos disponibles para acelerar la edición de contenidos.

Estas opciones nos permiten insertar hiper enlaces o eliminarlos.

Nos permite alternar entre el editor visual o wysiwyg y el modo de edición de código html (Texto).

Añadiendo enlaces (links).

Como vimos en el apartado anterior esta herramienta nos permite crear un hipervínculo. Para hacerlo nos situamos en el punto en el que queremos insertar el hiperenlace, que también puede ser una imagen y a continuación pulsamos sobre el botón de esta herramienta. Aparecerá una ventana como la siguiente.

14

En el campo URL ponemos la dirección web a la que queremos enlazar, incluyendo https:// o http://. Si no nos interesa esta opción la usamos o si no podemos elegir la opción de enlazar a contenido ya existente. Nos aparece un listado con los contenidos ya creados y nos permite enlazar con ellos, y nos ofrece un buscador para ayudarnos a localizar uno que nos interese.

En texto del enlace aparecerá el texto que hemos seleccionado en nuestro artículo para crear el hiperenlace. Si lo cambiamos aquí también cambiará en el origen. Y si nos interesa que el contenido enlazado aparezca en la pestaña actual o en otra diferente lo indicamos en la casilla que nos ofrece para tal fin.

Los usuarios podrán distinguir el texto que tiene un link a otro lugar porque se resalta en un color diferente, anaranjado en la imagen siguiente, por ejemplo (eso podría venir definido en la plantilla y se podría cambiar). Además el cursos cambia de la flecha a la mano para indicarnos que podemos pulsar en ese punto.

Añadiendo imágenes.

A la hora de insertar una imagen en un artículo tenemos que posicionar el cursor en el punto donde queremos colocarla y a continuación pulsamos sobre el botón “Añadir objeto”.

Se nos abrirá una ventana como la que se muestra en la imagen superior en la que nos da dos opciones para subir la imagen, o bien la arrastramos y soltamos sobre esta pantalla o pulsando 15

sobre “Seleccionar archivo”, lo cual nos abrirá un navegador de archivos que nos permitirá localizar y seleccionar la imagen deseada en nuestro sistema de archivos. Una vez seleccionada la imagen pulsamos sobre “Insertar en la entrada” (botón verde en este caso).

Esto hará que se abra la pestaña “Biblioteca multimedia” en esta misma ventana. La imagen seleccionada aparecerá con una marca.

En la parte de la derecha se nos ofrecerá cierta información sobre la misma, además de una serie de campos que debemos tener en cuenta para completarlos con la información que nos interese.

Título  El texto que aparecerá si el usuario mantiene el puntero del ratón sobre la imagen unos momentos.

Leyenda  Es el texto que aparecerá en el pie de la imagen. Es opcional. Se pueden emplear etiquetas html. En el caso de necesitar cambiar la posición de la imagen dentro del artículo debemos borrar la leyenda, mover la imagen y volverla a escribir, o de lo contrario no nos dejará modificar la posición.

Texto alternativo  Si por alguna razón la imagen no se muestra se visualizará este texto en su lugar. Es empleado por las arañas de indexación de los buscadores por lo que ayuda con el SEO. Descripción  Cuando la imagen se visualiza de forma individual esta descripción aparecerá a su lado (aunque en la prueba no lo ha hecho).

Además podemos decidir el tipo de alineación (derecha, centrar, izquierda, ninguna) de la imagen respecto al texto, modificar su tamaño de forma proporcional y elegir algunos modos de enlace, incluyendo un enlace a otro lugar (personalizado).

16

Finalmente pulsamos sobre el botón “Insertar en el artículo” par que aparezca en la posición que seleccionamos al principio dentro del artículo.

Si deseamos hacer cualquier modificación sobre los parámetros que le hemos dado a la imagen la hacer click sobre ella aparecerá un pequeño menú que nos permitirá de forma rápida modificar la alineación o bien editarla para cambiar el resto de las opciones.

Para modificar su posición podemos seleccionarla y arrastrarla hasta la misma posición, salvo que, como se indicó más arriba, que tengamos puesta la leyenda a la imagen.

Galería de imágenes.

Podemos crear galerías de imágenes en nuestros artículos. Esto mostrará miniaturas de las mismas y al ser seleccionadas por el usuario se mostrarán en su tamaño real.

Para crear las galerías se procede de forma similar a como se hace para insertar una imagen, a través del botón Esta vez marcamos en el menú de la derecha “Crear galería“ y después vamos a seleccionar archivos (no los arrastramos).

17

Seleccionamos todas las imágenes que forman la galería a la vez (manteniendo la tecla “control” pulsada mientras hacemos click sobre ellas con el ratón) y una vez que terminemos aparecerán en la Biblioteca multimedia todas marcadas.

Ahora de la misma forma que hicimos en el apartado anterior, hay que seleccionar cada imagen y ponerle al menos el título y el texto alternativo.

Una vez completada esta tarea pulsamos sobre crear una nueva categoría y nos aparecerá la ventana del editor de galería. Aquí podemos cambiar el orden arrastrando las imágenes hasta la posición que nos interese, establecer el número de columnas, si queremos que aparezcan de manera aleatoria o no, si queremos que aparezcan como miniaturas o no, …

Ahora pulsamos sobre “Insertar galería” y ya estará insertada en la posición que seleccionamos previamente. Veremos las imágenes en el tamaño que hayamos seleccionado en los ajustes, pero para que “funcione” de verdad hay que ir a visualizar la página y ahí veremos como al situarnos sobre las imágenes el puntero cambia y al hacer click se visualiza la imagen a su tamaño real.

Archivos Externos.

En el apartado anterior lo que hemos hecho es subir los elementos a mostrar, las fotos en este caso, a nuestro servidor, es decir, a la carpeta wp-content de nuestra instalación de Word Press. Sin embargo hay otra forma de mostrar elementos gráficos o vídeos sin necesidad de subirlos. Lo que se hace en estos casos es “apuntar” a la url del elemento que queremos mostrar, y este se mostrará a pesar de estar en una localización remota.

18

Cuando empleamos recursos de otros lugares debemos asegurarnos que tenemos el permiso del propietario del recurso.

Por ejemplo, supongamos que queremos insertar en nuestro artículo la siguiente imagen que hemos localizado a través del navegador:

Podemos ver en la barra de direcciones la URL de la imagen. La copiamos para pegarla luego en otro lugar en que se nos requerirá. Nos situamos en el punto del artículo donde la queremos insertar y pulsamos sobre “Añadir objeto” en la parte superior.

En la ventana que nos aparece nos vamos a la derecha y pulsamos sobre “Insertar desde URL” y en la nueva ventana pegamos la URL de la imagen que queremos en el espacio indicado para ello.

Al hacerlo veremos que aparece la imagen y que se nos dan algunas opciones de configuración:  

Leyenda – Texto que aparecerá al pie de la imagen.

Texto alternativo - Se verá en caso de que no se muestre la imagen en la página web.

19

 

Alineación respecto al texto.

Enlazado a – Normalmente se puede dejar la opción por defecto.

Una vez terminado la imagen aparecerá en nuestro artículo.

La diferencia con lo mostrado en el apartado anterior es que las imágenes insertadas de esta manera no se mostrarán en la galería de imágenes ya que no se encuentran en ella sino en la ubicación remota.

También podemos insertar vídeos le otros lugares tal como Youtube de forma muy sencilla.

Una vez localizado en vídeo en Youtube pulsamos sobre el botón compartir. Esto nos mostrará unas opciones entre las cuales nos aparece la URL del vídeo para que la copiemos y la peguemos en nuestro sitio web en el lugar donde queremos que se visualice.

20

Con solo hacer esto, Word Press es capaz de reconocer que es una dirección de un vídeo de Youtube y nos lo mostrará directamente sin necesidad de hacer nada más.

Información adicional.

Una vez que hemos añadido contenido a nuestro artículo aún disponemos de una serie opciones que nos ayudan a organizar nuestros contenidos y a mostrarlos de la manera que deseemos. Estas opciones las encontramos a la derecha de la pantalla de edición de artículos, y algunas de los elementos que encontraremos son: 

Categorías: Sirven para organizar los contenidos y cada artículo debe tener al menos una categoría que lo clasifique, aunque se le puedan asignar las que necesitemos, tal como se puede ver en la imagen. Crear una categoría es tan sencillo como pulsar sobre el botón “Añadir nueva categoría”.

También podemos establecer la “jerarquía” de las categorías mediante el desplegable, indicando si una categoría e una sub categoría de otra.



Las etiquetas: Al igual que las categorías nos ayudan a clasificar los contenidos, pero mientras que las categorías se relacionan más con la estructura u organización las etiquetas se refieren al tipo de contenido.

Podemos crearlas sobre la marcha

21

separándolas por comas o bien elegir entre las que ya están creadas. 

Imagen destacada: Nos permite elegir una imagen que identifique el artículo.

En la parte superior hay un botón que indica “Opciones de pantalla”. Si pulsamos sobre él se nos desplegarán otra serie de opciones:

Acciones en lote Podemos realizar modificaciones masivas en artículos, categorías o etiquetas, es decir, realizar modificaciones por lotes. Para hacerlo accedemos al menú “Entradas”, allí podemos, si lo deseamos, filtrar por diferentes opciones mediante los menús desplegables que encontramos en la parte superior, por ejemplo, podemos filtrar para que solo aparezcan los artículos que no tienen una categoría asignada, o que se han creado en una fecha concreta, que tiene una determinada etiqueta, …

Después seleccionamos los artículos que nos interesan y seleccionando la opción “Editar” en el menú desplegable pulsamos en aplicar. Esto nos abrirá una nueva ventana donde podemos ver los diferentes elementos relacionados con los artículos que podemos cambiar por lotes.

22

Si lo que queremos es cambiar una etiqueta o categoría debemos haberla creado previamente. Si modificamos el nombre de una categoría o etiqueta, en todos los artículos veremos que se aplica el nuevo nombre de forma automática.

Publicar artículos Una vez que hemos terminado de crear un artículo podemos acceder, dentro de la misma página de edición, a las opciones de publicación, las cuales se encuentran en un bloque a la derecha identificado como “Publicar.”

Podemos guardar como borrador sin publicarlo aún, o tener una vista previa de cómo quedaría publicado, moverlo a la papelera, o publicarlo ya en este momento.

Por defecto, WordPress almacena los artículos como borradores, no obstante podemos cambiarlo a “pendiente de revisión” si deseamos, por ejemplo, que otra persona le eche un vistazo antes de publicarlo, o cuando la persona que lo ha escrito no tiene permisos de publicación y queda pendiente de que el responsable de supervisarlo lo publique. Si hemos publicado ya el artículo y queremos dejar de hacerlo, basta con volverlo al estado de borrador.

En las opciones de visibilidad, podemos definir el artículo como público, es decir, que será accesible a todo el mundo. Además si marcamos la casilla “Fija esta entrada en la página de inicio” este artículo en particular aparecerá en la página principal sin importar su fecha u orden cronológico.

Normalmente por defecto se ordenan los artículos desde el más reciente hasta el más nuevo, pero esta opción nos permite colocar este artículo en la página principal no importando ese orden. De esta manera si seleccionamos marcamos esa casilla este articulo quedaría pegado, por así decirlo, a la página principal y aparecería antes que los demás.

23

Si editamos la opción “Publicar inmediatamente” veremos que tenemos opción de programar la publicación de forma automática para un día y una hora en concreto.

Una vez publicado el artículo, podemos ver que en la parte superior de la misma página de edición nos lo indica y nos permite visualizarlo directamente en la página web, de esta manera podemos comprobar si queda como esperábamos, y de lo contrario, pulsando en la opción “Editar entrada” en la barra de herramientas superior, volveríamos al modo de edición del artículo.

Crear páginas Si queremos añadir otras páginas con diferentes contenidos podemos hacerlo. Cada vez que creamos una aparecerá una entrada o pestaña dentro del menú principal. Para crear páginas empleamos la opción “Páginas” del panel lateral.

Si añadimos una nueva nos aparecerá un editor de textos similar al que usamos con las entradas, pero sin algunas opciones como categorías, etiquetas, … ya que aquí no son necesarias.

24

La forma en que añadimos contenido a la página es similar a la que empleamos con los artículos, pudiendo emplear, además del texto, imágenes y otros elementos multimedia.

Una vez terminado, al igual que con los artículos pulsamos sobe el botón publicar, y luego sobre vista previa para ver el resultado final.

Podemos ver como hay una nueva entrada en la barra de menús que corresponde a la página que acabamos de crear.

Si quisiéramos eliminarla, se procede de igual forma que con los artículos, salvo que opera desde la pestaña “Página” del menú lateral.

25

Organizar páginas Se pueden crear jerarquías de páginas, es decir, podemos crear subpáginas de otras, lo cual se mostraría como submenús de las diferentes opciones principales de la barra de menún de nuestro sitio web.

Podemos crear la jerarquía en el mismo momento de crear la página con las opciones que aparecen a la derecha del editor como “Atributos de página”. Entre las opciones del menú desplegable podemos ver “Sin superior”, que indica que la página sería la primera, que no cuelga de ninguna otra, o bien podemos indicar que esta página que estamos creando tiene como superior una de las que ya hemos creado. Además si hay varias subpáginas asignadas a una misma página podemos ordenarlas asignándolas un número de orden, siendo el valor “0” la primera y de ahí irían descendiendo con los siguientes valores (1, 2, …)-

26

Podemos hacer lo mismo desde la opción “Página  Todas las páginas” en las opciones del panel de control de la derecha, seleccionando la “Edición rápida” de la página que nos interese.

Podemos ver que desde el menú “Paginas” la subpágina aparecerá marcada con un guión y se colocará bajo su página superior (Contacto en este caso).

En nuestro sitio web al colocar el cursor sobre en el menú “Contacto” se desplegará y nos mostrará los submenús, en este caso “Nuestras tiendas”.

17 Plantillas de páginas Dependiendo de la página de diseño que utilicemos, podemos tener opciones plantilla de página que modificarán la forma en que se visualizan en nuestro sitio. No todas las plantillas de diseño ofrecen estas opciones.

27

En este caso la plantilla de diseño ofrece 3 opciones: 

Plantilla predeterminada:



Full Width:

28



Left Sidebar:

Como podemos ver cada opción cambia totalmente la forma en que se muestra la misma página en nuestro sitio web.

Pero como ya se ha dicho, esto dependerá de las opciones ofrecidas por cada plantilla de diseño.

18 Modificar la página de inicio Por defecto la página de inicio que WordPress coloca por defecto es la página de blog. En algunas ocasiones nos puede interesar que no sea así y tener una página estática como página de inicio. Para ello tenemos que crear, por un lado, la página que queremos colocar como página de inicio, y por otro lado, una página a la que pondremos solo el título que le queramos dar y que el resto estará en blanco y que actuará como contenedor de la página de blog. Una vez tengamos estas dos páginas creadas vamos al menú Ajustes  Lecturas.

29

Aquí encontramos las opciones que se muestran en la imagen anterior. Necesitamos cambiar la opción por defecto “Tus últimas entradas” por “Una página estática”. Luego en el desplegable seleccionamos la página que queremos que sea la de inicio primero, y luego la página donde vamos a colocar el blog. Una vez hecho esto pulsamos sobre “Guardar cambios” y listo.

19 Administrar la librería multimedia Desde la biblioteca multimedia podemos gestionar los diferentes recursos multimedia que podemos emplear en nuestros artículos.

Podemos acceder a la misma a través de la opción “Medios” del panel de control.

La barra superior nos permite alternar entre modo lista o mosaico, además de filtrar de diferentes maneras para obtener la visualización de los elementos deseados.

Más abajo podemos ver los diferentes elementos de nuestra librería con diversa información, como en qué artículo o artículos aparece una imagen, de donde se ha subido, cuando, …

También podemos subir imágenes pulsando sobre “Añadir nuevo” y estas no necesitan estar vinculadas a ningún artículo.

Si nos colocamos sobre una de las imágenes se nos muestran algunas opciones más, entre las cuales está “Editar”. Si la seleccionamos se nos mostrarán diferentes opciones que podemos modificar sobre la imagen, como puede ser su titulo, o ver el en qué página se muestra, añadir una descripción, leyenda, texto alternativo, nos informa sobre el formato, tamaño, …

30

Justo debajo de la imagen hay un botón “Editar imagen”, que al pulsarlo nos mostrará opciones nuevas que nos permiten realizar cambios en la imagen como redimensionar, voltear, recortar, …

También nos permite determinar si los cambios se aplicarán solo a la miniatura, a todos los tamaños o a todos los tamaños menos a la miniatura.

Una vez terminado debemos pulsar sobre “Guardar”.

31

20 La forma en que WordPress trabaja con las imágenes Cuando queremos insertar una imagen en nuestro artículo una de las opciones que se nos da desde la biblioteca de imágenes cuando seleccionamos la que nos interesa es el tamaño con que la queremos insertar.

Cuando seleccionamos tamaños diferentes de imagen WordPress almacena junto a la imagen original una copia con el nuevo tamaño. Esto ayuda a optimizar el funcionamiento ya que no obliga al navegador a cargar una imagen grande para visualizar solo una miniatura.

Los tamaños que vienen predefinidos para los tamaños medios y pequeños los podemos modificar dentro de las opciones “Media Settings” del panel de control.

21 Instalación de pluggins Los pluggins son pequeños porgramas que se pueden instalar en WordPress y que añaden funcionalidades adicionales o modifican las existentes. El lugar ideal para descargarlos es la sección de pluggins en www.wordpress.org. Debemos ser cuidadosos e instalar solo aquellos 32

que sean de fuentes de confianza. También tenemos que tener en cuenta que unos son gratuitos pero otros son de pago.

Desde la opción “Pluggins” del menú del panel de control podemos acceder a las opciones de configuración de los mismos.

Podemos ver los que tenemos instalados. Estos pueden estar activos (funcionando) o desactivados (instalados pero no funcionando). Nos permite borrarlos, algunos podemos editarlos, y además nos informa si hay actualizaciones de los mismos. Tenemos además

33

información sobre su desarrollador y nos muestra más detalle sobre lo que hacen si pulsamos sobre “Ver detalles” Si deseamos instalar alguno nuevo pulsaremos sobre el botón “Añadir nuevo” que se encuentra en la parte superior.

Aquí nos permitirá instalar uno de forma manual (“Subir pluggin”) o bien localizar uno del sitio de WordPress.org. Nos permite buscar uno por nombre, si lo sabemos, o buscarlo según diferentes clasificaciones e instalarlo desde ahí.

22 Pluggins recomendados Algunos pluggins interesantes para nuestro sito WordPress podrían ser los siguientes:         

Jetpack de wordpress.com Funciona como un contenedor de una serie de pequeños plugins que se pueden configurar y activar individualmente.

Akismet  Sirve para filtrar los comentarios spam dentro de tu sitio web. Tiene un porcentaje de 99.8 por ciento de aciertos al momento de detectar los comentarios spam. Es de pago.

SEO  Para optimización en motores de búsqueda. Para este propósito podemos usar dos plugins, uno es el plugin all in one seo y existe uno más avanzado llamado seo by yoast.

Copias de seguridad del sitio  wp-db-backup o wordpress backup to dropbox.

Wptouch  Permite adaptar los contenidos para dispositivos móviles.

Contact form 7  Permite crear formularios de contacto.

Fancybox  Mejora la visualización de elementos multimedia (fotos y vídeos) en el sitio web.

Wp-pagenavi  Muestra un menú o índice para mejorar la navegación por las diferentes entradas del blog.

Yet another relate post plugin  Muestra enlaces relacionados con el contenido que el usuario está visualizando en este momento y que por consiguiente podrían ser de su interés.

34

23 Formularios de contacto Con mucha frecuencia será interesante que los usuarios se puedan poner en contacto con nosotros. El poner nuestro e-mail en el sitio web puede ser un problema ya que podemos ser inundados por spam. Lo mejor es utilizar formularios. Como se comentó en el apartado anterior, un buen pluggin para ese fin sería “Contact form 7” el cual podemos instalar de forma sencilla, solo necesitamos poner el nombre en el buscador de pluggins de WordPress y este nos lo localiza. Para instalarlo tan fácil como pulsar sobre “Instalar ahora”.

Una vez instalado tendremos que activarlo y entonces nos aparecerá una nueva opción en el menú del panel de control. No todos los pluggins se colocan en el mismo sitio, por eso es interesante leer previamente la documentación.

La configuración de este pluggin no es muy complicada pero requiere de una serie de pasos, los cuales se entenderán mejor a través de este vídeo: https://www.youtube.com/watch?v=UPt3LfYz7Lk

24 Actualizar pluggins WordPress nos avisa de que hay disponibles actualizaciones, entre ellas las de los pluggins. Como vemos en la imagen, aparece un

35

círculo de color llamativo con un número que nos indica la cantidad de pluggins que tenemos instalados y que disponen de una actualización.

Al entrar en la sección de pluggins podremos ver cuales son ya que aparecen resaltados.

Actualizarlos es tan sencillo como pulsar sobre “Actualizar ahora”. No obstante si pulsamos sobre “Ver detalles” se nos mostrará cuales son los cambios en la nueva actualización respecto a la anterior.

25 Administrando las plantillas En WordPress los contenidos y el diseño son independientes entre si. El contenido se encuentra en una base de datos y se muestra sobre una plantilla que es la que determina el diseño. Podemos pues cambiar el diseño sin poner en riesgo el contenido. Hay plantillas pensadas para diferentes tipos de contenidos, blog, revistas, fotografía, .. es cuestión de elegir la más adecuada a nuestras necesidades dentro del amplio abanico de posibilidades.

36

Las plantillas se gestionan dentro del menú “Apariencia  Temas”. Normalemente WordPress trae una serie de plantillas por defecto, pero es muy sencillo añadir más.

Al seleccionar cualquiera de ellas veremos que se nos ofrece una pequeña descripción de la misma, así como dos botones en la parte de abajo, uno para vista previa y el otro para activar la plantilla.

Si queremos ver una vista previa de cómo quedaría nuestro sitio web con esa plantilla se nos mostrará, así como una serie de opciones que dicha plantilla tiene para modificar su aspecto (a la derecha en la imagen).

Si nos gusta como queda tan solo tenemos que pulsar sobre “Guardar y activar” y se aplicará a nuestro sitio, siendo entonces visible el nuevo tema por nuestros visitantes, o por el contrario si no nos interesa la descartamos y todo volverá a quedarse como estaba.

37

26 Personalizando la plantilla Una vez seleccionada y aplicada la plantilla a nuestro sitio web podemos personalizarla.

Podemos acceder a las opciones de configuración desde el panel de administración “Apariencia  Personalizar”.

Podremos ver entonces las opciones de personalización de nuestra plantilla, pero hay que tener en cuenta que estas pueden ser muy diferentes de una plantilla a otra, depende de lo que el desarrollador haya dispuesto en cada caso.

En el lado de la derecha podremos ir viendo una previsualización en tiempo real de los cambios, que no serán visibles a nuestros visitantes hasta que los apliquemos.

27 Personalizando la imagen de cabecera La imagen de cabecera es la que se suele mostrar en la parte superior, y puede ser una imagen grande o un logo, depende del diseño de la plantilla, y además no todas las plantillas tienen la opción de mostrar una imagen de cabecera. De tenerla, tenemos que tener en cuenta que el diseñador habrá establecido las dimensiones de la imagen a emplear.

Para modificar la imagen de cabecera accedemos a las opciones de personalización de la plantilla y seleccionamos “Imagen de cabecera”.

38

En la nueva ventana que nos muestra podemos ver que el diseñador nos ha dado indicaciones referentes al tamaño adecuado para la imagen de la cabecera. En este caso lo ideal sería una imagen de 1260x240 pixeles.

Al pulsar para añadir una nueva imagen se nos abrirá la biblioteca multimedia, desde donde podemos seleccionar la imagen que deseemos.

Las medidas indicadas por el diseñador son el tamaño mínimo que debe tener la imagen.

Si elegimos una se mayor tamaño WordPress nos permitirá recortarla.

Es recomendable recortar la imagen salvo en los casos en que esta contenga transparencias que nos interese conservar, ya que WordPress creará un nuevo archivo jpg con la imagen recortada y este formato no soporta transparencias.

Podemos tener varias imágnes de cabecera seleccionada, y en el caso de esta plantilla, por ejemplo, mostrará una diferente en cada ocasión si así lo deseamos.

39

28 Personalizando los menús Los menús son los elementos que nos permiten “navegar” por nuestro sitio web.

Para cambiar o crear los menús de nuestro sitio web accedemos al menú “Apariencia  Menús”.

Se nos mostrarán aquí las opciones que nos permitirán trabajar con los menús de nuestro sitio web. Siempre habrá un menú principal y luego, según la plantilla, podremos crear otros menús.

40

En el espacio de la derecha (“Páginas”) nos muestra los elementos que podemos incluir en los menús, que no solo pueden ser páginas sino que también pueden usar otros elementos como categorías.

En la parte de la derecha podemos ver los diferentes elementos que hemos seleccionado para el menú, y aquí los podemos organizar con tan solo seleccionar el que queramos reubicar y arrastrándolo y soltándolo en la nueva posición, y en el caso querer crear submenús, tan solo hay que desplazarlos a la derecha una vez posicionados bajo el que queremos que sea su elemento padre. Cuando terminemos tan solo debemos pulsar sobre “Crear”. No obstante, como ya se comentó anteriormente, las opciones pueden variar mucho de una plantilla a otra.

El siguiente vídeos explica con más detalle la creación de menús. http://lievanosan.com/lesson/menus-personalizados/

29 Widgets Los widgets son elementos que nos permiten personalizar nuestra página web. En función de la plantilla que estemos empleando podremos tener más o menos opciones de donde colocarlos.

Para acceder a las opciones de widgets nos vamos al panel de administración “AparienciaWidgets”.

En la parte de la derecha podemos ver los lugares en que nuestra plantilla nos permite colocarlos, que en este caso son bastantes, lo que nos permite mucha flexibilidad a la hora de elegir el diseño.

41

Por defecto se colocan en la barra lateral derecha, podemos ver cuales tenemos actualmente instalados (Buscar, Entradas recientes, Comentarios recientes, Archivos, …).

En el lado izquierdo podemos encontrar los widgets que están disponibles.

Para personalizar nuestra página, solo hay que arrastrar los que nos interesen desde el lado izquierdo hacia la derecha, hasta ubicarlos en el emplazamiento donde deseemos que se muestre. También podemos organizar el orden en que se muestran de forma similar a como se hacía con los menús o incluso los podemos recolocar a otra posición cuando ya está colocado en una posición. En el caso de querer eliminarlos los seleccionaremos y lo desplazaremos hasta la parte izquierda.

Podemos encontrar opciones de configuración de cada widget pulsando sobre el pequeño triángulo de la parte derecha de cada elemento.

42

30 Instalando plantillas desde el directorio de WordPress El mejor lugar para ver las plantillas disponibles para WordPress es: https://wordpress.org/themes/ Aunque hay muchos otros más sitios disponibles tanto gratuitos como de pago.

Para gestionar nuestras plantillas tenemos que ir al panel de control “AparienciaTemas”. Aquí se nos mostrarán los temas o plantillas que tenemos actualmente instalados en WordPress, pudiendo cambiarlos fácilmente sin que eso afecte a nuestros contenidos.

43

Seleccionando el que nos interese y pulsando en “Ver vista previa” se nos mostrará cómo queda dicha plantilla en nuestro sitio y veremos también a la izquierda las diferentes opciones de personalización de la plantilla. Si no interesa podemos modificar lo que nos interese y si nos convence podemos pulsar sobre “Guardar y activar” para que se aplique en nuestro sitio web.

Si en lugar de esto hubiéramos seleccionado “Añadir” nuevo en el menú de temas de WordPress, se nos muestran las opciones para localizar el que nos interese ya sea filtrando por el nombre, por destacados, populares, recientes, características, …

Si seleccionamos cualquiera de ellos nos dará la opción de instalar o previsualizar y si elegimos esto último se nos abrirá una página con las características básicas de la plantilla.

44

31 Instalando y subiendo nuestras propias plantillas Podemos encontrar plantillas para WordPress en muchos sitios, las cuales nos podemos descargar ya sea de forma gratuita o comprándola. El archivo ha de estar en formato .zip para que se pueda instalar en WordPress. Una vez la tenemos para instalarla volvemos al panel de control y seleccionamos “AparienciaTemas” y luego en la parte superior “Añadir nuevo”. Otra vez en la parte superior encontramos “Subir tema” y es lo que seleccionaremos.

Al hacerlo, se nos mostrarán instrucciones para localizar el archivo dentro de nuestro equipo, se subirá y luego nos dará la opción de instalar. Si lo hacemos, si todo es correcto la nueva plantilla se nos mostrará en la sección de temas con todas las demás.

Podemos ver la vista previa y personalizarla como con el resto de las plantillas, todo igual.

Es importante instalar solo plantillas de sitios de confianza ya que puede ocurrir que encontremos plantillas contengan software malicioso. En todo caso, siempre podemos recurrir al foro oficial de WordPress para buscar consejo.

45

46