Curso WordPress: Widgets, añadiendo contenido y funcionalidad a nuestros sidebar o barras laterales en WordPress

El diseño web va cambiando conforme pasan los años y surgen nuevas tendencias. Sin embargo, podemos decir que a la larga se repiten una serie de estructuras, que podríamos llamar necesarias. En este curso ya hemos hablado de varias de estas estructuras, como los menús o las cabeceras; de otras no lo hemos hecho tan directamente pero sí es cierto que hemos tratado como manejarlo de forma indirecta, la parte “principal” con el contenido, que lo manejamos con las entradas o las páginas.

Nos queda otro elemento verdaderamente importante, podríamos decir que es el actor auxiliar o de reparto, ese que no es el protagonista pero que sin su presencia la película no podría hacerse. Hablamos de las barras laterales y los pies de página.

¿Qué suele haber en las barras laterales y los pies de página?

Depende mucho del sitio pero por norma general podemos encontrar cosas como:

  • Los últimos comentarios que ha habido en el sitio
  • Un mapa con la localización de la empresa
  • Interacciones sociales: pueden ser últimos tweets o un cuadro para hacer “Me gusta” en la página de Facebook
  • Un pequeño formulario de contacto
  • Los productos más vendidos en una tienda online con WooCommerce

Entre otras cosas. Si queréis usar estas características, necesitaréis usar un widget.

¿Qué es un widget?

Más bien deberíamos decir que es un widget en WordPress porque si, por ejemplo, usáis Android, sabréis que hay widgets para el escritorio del móvil. En el caso de WordPress los widgets son:

Elementos que añaden contenido y funcionalidad a nuestras barras laterales o sidebars

Como veis, esta definición, si no has manejado nunca antes WordPress es demasiado escueta. ¿Qué son las barras laterales? Realmente, para usar el término internacional, las llamaremos sidebars y aunque su nombre dé lugar a generar dudas, las barras laterales no tienen por qué ser una barra, ni tampoco estar en un lateral; aunque normalmente ambas afirmaciones sean correctas.

Al igual que generábamos menús en contenedores para menús especificados por el theme, cada theme, deja unos sitios preparados para alojar widgets, esos sitios son los sidebars y suelen estar situados en las barras laterales y los pies de página

Los widgets fueron diseñador originalmente para ofrecer a los usuarios de WordPress una forma sencilla de manejar el diseño y la estructura del sitio. La idea era y sigue siendo:

  • No manejar código
  • Poder configurar cada widget de forma independiente
  • Modificar el orden y el sitio donde se muestran los widgets a base de usar sólo el ratón (básicamente hacer un movimiento de arrastrar y soltar)
  • Y poder crear nuevos widgets en caso de ser necesario (esto ya es programación y es algo que en Codection hacemos a menudo)

Como un ejemplo vale más que toda la explicación, y más aún si es una imagen, os voy a enseñar unos widgets que tenemos en este portal en el pie de página:

Codection   WordPress  WooCommerce  tiendas online  plugins a medida  themes a medida

 

Como ves tenemos 5 widgets, distribuidos en 4 columnas, en donde mostramos diferente información que consideramos de utilidad, además de permitir contactar con nosotros por un formulario de contacto.

¿Cómo manejamos los widgets en WordPress?

Como veis los widget son elementos “secundarios” del portal, pero que tienen especial importancia porque aparecen en multitud de páginas y son siempre elementos auxiliares que pueden facilitar por ejemplo la conversión, de un visitante en un comprador, en nuestra caso por ejemplo a través del formulario de contacto.

Los widgets tienen tres características que los hacen muy potentes:

  • Flexibles: existen widgets para multitud de tareas, seguro que encuentras el que necesitas
  • Fáciles de usar: arrastrar y soltar es algo amigable, para manejar widgets básicamente sólo hace falta eso
  • Ampliables: siempre alguien podrá hacerte el widget que necesitas para tu portal

Veamos lo fáciles que son de usar, empecemos por lo básico, esta explicación es válida tanto para un WordPress autoalojado como para WordPress.com:

  • Dentro del escritorio WordPress
  • Accedemos a “Apariencia”
  • Posteriormente a “Widgets”
  • Aparece una pantalla dividida en dos

Cada parte se corresponde a:

  • Parte izquierda: widgets que tenemos disponibles, serán más conforme los plugins o themes que tengamos incluyan nuevos widgets
  • Parte derecha: los sidebars que tenemos donde podemos dejar widgets. En este caso tenemos sólo uno pero puede haber ninguno (lo cuál es raro) o varios, incluso en algunos themes hay un generador de nuevos sidebars

Widgets ‹ Blog del Curso WordPress Codection — WordPress

El funcionamiento es sencillo, deberemos escoger de la parte izquierda un widget y llevarlo arrastrando a la parte derecha, al sidebar que elijamos, añadimos también que es importante elegir en qué orden lo queremos, si encima, abajo o entre medias de otros widgets (podréis hacerlo subiendo o bajando el widget con el ratón dentro del sidebar.

Otro método también disponible, es hacer un clic sobre el widget en la parte izquierda y luego, en el panel que se abre, elegir a qué sidebar queremos llevarlo.

Selección_004

Opciones del widget

Algunos widgets tienen opciones, para verlas debemos hacer clic en el triángulo invertido que hay en el extremo derecho del widget, es el mismo método que en el caso de los elementos del menú. Le dais y os aparecerá un formulario donde rellenar las opciones:

Widgets ‹ Blog del Curso WordPress Codection — WordPress

Rellenáis las opciones y le dais a guardar. En caso de querer borrar el widget, al igual que en el caso de los menús, tenemos en la esquina inferior izquierda el botón con forma de enlace para borrarlo. ¿Sencillo no? Si queréis cambiarlo de orden, tenéis que coger el cuadro de ese widget, y sin soltar el ratón, ponerlo por encima del widget superior, en este caso llamado “Enlaces”.

Ya podemos ver cómo queda el widget en la barra lateral del sitio.

 

Si no quieres perderte las siguientes entregas del Curso WordPress dáte de alta gratis en el siguiente formulario:

[wysija_form id=”2″]1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (Ninguna valoración todavía)

Cargando…

Almacenamos las IPs desde la que se envían las valoraciones para evitar fraudes

6

6 thoughts on “Curso WordPress: Widgets, añadiendo contenido y funcionalidad a nuestros sidebar o barras laterales en WordPress

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Carrito