Muchas veces, te hablo sobre plugins, códigos, y demás cosas «chulas», pero a la vez piensas, ¡Pero si no se ni añadir contenido a WordPress!

¿Cómo me voy a atrever a tener mi propio blog?

Por eso, voy a empezar una nueva serie de entradas, todas en la categoría de Blogging para novatos, donde explicare las cosas más sencillas de este mundillo, pero que ninguno sabemos cuando empezamos.

Para empezar, vamos a ver una de las dudas más frecuentes que me llega a soporte, después de entregar algún diseño de página web.

Cómo agregar contenido a WordPress: Entradas o Páginas

Agregar contenido a tu sitio web es un proceso fácil, sin importar si estás creando una Entrada o una Página.

El procedimiento para ambos es casi idéntico.

La diferencia principal es que las Entradas te permiten asociar Categorías y Etiquetas, mientras que las Páginas no.

¿Cuál es la diferencia entre categorías y etiquetas?

Por lo general, las Etiquetas son palabras clave para identificar información importante en sus Entradas (nombres, asuntos, etc.), que pueden o no ser recurrentes en otras Entradas, mientras que las Categorías son secciones predeterminadas.

Si se piensa el sitio como un libro, las Categorías son como un Índice de contenidos y las Etiquetas son como los términos dentro del índice.

Las categorías son los temas que vas a tratar en tu blog. Por ejemplo ejercicios para adelgazar.

Las etiquetas son sub-apartados más específicos para cada tema y que podrían ser transversales. Por ejemplo abdominales, spinning, salir a correr.

Agregar una página nueva

Para agregar una Página nueva, pon el puntero del ratón sobre la opción Páginas del menú de navegación de la parte izquierda y en el menú emergente haga clic en el enlace Añadir nueva.

Como alternativa, puedes hacer clic en la opción Páginas del menú y luego hacer clic en el enlace Añadir nueva que aparece debajo, o el botón Añadir nueva en la parte superior de la página.

Llegarás a una pantalla como esta:

Agregar una entrada nueva

Para agregar una Entrada nueva, pon el puntero del ratón en la opción Entradas del menú de navegación de la parte izquierda y en el menú emergente haga clic en el enlace Añadir nueva.

Como alternativa, puedes hacer clic en la opción Entradas del menú y luego hacer clic en el enlace Añadir nueva que aparece debajo, o en el botón Añadir nueva en la parte superior de la página.

Cómo ves, opciones muy similares a las anteriores.

Y llegas a esta pantalla:

Agregar contenido con el editor visual

El editor empleado para ingresar contenido a las Páginas o Entradas es muy fácil de usar.

Es muy parecido a cualquier procesador de textos, como el conocido Word, con botones en la barra de herramientas que te permiten poner formato al texto en Negrita o Cursiva; o poner Encabezados y viñetas.

Hasta puedes utilizar la mayoría de los atajos de teclado usados en otros editores de texto.

Por ejemplo: Mayusculas+Enter inserta un salto de línea, Ctrl+C/Cmd+C = copiar, Ctrl+V/Cmd+V = pegar, Ctrl+Z/Cmd+Z = deshacer, Ctrl+Y/Cmd+Y = rehacer, Ctrl+A/Cmd+A = seleccionar todo, etc. (usa la tecla Ctrl en un PC o la tecla Cmd en un Mac).

Lo que nunca te recomiendo es que cambies el tamaño de fuentes, o de colores, ya que de eso se debería de encargar el CSS (o estilo), de tu tema. Si no el día que cambies de diseño, todo seguirá igual.

Básicamente, solo te recomiendo editar el formato para:

• Agregar negritas, cursivas o subrayados.
• Listas numéricas o de viñetas
• Títulos h2, h3, h4 (el h1 se supone que lo será el título de la entrada o página).

Si puedes evitarlo, no uses ningún shortcode. Como alternativa, si puedes usar un plugin como Crazy Pills.

Y nunca, nunca, uses editores visuales como Thrive Content Builder para maquetar absolutamente todos tus contenidos. Debes restringirlo a solo alguna entrada o página muy especial, o el día que quieras cambiar de plugin, te las verás y desearás.

Al agregar contenido a la página, el Editor visual se expande para ajustarse al texto, en lugar de simplemente usar el desplazamiento.

Y como si esto fuera poco, no importa cuán largo se torne el Editor visual: los botones de la barra de herramientas permanecerán visibles en todo momento, fijados a la parte superior de la página.

