Qué son los shortcodes

Los shortcodes son una funcionalidad de WordPress que permite insertar de manera sencilla y rápida elementos complejos en una página o entrada mediante el uso de códigos abreviados. Los shortcodes son una especie de «atajos» que permiten incluir elementos como formularios, botones, galerías de imágenes, listas, entre otros, simplemente agregando un pequeño código en el lugar donde se desea que aparezca el elemento.

Los shortcodes suelen tener una estructura sencilla y se componen de una palabra o frase abreviada entre corchetes, como por ejemplo [form], seguida de algunos parámetros opcionales, como [form id=»1″]. Estos parámetros permiten personalizar el shortcode con diferentes opciones de configuración, como el color, el tamaño, la cantidad de elementos, entre otros.

El uso de shortcodes es una manera fácil y rápida de agregar elementos complejos a una página o entrada de WordPress sin la necesidad de tener conocimientos avanzados de programación. Además, su uso mejora la legibilidad del contenido, ya que los shortcodes son fáciles de reconocer y entender.

Aquí te presento algunos ejemplos de shortcodes que se pueden usar en WordPress:

: permite mostrar una galería de imágenes en una página o entrada.
: permite insertar archivos de audio en una página o entrada.
: permite insertar archivos de video en una página o entrada.
[button]: permite crear botones personalizados en una página o entrada.
[list]: permite crear listas de texto o viñetas en una página o entrada.
[code]: permite mostrar bloques de código en una página o entrada.
[divider]: permite crear líneas divisorias entre secciones de una página o entrada.
[form]: permite crear formularios de contacto personalizados en una página o entrada.
[highlight]: permite resaltar texto con diferentes estilos de formato en una página o entrada.
[map]: permite insertar mapas de Google Maps en una página o entrada.
[testimonial]: permite mostrar testimonios de clientes en una página o entrada.
[accordion]: permite crear acordeones de contenido que se pueden expandir o contraer en una página o entrada.
[countdown]: permite mostrar una cuenta regresiva en una página o entrada.
[progress]: permite mostrar barras de progreso de tareas en una página o entrada.
[tab]: permite crear pestañas con contenido diferente en una página o entrada.
[pricing_table]: permite crear tablas de precios en una página o entrada.
[member]: permite crear perfiles de miembros de equipo o de usuario en una página o entrada.
[recent_posts]: permite mostrar una lista de los artículos más recientes en una página o entrada.
[social_links]: permite mostrar enlaces a redes sociales en una página o entrada.
[slider]: permite crear carruseles de imágenes o contenido en una página o entrada.
[map]: permite insertar un mapa de Google Maps en una página o entrada.
: permite insertar un video de YouTube o Vimeo en una página o entrada.
: permite insertar archivos de audio en una página o entrada.
[table]: permite crear tablas en una página o entrada.
[blockquote]: permite destacar una cita o texto en una página o entrada.
[button]: permite crear botones de llamado a la acción en una página o entrada.
[divider]: permite insertar una línea divisoria en una página o entrada.
[highlight]: permite resaltar texto en una página o entrada.
[list]: permite crear listas en una página o entrada.
[tagline]: permite mostrar un eslogan o frase destacada en una página o entrada.
Recuerda que estos son solo algunos ejemplos y que existen muchos más shortcodes

Estos son solo algunos ejemplos de shortcodes que se pueden usar en WordPress. La lista de shortcodes disponibles depende de los plugins instalados y de la plantilla utilizada.

Para crear un shortcode que muestre la palabra «Valencia Noticias» junto con el título y una pequeña descripción de un artículo, puedes utilizar el siguiente código en el archivo functions.php de tu tema de WordPress:

phpCopy code

