¿Cómo agregar código corto en WordPress? (Guía definitiva)

Los códigos cortos son una manera fácil de agregar contenido dinámico a sus publicaciones, páginas y barras laterales en WordPress.

Muchos complementos y temas de WordPress usan códigos abreviados para agregar contenido especializado, como formularios de contacto, galerías de imágenes, controles deslizantes y más.

En este artículo, le mostraremos cómo agregar fácilmente un código corto en WordPress y cómo crear sus propios códigos cortos personalizados en WordPress.

¿Qué son los códigos cortos?

Los códigos abreviados de WordPress son atajos de código que lo ayudan a agregar contenido dinámico a las publicaciones, páginas y widgets de la barra lateral de WordPress. Se muestran entre corchetes de la siguiente manera:

[myshortcode]

Para comprender mejor los códigos cortos, veamos los antecedentes de por qué se agregaron.

WordPress filtra todo el contenido para asegurarse de que nadie esté usando publicaciones y contenido de la página para insertar código malicioso en la base de datos. Esto significa que puede escribir HTML básico en sus publicaciones, pero no puede escribir código PHP.

Pero, ¿qué sucede si desea ejecutar un código personalizado en sus publicaciones para mostrar publicaciones relacionadas, pancartas, formularios de contacto, galerías, etc.?

Aquí viene la aplicación API Shortcode.

En general, permite a los desarrolladores agregar su código dentro de una función y luego registrar esa función en WordPress como código corto para que los usuarios puedan usarla fácilmente sin ningún conocimiento de codificación.

Cuando WordPress encuentre el código corto, lanzará automáticamente el código asociado a él.

Veamos lo fácil que es agregar códigos abreviados a sus publicaciones y páginas de WordPress.

Agregar código corto a las publicaciones y páginas de WordPress

Primero, debe editar la publicación y la página donde desea agregar el código corto. Luego debe hacer clic en el botón Agregar bloque para insertar un bloque de código corto.

Después de agregar el bloque de código corto, simplemente puede ingresar su código corto en la configuración del bloque. El código corto será proporcionado por varios complementos de WordPress que puede usar, como WPForms para formularios de contacto, OptinMonster para formularios de marketing por correo electrónico, Botón de llamada de WP para insertar un botón de llamada, etc.

Para obtener más información sobre el uso de bloques, consulte nuestro tutorial de Gutenberg para obtener más detalles.

Ahora puede guardar su publicación o página y revisar sus cambios para ver el código corto en acción.

Agregar código corto a los widgets de la barra lateral de WordPress

También puede usar códigos cortos en los widgets de la barra lateral de WordPress. Solo visita Apariencia »Widgets página y agregue el widget de Texto a la barra lateral.

Ahora puede colocar su código corto en el área de texto del widget.

Asegúrese de hacer clic en el botón "Guardar" para guardar la configuración del widget.

Luego puede visitar su sitio web de WordPress para ver la vista previa en vivo del código corto en el gadget de la barra lateral.

Agregue código corto al antiguo editor clásico de WordPress

Si todavía usa el antiguo editor clásico de WordPress, así es como puede agregar códigos abreviados a sus publicaciones y páginas de WordPress.

Simplemente edite la publicación y la página donde desea agregar el código corto. Puede pegar el código corto en cualquier parte del editor de contenido donde desee que aparezca. Solo asegúrese de que el código corto esté en orden.

Recuerda guardar tus cambios. Luego puede navegar por su publicación y página para ver el código corto en acción.

Cómo agregar código corto a los archivos de temas de WordPress

Los códigos cortos están destinados para su uso en publicaciones, páginas y widgets de WordPress. Sin embargo, a veces es posible que desee utilizar un código corto en un archivo de tema de WordPress.

WordPress lo hace fácil, pero deberá editar sus archivos de temas de WordPress. Si no lo ha hecho antes, consulte nuestra guía sobre cómo copiar y pones código en WordPress.

Básicamente, puede agregar un código corto a cualquier plantilla de tema de WordPress simplemente agregando el siguiente código.

<?php echo do_shortcode("[your_shortcode]"); ?>

WordPress ahora buscará el código corto y mostrará su salida en su plantilla de tema.

Cómo crear tu propio código corto personalizado en WordPress

Los códigos cortos pueden ser realmente útiles cuando desea agregar contenido dinámico o código personalizado a sus publicaciones y páginas de WordPress. Sin embargo, si desea crear un código corto personalizado, esto requiere algo de experiencia en codificación.

Si se siente cómodo escribiendo código PHP, aquí hay un código de muestra que puede usar como plantilla.

// function that runs when shortcode is called
function wpb_demo_shortcode() { 

// Things that you want to do. 
$message="Hello world!"; 

// Output needs to be return
return $message;
} 
// register shortcode
add_shortcode('greeting', 'wpb_demo_shortcode'); 

En este código, primero creamos una función que ejecuta algún código y devuelve el resultado, luego creamos un nuevo código corto llamado 'saludo' y le dijimos a WordPress que ejecutara la función que creamos.

Ahora puede usar la adición de este código corto a sus publicaciones, páginas y widgets usando el siguiente código:

[greeting]

Se iniciará la función que creó y mostrará el resultado deseado.

Ahora veamos un uso más práctico del código corto. En este ejemplo, mostraremos un banner de Google AdSense dentro de un código corto.

// The shortcode function
function wpb_demo_shortcode_2() { 

// Advertisement code pasted inside a variable
$string .= '<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-format="fluid"
     data-ad-layout="in-article"
     data-ad-client="ca-pub-0123456789101112"
     data-ad-slot="9876543210"></ins>
<script>
     
</script>';

// Ad code returned
return $string; 

}
// Register shortcode
add_shortcode('my_ad_code', 'wpb_demo_shortcode_2'); 

Recuerde reemplazar el código de anuncio con su propio código de anuncio.

Ahora puedes usar [my_ad_code] código corto en sus publicaciones, páginas y gadgets de la barra lateral de WordPress. WordPress lanzará automáticamente la función de código corto y mostrará el código del anuncio.

Códigos cortos contra Gutenberg Blocks

A menudo, los consumidores nos preguntan sobre las diferencias entre los códigos cortos y los nuevos bloques de Gutenberg.

En general, si encuentra útiles los códigos cortos, entonces le gustarán los bloques del editor de WordPress. Los bloques le permiten hacer lo mismo, pero de una manera más fácil de usar.

En lugar de requerir que los usuarios agreguen un código corto para mostrar contenido dinámico, los bloques les permiten agregar contenido dinámico a las publicaciones/páginas con una interfaz de usuario más intuitiva. Muchos complementos populares de WordPress están cambiando a usar bloques de Gutenberg en lugar de códigos cortos porque son más fáciles de usar para principiantes.

Hemos compilado una lista de los complementos de bloque de Gutenberg más útiles para WordPress que quizás desee probar.

Si desea crear sus propios bloques de Gutenberg personalizados, puede seguir nuestro tutorial paso a paso sobre cómo crear bloques de Gutenberg personalizados en WordPress.

Esperamos que este artículo le haya ayudado a aprender cómo agregar código corto a WordPress. También puede consultar nuestra guía de los mejores complementos de creación de páginas de arrastrar y soltar en WordPress y cómo crear un tema de WordPress personalizado sin escribir ningún código.

Si te ha gustado este artículo, suscríbete al nuestro. Canal de Youtube para videos tutoriales para WordPress. También puedes encontrarnos en Gorjeo y Facebook.