Imágenes de WordPress

En este episodio de nuestra serie de tutoriales de WordPress, veremos muchas cosas que hacen que WordPress sea impresionante. Primero, tendremos que echar un vistazo a los hipervínculos en WordPress. Cómo los usamos, cómo los creamos y cuáles son algunas de las mejores prácticas. A continuación, comenzaremos a trabajar con imágenes en WordPress. Hay muchas formas de usar imágenes html y tocaremos algunos de los escenarios más comunes. Finalmente, hablaremos sobre las galerías de imágenes, cómo crearlas y cómo puede usarlas en su propio sitio web de WordPress. Llevemos nuestras aventuras en WordPress al siguiente nivel.


Creando enlaces en WordPress

Seguramente estás familiarizado con los enlaces en internet. Al utilizar la capacidad del lenguaje HTML para establecer enlaces a otras páginas en línea, tanto en el mismo sitio web como en otros, creamos la red mundial tal como la conocemos. Para crear enlaces, necesitamos texto de anclaje local, un destino o una ubicación de destino, así como el marcado html adecuado para que esto suceda. Si ya conoce html, esto es bastante fácil de lograr. Incluso si sabe html, WordPress hace que sea más fácil y rápido administrar enlaces dentro de su contenido, tanto dentro del dominio local como a otros sitios web.

Creemos un enlace a WordPress.org para que pueda descargar la última versión de WordPress.

Enlace de inserción de WordPress
¡Fantástico! Hay algunas cosas para tener en cuenta aquí. En primer lugar, debemos resaltar el contenido que nos gustaría vincular en el cuerpo del documento. En la imagen, notarás que la palabra WordPress.org tiene un fondo de color que indica que está resaltada. Cuando haga esto, verá que el icono de enlace en la barra de herramientas está disponible (observe el cursor apuntando al enlace). Luego, una vez que haga clic en ese icono,aparecerá el cuadro de diálogo Insertar / editar enlace como lo ve. Se le presentan algunas cosas que debe completar.

  • URL Este es el destino de la URL a la que desea vincular. En este caso, proporcionamos nuestro enlace dehttp://wordpress.org
  • Título Puede parecer trivial, pero es muy importante completar este campo. Cuando un usuario pasa el cursor sobre un enlace en su documento, recibirá una ventana emergente generada dinámicamente con el texto especificado por este campo. Esto da una indicación de hacia dónde apunta el enlace antes de que el usuario haga clic en él.
  • ¿Nueva ventana? La casilla de verificación le da la opción de elegir si el enlace se abrirá en la misma ventana o en una nueva ventana del navegador.
  • Buscar Si desea vincular contenido existente en su sitio web, puede hacerlo escribiendo en el cuadro de búsqueda para encontrar la publicación que está buscando. Tiene sentido tener enlaces internos tanto para el beneficio de la navegación como para ayudar a los motores de búsqueda a encontrar todas sus publicaciones relevantes.
  • Enviar Cuando esté satisfecho de haber agregado todos los atributos necesarios a su vínculo, presione Agregar vínculo .

Nuestro resultado en el código real del sitio es  <a title="WordPress Open Source CMS" href=”http://wordpress.org/"> WordPress.org </a> . Puede ver que es más rápido y fácil simplemente usar el asistente en lugar de tener que escribir todo el código real, ¡aunque realmente debería saber cómo crear enlaces html a mano si es necesario!


Agregar imágenes a sus publicaciones de WordPress

Imágenes y un toque visual realmente agradable a tu contenido. Ayudan a agregar contexto y, francamente, hacen que su contenido sea más agradable. El texto negro sobre un fondo blanco sin estilo o imágenes no es tan divertido, así que asegúrese de agregar imágenes, ¡muchas! WordPress proporciona algunas formas de agregar imágenes, así que examinemos.

WordPress Agregar imagenLo primero que querrá hacer es colocar el cursor en el contenido donde le gustaría que aparezca la imagen. Vamos a agregar uno al comienzo de la última oración y verá el resultado.

¡Agradable!

Lo que hicimos aquí es que una vez que tuvimos el cursor ubicado donde queríamos la imagen, hacemos clic en el botón Agregar medios en la parte superior de la ventana Agregar nueva publicación y se nos dio la opción de Cargar archivos o elegir de nuestra Biblioteca de medios existente. Ahora, lo que sucede es que, cada vez que carga un archivo desde su computadora, se agrega a su Biblioteca multimedia para que pueda reutilizar las imágenes como mejor le parezca. Puede haber casos en los que una imagen se ajuste a los requisitos de varias secciones de diferentes artículos y no hay nada que le impida usar la imagen de esta manera si lo desea.