function valencianoticias_shortcode($atts) {
    $args = shortcode_atts( array(
        'id' => '',
        'text' => ''
    ), $atts );

    $post = get_post($args['id']);
    $title = $post->post_title;
    $excerpt = $post->post_excerpt;
    $link = get_permalink($args['id']);

    $output = '<div class="valencia-noticias">';
    $output .= '<h3>' . $args['text'] . ': ' . $title . '</h3>';
    $output .= '<p>' . $excerpt . '</p>';
    $output .= '<a href="' . $link . '">Leer más</a>';
    $output .= '</div>';

    return $output;
}
add_shortcode('valencianoticias', 'valencianoticias_shortcode');

Este shortcode se llamará «valencianoticias» y acepta dos atributos: «id» (el ID del artículo que se quiere mostrar) y «text» (el texto que aparecerá antes del título del artículo).

Para utilizar el shortcode en una entrada o página, simplemente añade el siguiente código en el lugar donde quieras que aparezca:

pythonCopy code[valencianoticias id="123" text="Últimas noticias"]

Este ejemplo mostrará el título y la descripción del artículo con ID 123, junto con el texto «Valencia Noticias: Últimas noticias». Puedes personalizar los atributos para mostrar los datos del artículo que desees.

Para utilizar un código en el archivo functions.php de tu tema de WordPress, sigue estos pasos:

Accede al panel de administración de WordPress.
En el menú de la izquierda, haz clic en «Apariencia» y luego en «Editor».
En el panel de la derecha, busca y haz clic en el archivo «functions.php».
Asegúrate de hacer una copia de seguridad del archivo functions.php antes de realizar cualquier cambio.
Copia y pega el código que deseas utilizar en el archivo functions.php, justo antes del cierre de la etiqueta PHP ?>.
Guarda los cambios haciendo clic en el botón «Actualizar archivo».

Una vez que hayas agregado el código al archivo functions.php, estará disponible para usar en tu sitio web de WordPress. Si el código es un shortcode, podrás insertarlo en cualquier entrada o página usando la sintaxis del shortcode. Si el código es una función, podrás llamarla en cualquier parte de tu tema o en cualquier plugin que esté activo en tu sitio.

Es posible que el enlace al Editor no esté visible en el menú de WordPress debido a los permisos de usuario o a una configuración específica del tema. En ese caso, es posible acceder al archivo functions.php a través de un cliente FTP o de cPanel. A continuación, te explicaré cómo hacerlo:

Accede a tu cuenta de alojamiento web.
Busca la carpeta «public_html» o la carpeta en la que se encuentre instalado WordPress.
Entra en la carpeta «wp-content» y luego en la carpeta «themes».
Busca la carpeta del tema activo y entra en ella.
Busca el archivo «functions.php» y haz una copia de seguridad del archivo antes de realizar cualquier cambio.
Abre el archivo «functions.php» con un editor de texto.
Copia y pega el código que deseas utilizar en el archivo functions.php, justo antes del cierre de la etiqueta PHP ?>.
Guarda los cambios en el archivo y cierra el editor.

Una vez que hayas agregado el código al archivo functions.php, estará disponible para usar en tu sitio web de WordPress. Recuerda que si el código es un shortcode, podrás insertarlo en cualquier entrada o página usando la sintaxis del shortcode. Si el código es una función, podrás llamarla en cualquier parte de tu tema o en cualquier plugin que esté activo en tu sitio.

Si el archivo functions.php no tiene la etiqueta PHP de cierre ?> al final del archivo, no es necesario agregarla. De hecho, es una buena práctica en WordPress no incluir la etiqueta de cierre PHP al final de los archivos PHP, ya que puede causar problemas de compatibilidad con algunos plugins y temas.

En ese caso, simplemente copia y pega el código que deseas utilizar en el archivo functions.php, asegurándote de que no haya ningún espacio en blanco o línea vacía después del último carácter del código.

Para insertar código en WordPress puedes hacerlo por el fichero functions.php, en un plugin o a través de estos plugins de snippets.

Os recomedamos los 3 que más usamos.

– Code Snippets

– WP Code Insert Headers and Footers

– Woody Code Snippets