En WordPress hay momentos en los que necesitamos colocar una función dentro de una página sin montar todo el código a mano. Puede ser un formulario, una galería, una tabla, un botón o cualquier elemento que venga añadido por otro plugin. Para eso existen los shortcodes en WordPress.
Un shortcode es una instrucción corta que WordPress reconoce y convierte en contenido o en una función. Suele verse con una estructura como [ejemplo] y podemos colocarlo en una entrada, una página, un widget o cualquier zona que permita procesarlo.
La ventaja es que no tenemos que repetir el mismo código una y otra vez. Si un plugin nos da un shortcode para mostrar un formulario en WordPress, basta con copiarlo en la página donde queramos que aparezca. Además de los que incluyen WordPress y otros plugins, también encontramos plugins Shortcodes para WordPress pensados para ampliar este sistema. Algunos permiten crear botones, pestañas, acordeones, columnas, cajas destacadas, vídeos o contenidos que se muestran bajo ciertas condiciones.
Esto puede venir bien cuando repetimos una misma sección en varias páginas. Por ejemplo, podemos preparar un aviso, una llamada a la acción o un bloque de contacto y reutilizarlo siempre que haga falta.
En algunos casos, el contenido se gestiona desde un único lugar. Así, si más adelante cambiamos un texto o un enlace, no tendremos que entrar en todas las páginas donde se está mostrando. Eso sí, conviene llevar cierto orden. Si acumulamos muchos shortcodes y después eliminamos el plugin que los genera, pueden quedar shortcodes huérfanos visibles dentro del contenido o funciones que dejan de mostrarse.
Por eso, lo mejor es utilizar solo los que en realidad necesitamos y tener claro qué plugin está detrás de cada uno.
Tabla de contenidos
Los shortcodes ¿Que son?
Los shortcodes pueden también ser llamados como accesos directos que permiten a los usuarios agregar funciones extras a los sitios web. Estos tienen una forma de escribirse específica y WordPress, a través de un plugin que se tenga activo o de forma directa del core del mismo, interpreta este shortcode para ser convertido en contenido visible en nuestros sitios.
WordPress nos da una facilidad para poder insertar algunos shortcodes predeterminados y pueden ser utilizados en cualquier sitio que estemos construyendo. Sin contar que él, muchos de los desarrolladores de temas y plugins WordPress pueden utilizar esta API que ofrece WordPress para que podamos agregar shortcodes de sus propios plugins o temas de WordPress a nuestro sitio.
Con la utilización de estos shortcodes es posible agregar de una forma más fácil el contenido de nuestro sitio de forma dinámica, como por ejemplo incrustar videos, música, imágenes, documentos y cualquier material multimedia, también podremos agregar formularios de contacto de WordPress, carruseles, galerías de imágenes en WordPress y contenido adicional a páginas.
Los shortcodes nos ofrecen la posibilidad de agregar un código personalizado a nuestro sitio web de tal forma que podamos agregarle características personalizadas al sitio, y así incluirle lo que necesitemos para poder brindar un buen contenido en esta misma, sin tanto trabajo de codificación y programación.
Es posible que usemos los shortcodes para insertar el mismo elemento con diferentes estilos, solo agregando ciertos parámetros adicionales que pueden estar estipulados en la documentación del mismo. Un ejemplo de esto no es más que un cuadro de mensaje de información en donde, al cambiar los colores, podemos dar la sensación diferente, como por ejemplo mensajes de peligro, advertencias, información y alertas.
Temas de WordPress que trabajan con shortcodes
En algunos temas de WordPress, estos trabajan de forma directa con algunos shortcodes integrados para la personalización del sitio, esto es habitual en algunos temas que son, en gran medida comerciales. Es decir, si estamos en la necesidad de cambiar el tema en WordPress, nos vamos a encontrar con algunos problemas de pérdida de información, ya que estos shortcodes que son utilizados por el tema solo son interpretados por el mismo. Un ejemplo práctico y de fácil entendimiento serían los idiomas; si tomamos una persona que habla español, su entendimiento se basará en contenido en español (shortcodes del tema). Otra persona, o en este caso otro tema que hable un idioma diferente, no podrá comprender estos shortcodes que están en el sitio, por lo que esa información se verá con código hasta que volvamos a activar el tema que sí lo lee.
Los plugins de shortcodes funcionan de manera un poco diferente, ya que le permitirán agregar códigos abreviados que permanecerán activos incluso si cambiamos de tema.
Es importante tener en cuenta que la mayoría de temas comerciales que tienen plugins de creación de páginas o plantillas ofrecen shortcodes para este funcionamiento. Solo hay que tener esto en cuenta, para un momento que cambiemos nuestro sitio, tengamos en cuenta el contenido fuera de estos shortcodes.
Formatos de shortcodes y tipos
No todos los shortcodes tienen que verse igual. Algunos son muy simples y otros aceptan datos extra para cambiar lo que muestran.
El caso más básico sería algo así:
[ejemplo]Lo pegamos en una entrada, una página o cualquier zona donde WordPress pueda interpretarlo, y listo. No necesita más opciones porque su función ya viene definida.
Otros shortcodes permiten añadir pequeños ajustes dentro de la misma etiqueta. Estos valores se conocen como parámetros del shortcode y permiten personalizar el resultado sin tener que crear una función diferente para cada caso.
Por ejemplo:
[boton color="azul" tamaño="grande"]Aquí estamos usando el mismo botón, pero indicamos cómo queremos que se muestre. El plugin puede aceptar valores para el color, el tamaño, la posición, una categoría o cualquier otro dato que tenga disponible. Los shortcodes de WordPress pueden recibir este tipo de parámetros para modificar de forma dinamica el contenido que generan.
De esta forma podemos reutilizar un mismo shortcode y cambiar algunos detalles según la página donde vayamos a colocarlo. Este sistema también puede combinarse con campos personalizados en WordPress cuando necesitamos mostrar información diferente según el contenido.
También hay shortcodes que trabajan con una apertura y un cierre, algo parecido a esto:
[aviso]Contenido que queremos mostrar[/aviso]
En este caso, el contenido queda dentro del propio shortcode. Puede ser un texto, una imagen o incluso otro bloque. Este formato suele usarse para crear avisos, pestañas, acordeones, columnas o secciones con un estilo concreto.
A veces podemos combinar varios shortcodes entre sí:
[columnas][columna]Contenido 1[/columna][columna]Contenido 2[/columna][/columnas]
Esto permite montar estructuras un poco más completas. Eso sí, antes de hacerlo conviene comprobar que el plugin admite este tipo de combinaciones, porque no todos permiten colocar un shortcode dentro de otro.
Hay plugins que incluso nos evitan escribirlos a mano. Elegimos las opciones desde una ventana o desde el panel y la herramienta genera el código que luego tenemos que pegar. Esto viene bastante bien cuando el shortcode lleva muchos parámetros. Por ejemplo, herramientas como Shortcodes Ultimate permiten seleccionar y configurar distintos elementos antes de insertar el shortcode correspondiente.
Podemos encontrarnos, por ejemplo, con shortcodes que:
- Ejecutan una función.
- Aceptan parámetros para cambiar el resultado.
- Rodean un contenido con una etiqueta de apertura y otra de cierre.
- Se combinan con otros shortcodes.
- Muestran datos que cambian según la página, el usuario o la información guardada en WordPress. Por ejemplo, podemos utilizarlos para mostrar contenido según el usuario.
No hace falta complicarlo más de la cuenta. Si queremos mostrar algo sencillo, un shortcode básico suele bastar. Cuando necesitamos controlar más detalles o construir una estructura concreta, podemos recurrir a los otros formatos.
Cómo se usan los shortcodes en WordPress
Si en nuestras instalaciones tenemos el antiguo editor clásico, es bastante sencillo, solo podemos agregar estos shortcodes donde los necesitemos, solo es agregar por ejemplo el shortcode de video y dejar una separación del texto para que quede estético. Si, por el contrario, tenemos el editor de Gutenberg, el proceso cambia un poco, pero resulta igual de sencillo aplicar esto mediante el módulo que ofrece que se llama Shortcode.
En este vamos a poder agregar el shortcode para que sea mostrado en nuestro contenido, donde sea que lo necesitemos agregar. De esta forma fácil y sencilla ya podemos agregar los shortcodes.
Como una forma adicional al tener una instalación de Divi, podremos agregar estos shortcodes con el módulo de código.
Plugins de shortcodes en WordPress
No es necesario crear shortcodes a mano cuando en el mercado hay muchos plugins que nos agregan más funciones de shortcode en WordPress. Vamos a repasar un poco unos plugins que podremos utilizar, que se especializan en shortcodes, la mayoría de ellos son de uso gratuito y nos van a poder ayudar a desarrollar nuestro sitio de mejor forma.
Plugin Shortcodes Ultimate
Este plugin proporciona al rededor de 50 shortcodes, con un método de inserción bastante sencillo, drag and drop con una vista previa en vivo. Este puede ser utilizado con el constructor habitual de WordPress, widgets de texto y también en constructores de plantillas personalizadas. Este plugin a diferencia de otros, es gratuito.
Podemos ver aquí una lista de elementos que se pueden agregar en él mismo.
Para utilizarlo, solo debemos ingresar al cuadro de texto en Gutenberg o en el editor de texto y tendremos una opción nueva.
Plugin Shortcoder
Este plugin nos ayudará a asignar de forma rápida y fácil los shortcodes que necesitemos en cualquier tipo de entrada, página y plantilla personalizada. El plugin ofrece la posibilidad de crear shortcodes para inserción de HTML, JavaScript y otros tipos de fragmentos de códigos. Solo es cuestión de seguir los siguientes pasos, y podremos tener creado y configurado él shortcode con este plugin.
- Creamos un shortcode haciendo clic en el panel lateral de shortcoder
- Le agregamos un nombre en la página de administración del mismo.
- Pegamos el HTML/JavaScript/CSS y guardamos los cambios.
- Luego, insertamos el código abreviado [sc name =”my_shortcode”] en la publicación o página donde lo necesitemos.
Además de ser un plugin fácil de utilizar, este mismo también tiene múltiples editores: código, visual o texto, así mismo también ofrece una gran cantidad de posibilidades de inserción de variables de WordPress.
Plugin Shortcodes para Divi
Si ya usamos Divi, Shortcodes for Divi nos puede ahorrar bastante trabajo cuando queremos repetir una misma sección en distintas partes de la web. Por ejemplo, podemos crear con Divi un bloque de contacto, una promoción o una llamada a la acción y guardarlo en la Biblioteca. Después, en lugar de volver a diseñarlo cada vez, usamos el shortcode que genera el plugin y lo colocamos donde haga falta.
Esto puede venir bien si estamos revisando plugins Shortcodes para WordPress y nuestra web ya trabaja con Divi, porque no tenemos que aprender otro sistema ni crear los bloques desde cero. El funcionamiento gira alrededor de la Biblioteca de Divi. Guardamos allí el diseño, copiamos su shortcode y lo pegamos en cualquier zona que permita utilizar este tipo de código.
Su funcionamiento es bastante sencillo:
- Instalamos y activamos Shortcodes for Divi desde Plugins > Añadir plugin.
- Accedemos a Divi > Biblioteca de Divi.
- Creamos un nuevo diseño o utilizamos alguno que ya tengamos guardado.
- El plugin añade una nueva columna donde podremos ver el shortcode correspondiente a cada plantilla.
- Copiamos ese shortcode.
- Lo pegamos en la entrada, página, widget o zona compatible donde queramos mostrar el diseño.
Las funciones que podemos tener son:
- Avisos.
- Bloques promocionales.
- Llamadas a la acción.
- Secciones de contacto.
- Diseños que usamos en varias entradas o páginas.
La ventaja está en que el diseño sigue guardado en un solo sitio. Si algún día queremos cambiar un texto, un botón o una imagen, podemos hacerlo desde la Biblioteca de Divi en vez de buscar todas las páginas donde aparece.
Shortcodes predeterminados de WordPress
Entre los shortcodes que tenemos disponibles de forma predeterminada de WordPress tenemos lo siguiente:
[audio] [video] [caption] [embed] [gallery] [playlist]
Como se mencionó antes, WordPress convertirá los shortcodes insertados en contenido según el que agreguemos a nuestro sitio, para más información sobre estos shortcodes predeterminados podemos ver la API de WordPress.
Conclusión
Los plugins Shortcodes para WordPress pueden facilitarnos bastante el trabajo cuando hay elementos que se repiten en varias partes de la web. En vez de copiar el mismo código o montar de nuevo una sección, podemos reutilizarla con una instrucción corta.
WordPress ya trae algunos shortcodes, pero los plugins amplían mucho lo que podemos hacer. Hay códigos sencillos que ejecutan una función, otros aceptan parámetros y algunos permiten encerrar contenido entre una etiqueta de apertura y otra de cierre.
Cada herramienta sigue un enfoque distinto. Shortcodes Ultimate, por ejemplo, incluye bastantes elementos ya preparados. Shortcoder está más pensado para que creemos nuestros propios bloques reutilizables. Si trabajamos con Divi, también podemos encontrar plugins que convierten diseños guardados en la Biblioteca en shortcodes.
Esto viene bien para cosas que solemos repetir avisos, formularios, promociones, llamadas a la acción o bloques que aparecen en distintas páginas. Si el contenido está centralizado, resulta más cómodo hacer cambios sin tener que buscar cada copia.
Ahora bien, conviene saber qué plugin genera cada shortcode. Si algún día lo desactivamos, esos códigos pueden dejar de funcionar e incluso aparecer escritos tal cual dentro de la página. Esto está relacionado con el conocido efecto Lock-in en WordPress, que puede aparecer cuando el contenido depende de un tema o plugin concreto.
Por eso, merece la pena usar nombres fáciles de reconocer y no llenar el contenido de shortcodes que después nadie recuerda para qué sirven. Un poco de orden aquí puede ahorrar bastante tiempo cuando toque hacer mantenimiento en WordPress.
Los shortcodes siguen siendo una forma práctica de insertar funciones o reutilizar contenido en WordPress. Si usamos solo los necesarios y elegimos bien la herramienta, pueden simplificar varias tareas sin complicar la gestión de la web.
¿Te ha resultado útil este artículo?
Equipo de soporte WordPress y WooCommerce en Webempresa.