Detalles de imagen de WordPressLa segunda parte de esto es que necesita completar algunos detalles sobre la imagen en el panel de la derecha. De hecho, a su derecha, puede ver la captura de pantalla de cómo se verá cuando necesite agregar su imagen. Tenga en cuenta todos los campos que tiene la opción de completar. Es una buena práctica proporcionar todos estos campos si puede. Podemos ver que tenemos campos de URL, Título, Título, Texto alternativo, Descripción, Alineación, Enlace a y Tamaño. Vamos a revisarlos.

  • URL Esta es la dirección donde vive la imagen. La mayoría de las veces esto apuntará a una subcarpeta dentro de su wp-contentcarpeta en el mismo dominio. También puede utilizar un sitio externo para alojar la imagen, aunque en la mayoría de los casos no querrá hacerlo.
  • Título Una vez más, el campo del título puede parecer trivial, pero lo que importa son los detalles, tanto para los usuarios como para los motores de búsqueda. Coloque un texto descriptivo que valga la pena en este campo.
  • Texto alternativo Puede haber ocasiones en que un visitante no pueda descargar la imagen para verla en su navegador debido a una mala conexión a Internet o alguna otra causa. En ese caso, desea proporcionar algún tipo de indicación textual de lo que debería estar en el espacio donde está la imagen. Complete este texto para proporcionar esa opción.
  • Descripción Este es otro campo que es una de esas atenciones a los detalles que debe proporcionar.
  • Alineación Esto te volverá loco hasta que aprendas a trabajar con texto e imágenes juntos en html. Algunas veces querrás que el texto fluya alrededor del lado derecho de una imagen, otras veces a la izquierda. Aún en otros casos, es posible que desee que la imagen ocupe todo el ancho del artículo sin texto. Tendrá que practicar estas opciones de alineación y conocer los tamaños de sus imágenes cuando trabaje con su diseño. La práctica hace la perfección en este caso.
  • Tamaño Puede insertar la imagen a tamaño completo o varios tamaños reducidos como mejor le parezca.

Puede obtener mucho más fantasía con las imágenes que lo que hemos cubierto aquí, pero las imágenes son pequeños retoños resbaladizos, especialmente cuando se entrelazan con texto y html. Cíñete a lo básico, consigue los tamaños y alineaciones de imagen correctos y serás un campista feliz.


Crear una galería de imágenes de WordPress

Hasta ahora, hemos estado usando imágenes para agregar contexto y presentación a nuestro contenido. WordPress también te da la opción de crear una galería de imágenes, y es bastante hábil cómo funciona. Crearemos uno ahora mismo para esta publicación. Querrá hacer clic en Agregar medios, Crear galería y luego seleccionar todas las imágenes que le gustaría incluir en la galería. A continuación, haga clic en Crear galería y le dará la opción de editar algunos de los detalles. Puede especificar el enlace a la ubicación, el número de columnas, el orden y el tipo de miniatura. Echa un vistazo a esta galería que creamos en cuestión de segundos.

¡Increíble!

Otra gran característica de las galerías de imágenes en WordPress es que puede obtener una vista previa y editarlas directamente en el editor visual. Querrá hacer clic en el botón Vista previa desde el widget de publicación para ver realmente la galería en el navegador. Esta es la forma más precisa de ver cómo se muestran las cosas una vez que el artículo se publica. Sin embargo, vamos a imágenes que queremos cambiar un título, cambiar la ubicación del enlace, o simplemente agregar o eliminar una imagen de la galería. ¿Cómo podemos hacer eso? Bueno, si va al editor visual y pasa el cursor sobre la galería en cuestión, tendrá la opción de eliminar la galería por completo o editarla. Elegiremos la edición, y así parece.

Editar galería de WordPress

En la ventana de arriba, puede realizar las modificaciones necesarias para llevar el diseño a donde desea que esté. Este es un ejemplo simplista del uso de galerías, pero puedes experimentar con todo tipo de enfoques sofisticados para darle vida a tu galería. Añaden un toque agradable a su contenido.

Conclusión de los enlaces e imágenes de WordPress

Obtendrá más por su dinero en contenido si le da prioridad a ser increíble al usar enlaces e imágenes en sus publicaciones de WordPress. Después de este episodio, ahora sabes cómo crear enlaces con facilidad. Ya sea que esté vinculando a una fuente externa o configurando algunos enlaces internos agradables, es un profesional de la construcción de enlaces con WordPress. También tiene las habilidades que necesita para agregar algunas imágenes nuevas para darle vida a su contenido. Si te sientes aventurero, incluso podrías armar una dulce galería de imágenes para tu próxima publicación de blog de WordPress.