Cómo crear códigos cortos en WordPress

WordPress introdujo la API de shortcode hace seis años con el lanzamiento de WordPress 2.5 . Los códigos abreviados ahora son utilizados por una gran cantidad de complementos de WordPress para permitir a los usuarios agregar contenido a sus publicaciones y páginas.

La API de shortcode le permite crear sus propios shortcodes agregando funciones a su plantilla functions.php de tema (esta se encuentra en www.yourwebsite.com/wp-content/themes/yourtheme/).

Además de crear sus propios códigos cortos, WordPress también incluye cinco códigos cortos predeterminados con el núcleo de WordPress:

audio : le permite incrustar archivos de audio.
subtítulo : le permite envolver subtítulos alrededor del contenido. Se usa comúnmente con imágenes.
incrustar : le permite incrustar una amplia gama de contenido, como video, audio y tweets.
galería : le permite insertar galerías de imágenes.
video : le permite incrustar archivos de video.

Aunque los códigos cortos predeterminados de WordPress se usan comúnmente, muy pocos usuarios de WordPress aprovechan la API de código corto y diseñan códigos cortos únicos para su sitio web. En este tutorial, me gustaría mostrarle lo sencillo que es mejorar su sitio web con códigos abreviados personalizados.

Antes de comenzar, asegúrese de hacer una copia de seguridad de functions.php y cualquier otro archivo que edite antes de realizar cambios en su sitio web en vivo.

Creación de un código abreviado: un ejemplo básico

Para darle una buena comprensión de cómo funciona la API de código abreviado de WordPress, comencemos con una función básica de código abreviado.

Recuerde que los códigos abreviados deben crearse para el contenido y la funcionalidad que usa con frecuencia. El objetivo de usar códigos cortos es ahorrarle tiempo a alguien. Si solo va a usar algo una vez, no tiene mucho sentido crear un código abreviado para ello.

Escribo alrededor de una docena de artículos por semana. Una cosa que hago con frecuencia es alentar a quienes disfrutaron de mis artículos a suscribirse a mi blog (o al blog para el que escribo). Actualmente escribo esto cada vez, sin embargo, podría ahorrarme mucho tiempo creando un código abreviado para el texto.

Para hacer esto, podría agregar una función como esta a la plantilla functions.php de mi tema:

// Function to add subscribe text to posts and pages
  function subscribe_link_shortcode() {
    return 'If you enjoyed this article, I encourage you to <a href="http://feeds.feedburner.com/ElegantThemes" title="Subscribe to Our Blog">subscribe to the Elegant Themes blog via RSS</a>.';
}
add_shortcode('subscribe', 'subscribe_link_shortcode');

Aquellos de ustedes que no tienen experiencia en codificación pueden encontrar el código anterior un poco desalentador, sin embargo, es fácil de entender una vez que desglosan el código línea por línea.

Lo primero que hacemos es añadir un comentario encima de nuestra función. Esto nos ayudará a ver rápidamente para qué sirve nuestra función cuando veamos el código en una fecha posterior.

// Function to add subscribe text to posts and pages

Luego definimos nuestra función. Me gusta usar nombres que se explican por sí mismos, así que he llamado a mi función «subscribe_link_shortcode».

function subscribe_link_shortcode() {

A continuación, definimos nuestro mensaje. La declaración de devolución mostrará nuestro mensaje cuando se llame. También almacena los mensajes (a diferencia de echo, que los imprimirá pero no los almacenará).

return 'If you enjoyed this article, I encourage you to <a href="http://feeds.feedburner.com/ElegantThemes" title="Subscribe to Our Blog">subscribe to the Elegant Themes blog via RSS</a>.';

A continuación, la función se cierra.

}

Luego definimos el shortcode en sí usando la función add_shortcode. La primera variable especificada define el código abreviado que se utilizará y la segunda variable llama a nuestra función (es decir, la que definimos anteriormente).

add_shortcode('subscribe', 'subscribe_link_shortcode');

Después de guardar la plantilla functions.php, ahora podemos llamar a nuestro mensaje cuando queramos usando el shortcode subscribe.

[subscribe]

El uso del shortcode de suscripción en una publicación o página producirá el siguiente mensaje:

Si te ha gustado este artículo, te animo a que te suscribas al blog de Elegant Themes vía RSS .

Usé un mensaje simple en mi ejemplo, sin embargo, puede modificarlo para mostrar muchas otras cosas. Por ejemplo, podría crear un código abreviado para mostrar anuncios de AdSense o un formulario de suscripción para su boletín informativo; y luego insértelos en cualquier lugar que desee en sus artículos.

Crear un código corto con atributos

Los atributos pueden expandir la funcionalidad de los códigos cortos al permitirle pasar datos a través de sus códigos cortos.

En el siguiente ejemplo, le mostraré cómo se pueden usar los atributos para expandir la función que creamos anteriormente. Como puede ver, gran parte del código sigue siendo el mismo.

// Extended subscription function with subscription type variable
function subscribe_multilink_shortcode( $atts ) {
    extract( shortcode_atts( array(
        'subtype' => 'RSS',
        'subtypeurl' => 'http://feeds.feedburner.com/ElegantThemes',
    ), $atts, 'multilink' ) );
  
    return sprtinf( 'Be sure to subscribe to future Elegant Themes updates <a href='%1$s'>by %2$s</a>.',
        esc_url( $subtypeurl ),
        esc_html( $subtype )
    );
}
add_shortcode( 'subscribe', 'subscribe_multilink_shortcode' );

$atts es el nombre de nuestra matriz de atributos. Luego usamos la función de extracción para importar variables de nuestra matriz (a través de la función de WordPress shortcode_atts ).

Luego se definen dos atributos: subtype y subtypeurl. Estos representan el tipo de suscripción y la URL de suscripción. Estos atributos son luego llamados en nuestro mensaje.

Nuestro tipo de suscripción predeterminado es RSS y nuestra URL de suscripción predeterminada es http://feeds.feedburner.com/ElegantThemes. Esta información se mostrará cuando no se defina ningún atributo.

Por lo tanto, cuando agrega lo siguiente a una publicación:

[subscribe]

Obtendremos la siguiente salida:

Asegúrese de suscribirse a futuras actualizaciones de Elegant Themescome packaged with shortcodesque facilitan la publicación de contenido atractivo. Los códigos abreviados se pueden usar para crear presentaciones de diapositivas, columnas y tablas. Incluso le permite proteger con contraseña su contenido.

Espero que hayas disfrutado este tutorial sobre cómo crear un shortcode único para tu sitio web de WordPress. Si es así, lo animo a que se suscriba a Elegant Themes, ya que tenemos contenido excelente en preparación

Además, una vez más, le recuerdo que haga una copia de seguridad de los archivos antes de editarlos.

Creación de un código abreviado: un ejemplo básico

Crear un código corto con atributos

Publicaciones relacionadas: