¿Qué son los shortcodes en Wordpress?

A menudo, necesitamos personalizar nuestro Wordpress con fragmentos de código muy específicos. Pero, en la práctica, esto puede resultar muy difícil sin la ayuda de algún atajo que nos quite trabajo de encima. Y este atajo son los shortcodes de Wordpress.

Por eso, aquí te explicare en breves términos qué son los shortcodes, cómo se insertan en las páginas web, y cómo crear los tuyos propios para añadir funciones personalizadas.

¿Qué es un shortcode en Wordpress?

Un shortcode en Wordpress es un código de una sola línea que se puede insertar en cualquier parte de una página web para incluir porciones de código con funcionalidades extra.

En otras palabras, son “atajos” que nos facilita la tarea de enriquecer el funcionamiento de nuestras páginas Wordpress sin necesidad de incluir parrafadas de código. De hecho, un misma funcionalidad de puede insertar fácilmente en varias páginas sin necesidad de estar repitiendo una y otra vez el mismo fragmento de código.

Esto facilita mucho la personalización del sitio y permite expandir sus funcionalidades sin grandes dolores de cabeza. No en vano muchos plugins, como WooCommerce por ejemplo, proporcionan multitud de shortcodes para diferentes funciones.

¿Cómo insertar un shortcode?

Lo primero que debes saber, es que los shortcodes se pueden insertar tanto en el editor visual como el HTML. De hecho, el editor Gutenberg te proporciona un tipo de bloque específico para shortcodes, pero igual puedes utilizar cualquier otro editor como el clásico.

Un shortcode se inserta escribiendo su nombre entre corchetes: [shortcode]. Por ejemplo, [woocommerce_checkout]. Cuando insertamos esta línea en alguna página, ya sea usando el editor visual o HTML, estamos añadiendo el proceso de pago en dicha página.

Pero los shortcodes pueden contener parámetros para una mayor personalización, como en el siguiente ejemplo:

[add_to_cart id=’132’]

Esta simple línea muestra no solo el contenido del carrito, sino también la interfaz para cupones y otros elementos del carrito. El valor del argumento “id” se utiliza para mostrar el precio del producto indicado junto con un botón de añadir al carrito.

En teoría, no hay límites en cuanto a la cantidad de parámetros que puede tener un shortcode.

Pero queda una tercera forma de insertar estos atajos, y es utilizando etiquetas de apertura y de cierre. Es decir, siguiendo la sintaxis [shortcode][/shortcode].

Entrada Relacionada

El contenido que se incluya entre ambas etiquetas puede ser recuperado por el fragmento de código al que apunta el shortcode. Por ejemplo, para realizar tareas como mostrar dicho contenido con algún estilo CSS aplicado, o utilizarlo para asignar un valor a una variable interna.

Como es lógico, esta forma de insertar shortcodes también admite argumentos. Y pasarle valores al shortcode a través de argumentos o el contenido entre las etiquetas de apertura o cierres es una cuestión de elección y conveniencia, ya que ambas formas son igual de válidas.

¿Cómo crear shortcodes?

Como vimos, muchos plugins traen shorcodes incorporados. Pero tú puedes crear los tuyos propios para adicionar cualquier funcionalidad extra que desees en tus páginas web.

Para ello, te recomiendo instalar el plugin Code Snippets, que te permite crear fragmentos de código PHP y asignarles un shortcode que luego podrás insertar en cualquier página de tu sitio.

Cuando tengas instalado el plugin, solo tienes que hacer clic en Fragmentos de código en el panel lateral de Wordpress y luego en Añadir nuevo. Te mostrará un editor donde escribir el código.

Le pones el título que desees (este no es el título del shortcode, sino el del fragmento de código como tal), y en el cuadro de abajo escribes tu código.

Para que tengas una idea, te dejo el siguiente ejemplo:

add_shortcode( 'hola_mundo', function () {
 $out = '<p>¡Hola, soy tu primer shortcode!</p>';
 return $out;
} );

Haces clic en el botón Guardar e insertas el shortcode [hola_mundo] en cualquier página que desees. Verás que te sale un párrafo que dice “¡Hola, soy tu primer shortcode!”.

Por supuesto, puedes utilizar funciones PHP con argumentos y hacer un código tan complejo como haga falta. Por eso, te invito a la tarea de investigar más y buscar ejemplos para que te lleves una idea más precisa de cómo hacerlo.

Plugins para insertar Shortcodes en Wordpress

  • Shortcodes Ultimate.
  • Display Posts Shortcode.
  • Amr shortcode any widget.
  • Column Shortcodes.
  • Arconix Shortcodes.

Si te gustó el artículo, compártelo en tus redes sociales o déjame un comentario para saber tu opinión.

Esta entrada ha sido publicada el 27/05/2020 10:30

Etiquetas: Wordpress
Nelson Ochagavía

Especializado en redactar contenidos para SEO en agencia de Marketing Online. Me apasionan escribir sobre cualquier cosa de la que tengo conocimiento, me encanta trasmitir esta información para que todo el mundo pueda estar informado, por ello redacto diariamente en varios blogs, alguno de ellos como hobby, como en este.

Entradas recientes

Enfoca tu estrategia de redes sociales hacia el branding

En el dinámico mundo de las redes sociales, es común encontrar empresarios y marcas que perciben estas plataformas principalmente como… Leer más

¿Qué es el Retail Media? Descubre cómo esta estrategia está transformando el mundo del comercio electrónico

En el mundo del comercio electrónico, cada vez surgen nuevas estrategias y enfoques para promocionar y vender productos. Una de… Leer más

¿Qué es una Venta Cruzada? Descubre cómo aprovechar esta estrategia para impulsar tus ventas

En el mundo de los negocios, es fundamental utilizar estrategias efectivas para aumentar las ventas y fidelizar a los clientes.… Leer más