Gracias a los atajos especiales de teclado, agregar contenido ahora es más sencillo. Cuando quieras añadir al contenido encabezados de distinto tamaño, en lugar de tener que seleccionarlo del menú desplegable de la barra de herramientas, ahora puedes comenzar una línea con dos o más signos #, y una vez que pulses Enter para saltar a la línea siguiente, el Editor visual convertirá automáticamente el texto en el encabezado correspondiente.

Al igual que los encabezados, también puedes usar * o – para crear una lista sin ordenar; 1. comenzará una lista ordenada, y > creará un bloque de cita (blockquote).

La lista completa de atajos de teclado disponibles es la siguiente:

• * – Para comenzar una lista sin ordenar
• – – Para comenzar una lista sin ordenar
• – Para comenzar una lista ordenada
• 1) – Para comenzar una lista ordenada
• ## – H2
• ### – H3
• #### – H4
• ##### – H5
• ###### – H6
• > – Para añadir un bloque de cita (blockquote)
• — – Para añadir una línea horizontal
• `..` – Para convertir texto en un bloque de código (reemplazar .. con el texto)

En la parte superior del editor hay dos pestañas, Visual y Texto. Estas permiten alternar la vista de edición entre el Editor visual y el Editor de texto.

La vista de Texto te permite ver el código HTML que forma el contenido.

Para usuarios más avanzados en ocasiones esto puede ser muy útil, pero para aquellos que no están familiarizados con las etiquetas HTML no es recomendable.

Al crear una Página o una Entrada nueva, lo primero que debes hacer es poner un título en el campo superior donde dice Introduce el título aquí.

Tras llevar el cursor hacia el campo del editor se crea un nuevo enlace permanente para la página.

Los Enlaces permanentes son las direcciones fijas de cada una de las Entradas, Páginas, Categorías, etc. Vamos, la que tienes que poner en la barra de direcciones para llegar a esa página.

Cómo se creará en base al título, lo ideal es editar manualmente los enlaces permanentes haciendo clic en el botón Editar que aparece al lado y poner un «slug» o url, más pensado para el SEO.

Una vez modificado, haz clic en Aceptar para guardarlo o en Cancelar para omitir los cambios.

En la parte superior del editor, donde se ingresa el contenido, hay una serie de botones de formato.

Al hacer clic en el botón Desplegar/plegar barra de herramientas (pon el ratón encima de los botones para ver una descripción) se mostrará u ocultará una segunda línea de botones de formato que te proporcionará funcionalidades extra.

Los botones del editor sirven para ejecutar las siguientes funciones:

