6 Shortcodes muy útiles para WordPress

¡Buenos días! En este vídeo vamos a ver 6 ejemplos de shortcodes muy útiles para WordPress que os ayudarán a descubrir ciertas funcionalidades y ser más productivos a la hora de trabajar con vuestro WordPress. ¡Vamos allá!

Antes de repasar los ejemplos os voy a dejar algunos enlaces que he mencionado en el vídeo. Por un lado tenemos el vídeo donde explico qué es un shortcode en WordPress y este otro donde vemos cómo crear shortcodes en WordPress.

Dicho esto, veamos los ejemplos 🙂

1. Mostrar cantidad de “algo” (usuarios, posts, comentarios)

Este shortcode nos sirve para mostrar información dinámica de nuestra web, por ejemplo cuántos comentarios tenemos en el blog, cuántas personas registradas en la web, cuántas entradas tenemos publicadas… Para consultar el código que enseño en el vídeo (y más información complementaria) podéis visitar una de estas entradas, dependiendo del código que necesitéis:

2. Insertar texto repetitivo

Este shortcode es de los más simples, ya que simplemente nos imprime un texto que indiquemos. Es muy útil si hay cierto texto que solemos repetir mucho (como un saludo o una llamada a la acción). Aquí tenéis el código del shortcode de la CTA que utilizo yo que podéis modificar a vuestro gusto 🙂

function sh_cta () {
return '<p>¡Y esto es todo! Recordad que si necesitáis mi servicio de <strong>diseño web en WordPress</strong>, no dudéis en <a href="https://pro.empresiona.com/contactar" target="_blank"><strong>contactarme por aquí</strong></a> o en el formulario debajo del post. ¡Saludos y hasta el próximo artículo!</p>';
}

add_shortcode('cta', 'sh_cta');

3. Botones

Igual que con el texto, lo mismo podemos hacer con los botones. El código que utilizo en el vídeo es el siguiente:

function boton_shortcode () {
return '<p><a id="boton-bonito" href="https://pro.empresiona.com">Visita mi página</a></p>';
}

add_shortcode('boton', 'boton_shortcode');

Podéis consultar esta entrada donde enseño cómo crear un botón con HTML y CSS para aprovechar el CSS que utilizo en el vídeo o simplemente para aprender a diseñar vuestros propios botones 🙂

4. Restriccion de contenido

Este shortcode es muy interesante ya que nos permite restringir una parte de nuestro contenido para hacerlo visible sólo a las personas registradas en nuestro WordPress. Podéis consultar el código en esta entrada de cómo restringir contenido a usuarios no registrados en WordPress donde también encontraréis información adicional para mejorar este shortcode.

5. Insertar un PDF

Una forma interesante de utilizar los shortcodes es para insertar un PDF dentro del texto de una página o una entrada. El código que utilizo en el vídeo es el siguiente:

function bps_embed_pdf($atts, $content = null) {
extract(shortcode_atts(array(
"id" => 'default-embed',
"url" => '',
"width" => '900px',
"height" => '700px'
), $atts));
return '<iframe id="' . $id . '" src="http://docs.google.com/viewer?url=' . $url . '&embedded=true" style="width:' . $width . '; height:' . $height . ';" frameborder="0"></iframe>';
}

add_shortcode('pdf', 'bps_embed_pdf');

Se trata simplemente de utilizar el siguiente shortcode indicando la url donde se encuentra el PDF:
[pdf url=”http://dominio.com/ruta/al/archivo.pdf”]

6. Ofuscar información de contacto

En este caso creamos un shortcode para añadir una capa de protección a nuestra información de contacto y protegerla del SPAM. El código que utilizo es el siguiente:

function hide_mail_shortcode( $atts , $content=null ) {
for ($i = 0; $i < strlen($content); $i++) $mail .= "&#" . ord($content[$i]) . ';'; 
return $mail;
}

add_shortcode('mail', 'hide_mail_shortcode');

Y para utilizarlo simplemente envolvemos la información de contacto (sobre todo el mail) con el shortcode [mail], tal que así:

[mail]correo@dominio.com[/mail]