• Añadir objeto – Se utiliza para subir e insertar objetos de multimedia tales como imágenes, audio, vídeo o documentos
• Negrita – Texto en negrita
• Cursiva – Texto en itálica
• Tachado – Agrega una línea de tachado en el texto
• Lista con viñetas – Crea una lista sin ordenar (viñeta)
• Lista numerada – Crea una lista ordenada (numerada)
• Cita – Se usa para citar una frase. El aspecto de este texto dependerá enteramente del Tema que esté utilizando
• Línea horizontal – Inserta una línea horizontal en la página
• Alineación izquierda – Alinea el texto a la izquierda
• Alineación centrada – Alinea el texto en el centro de la página
• Alineación derecha – Alinea el texto a la derecha
• Insertar/Editar enlace – Se usa para crear un enlace HTML a otra página o sitio web. Si no se selecciona un texto antes, la URL que introduzca también se usará como texto del enlace
• Borrar enlace – Elimina el enlace HTML del enlace seleccionado. El cursor debe estar situado en un enlace activo para que este botón funcione
• Insertar la etiqueta “Leer más” – Inserta la etiqueta More en una Entrada. La mayoría de los blogs solo muestran un extracto pequeño de una Entrada y es necesario hacer clic en el título de la entrada o en el enlace ‘Leer más…’ para continuar leyendo el resto del artículo. Cuando se inserta una etiqueta ‘More’ en una Entrada, todo lo que queda antes de la etiqueta se considera un extracto. La mayoría de las veces solo usará este botón cuando cree una Entrada de blog y no una Página
• Alternar barra de herramientas – Se usa para mostrar u ocultar la segunda fila de botones de formato en la barra de herramientas del editor
• Escritura sin distracción – Al hacer clic en este botón el menú de la parte izquierda y los paneles de la parte derecha se desvanecerán de la vista. Al hacer clic nuevamente en el botón Modo de escritura sin distracción, volverá a ver la pantalla estándar
• Estilo – Se usa para dar formato al texto de la Página, basado en los estilos actuales del Tema
• Subrayado – Texto subrayado
• Justificar – Alinea el texto con márgenes iguales a izquierda y derecha (texto justificado)
• Color del texto – Usado para cambiar el color del texto (no recomendado su uso)
• Pegar como texto – Copiar y pegar texto de otros sitios o procesadores de texto a veces deja el texto con un formato diferente del esperado. La razón es que las etiquetas HTML o códigos originales que dieron formato al texto se han pegado junto con el texto mismo. Para evitar esto, Pegar como texto eliminará todas las etiquetas HTML de formato. La opción Pegar como texto funciona como un conmutador, ya que permanece activado hasta que se desactive al hacer clic nuevamente en el botón, o hasta que guarde el contenido de la página
• Limpiar formato – Use esto para eliminar todo el formato (ej. Negrita, Subrayado, color de texto, etc.) de un texto seleccionado
• Carácter especial – Se usa para insertar caracteres especiales que no son de fácil acceso vía teclado (ej. ¼, ½, ¾, ©, €, ö, etc.)
• Reducir sangría – Elimina un nivel de sangría
• Aumentar sangría – Aplica un nivel de sangría al texto
• Deshacer – Deshace la última acción
• Rehacer – Rehace la última acción
• Atajos de teclado – Muestra información sobre el editor visual de WordPress junto con los atajos del teclado
• Visual/Texto – Alterna la vista de edición entre el Editor Visual y el editor de Texto. La vista de Texto le permitirá ver el código HTML que forma el contenido. Para usuarios más experimentados en ocasiones esto puede ser muy útil, pero para aquellos que no están familiarizados con las etiquetas HTML no es recomendable

Cambiar al editor de texto

Como ya te he comentado, en la parte superior del editor hay dos pestañas, Visual y Texto. Estas permiten alternar la vista de edición entre el Editor Visual y el Editor de texto.

La vista de texto te permite ver el código HTML que forma el contenido.

El Editor de texto es bastante parecido al Editor visual, solo que no es tan intuitivo. Los botones de formato proveen opciones básicas de formato en HTML al momento de editar el contenido de las Páginas o Entradas.

Los botones funcionan de dos maneras. Al hacer clic en un botón sin antes seleccionar un texto, simplemente insertará la etiqueta HTML de apertura perteneciente a ese botón.

Por ejemplo, al hacer clic en el botón Negrita se insertará la etiqueta HTML <strong> dentro del contenido. Al hacer clic en el botón Negrita nuevamente, se cerrará la etiqueta insertando el cierre </strong>.

Si seleccionas un texto antes de hacer clic en el botón, ambas etiquetas, la de apertura y de cierre, se insertarán al inicio y final del texto seleccionado. Por ejemplo, seleccionando el texto ‘frase en negrita’ antes de hacer clic en el botón Negrita, insertará ‘<strong>frase en negrita</strong>’.

Los siguientes botones de edición están disponibles en el Editor de texto:

• Negrita – Texto en negrita
• Cursiva – Texto en itálica
• Enlace – Se usa para crear un enlace a otra página o sitio web. Cuando se hace clic en el botón aparece una ventana emergente donde se ingresa la dirección a la que se quiere enlazar
• Cita – Se usa para citar una frase. El aspecto de este texto dependerá enteramente del Tema que esté utilizando
• Borrar – Se usa para mostrar texto que ha sido borrado. El aspecto de este texto dependerá del Tema en uso, pero por lo general se muestra como tachado
• Insertar – Se usa para mostrar texto que ha sido insertado. El aspecto de este texto dependerá del Tema en uso, pero por lo general se muestra como subrayado
• Imagen – Se usa para insertar una imagen en el contenido. Cuando se hace clic en el botón aparece una ventana emergente donde se ingresa la dirección de la imagen que se quiere insertar
• Lista sin ordenar – Crea una lista sin ordenar (viñeta)
• Lista ordenada – Crea una lista ordenada (numerada)
• Elemento de lista – Se usa para insertar un elemento de lista dentro de una lista ordenada o sin ordenar
• Code – Se usa para marcar una porción de código
• More – Inserta la etiqueta ‘More’ en una Entrada. La mayoría de los blogs solo muestran un extracto pequeño de una Entrada y es necesario hacer clic en el título de la entrada o en el enlace ‘Leer más…’ para continuar leyendo el resto del artículo. Cuando se inserta una etiqueta ‘More’ en una Entrada, todo lo que queda antes de la etiqueta se considera un extracto. La mayoría de las veces solo usará este icono cuando cree una Entrada de blog y no una Página
• Cerrar etiquetas – Se usa para cerrar etiquetas abiertas. Por ejemplo, si hace clic en los botones de Negrita y Cursiva para insertar sus etiquetas de apertura, al hacer clic en Cerrar etiquetas se insertarán las etiquetas correspondientes en su orden correcto
• Modo de escritura sin distracción – Al hacer clic en este botón el menú de la parte izquierda y los paneles de la parte derecha se desvanecerán de la vista. Al hacer clic nuevamente en el botón Modo de escritura sin distracción, volverá a ver la pantalla estándar

Cambiar el formato de las entradas

Un Formato de entrada es información adicional que puedes usar dentro de un Tema para aplicar estilos o personalizar la presentación de una publicación.

Todos los temas, incluidos los basados en Genesis Framework tienen esta característica, aunque en la mayoría de blogs no se usa mucho. Por ejemplo yo los tengo desactivados.

La característica de Formato de entrada proporciona una lista estandarizada de formatos que están disponibles para todos los temas que soportan esta opción. No hay requerimientos para que los Temas soporten cada formato de la lista, y pueden introducirse formatos nuevos a través de los temas o de los plugins.

Si tu Tema soporta los Formatos de entrada, puedes elegir la manera en que se verá cada entrada seleccionando un Formato de entrada de la lista de botones de selección, similares a la imagen a continuación. Si su Tema no soporta Formatos de entrada, entonces el panel de Formato no se muestra.

Si bien el contenido actual de la entrada no cambiará, el tema puede usar el Formato seleccionado para mostrar la entrada de manera distinta. Esta manera de mostrar el contenido depende por completo del Tema, pero la siguiente lista de Formatos de entrada disponibles proporciona algunas pautas generales de WordPress en cuanto al estilo que deben adoptar.

• Minientrada – Estilo típico, sin título. Similar a la actualización de una nota de Facebook
• Audio – Un archivo de audio, como un Podcast
• Chat – La transcripción de un chat
• Galería – Una galería de imágenes. La entrada probablemente contenga un código abreviado de galería y tendrá imágenes adjuntas
• Imagen – Una imagen individual
• Enlace – Un enlace a otro sitio
• Cita – Una cita de una frase, probablemente contenida dentro de un blockquote
• Estado – Una breve actualización de estado, similar a una actualización de estado de Twitter
• Vídeo – Un vídeo individual

Comprobar revisiones pasadas

Cuando estás editando una Entrada o una Página, el número de revisiones para esa Entrada o Página en particular se muestra en el panel Publicar, si es que las hay.

Haz clic en el enlace Explora junto al título Revisiones en el panel Publicar para abrir la lista de las distintas revisiones de la Entrada o Página actual.

Use la barra de desplazamiento de la parte superior de la página o haga clic en los botones Anterior y Siguiente para navegar por las distintas revisiones de la Entrada o Página.

El contenido que haya sido borrado estará resaltado con rojo y el contenido que haya sido agregado estará resaltado en verde. Si hay contenido que está resaltado en rojo oscuro y/o verde oscuro, destaca contenido específico que fue eliminado o agregado. Si el párrafo o la línea simplemente aparecen en rojo claro y/o verde claro, entonces el párrafo o la línea enteros han sido afectados por el cambio.

También puede comparar dos revisiones diferentes haciendo clic en la casilla de selección Comparar dos revisiones cualesquiera.

Si desea restaurar una revisión previa, haga clic en el botón Restaurar esta revisión.

Tu Take-Away para hoy

1. Editar entradas y páginas y añadir contenido en WordPress como ves es sumamente sencillo. Comienza tu blog hoy, y comienza a mostrar tus contenidos a todo el mundo.
2. Evita el uso de formatos especiales, códigos cortos, editores de texto avanzados, o maquetadores visuales en exceso, o el día que tengas que cambiar de tema o plugin, y te toque editar todas tus entradas, te acordarás del consejo que te doy hoy.
3. Usa siempre una imagen destacada. Será la que se comparta por defecto en redes sociales, y ayudará a que la entrada se vea mejor en la página blog, o archivos.