Shortcode cómo usarlo en WordPress

Shortcode: cómo usarlo en WordPress

viernes, 16 de abril de 2021 | Comentarios

Escrito por

Los sitios desarrollados con WordPress (WP) tienen varias ventajas. Una de ellas es el shortcode, códigos de acceso que funcionan como atajos y agilizan la rutina de trabajo.

Como sabes, WordPress es uno de los Gestores de Contenido (CMS) más populares del mundo. El completo y altamente confiable sistema de creación es capaz de atender desde los blogs más simples hasta las grandes tiendas virtuales. Así, es natural que innovaciones como shortcode estén presentes entre las funcionalidades de este gestor.

Según el propio WordPress, los shortcodes son una forma valiosa de mantener el contenido limpio y semántico, lo que permite a los usuarios finales cierta capacidad para cambiar programáticamente el contenido del sitio.

¿Qué es un shortcode?

Ahora, debes preguntarte qué es shortcode, ¿verdad? Son pequeños fragmentos de código, reconocidos por la composición entre corchetes, que permiten al propietario del sitio web realizar diversas actividades con poco esfuerzo:

  1. “[“ (corchete de apertura)
  2. Nombre escrito en minúsculas, acompañado (o no) de número y guiones bajos.
  3. “]” (cierre del corchete)

Listo: ¡ahora sabes lo qué significa shortcode! Los códigos cortos se introdujeron por primera vez en WordPress 2.5. La razón para presentarlos fue permitir a las personas ejecutar códigos en publicaciones, páginas y widgets de WordPress sin escribir ningún código directamente.

De esta forma, es posible insertar archivos y crear objetos, que normalmente requieren códigos complejos, en una sola línea.

WordPress viene con seis códigos de acceso estándar:

  • Audio
  • Subtitular
  • Embed
  • Galería
  • Lista de reproducción
  • Video

Otros se pueden agregar mediante plugins, utilizando la API Shortcode.

¿Para qué sirve un shortcode?

El shortcode de WordPress sirve para facilitar el trabajo de las personas que tratan con el gestor a diario, evitando tener que programar códigos largos y complejos para incrustar un video o insertar una imagen.

Cuando el usuario agrega una galería de fotos a la publicación usando un shortcode, está adoptando la menor cantidad de datos posibles para indicar cómo se debe presentar la galería. Además, el shortcode mantiene la presentación del contenido más limpia.

También pueden aceptar parámetros, lo que permite a los usuarios modificar cómo se comporta el shortcode según la demanda. Cuando se usan códigos, HTML y otras marcas se agregan dinámicamente, directamente a la publicación o página que el usuario desea que aparezca.

Por lo tanto, puede haber un shortcode en varias páginas de tu sitio WP. Simplemente inserta los tags especiales y el código reemplazará el contenido cuando un visitante web vea el sitio de WordPress.

Ventajas

El proceso de cómo insertar un shortcode de WordPress es uno de los principales beneficios de esta funcionalidad, ya que es posible agregar casi cualquier cosa en una sola línea de código. También son más fáciles de usar en comparación con HTML, PHP y scripts.

Otro beneficio es la agrupación de shortcodes en plugins. Incluso si actualizas WordPress, transfieres archivos a través FTP o cambias y actualizas el tema, los códigos de acceso seguirán siendo válidos y seguirán funcionando como antes. Dado que los shortcodes aceptan atributos, los usuarios pueden modificar cómo el mismo shortcode se comporta simplemente cambiando sus opciones de atributo.

Desventajas

Los shortcodes no son intuitivos para el usuario final, especialmente si hay muchos de ellos en una sola página. Dada la diversidad de shortcodes, es difícil decir qué hace un shortcode con solo mirarlo.

Siempre existe el riesgo de que los shortcodes rompan el HTML debido a problemas de interoperabilidad o tags en conflicto. Finalmente, los códigos cortos sobrecargan el servidor, lo que puede dañar el SEO del sitio debido al tiempo de carga de la página.

¿Cómo agregar un shortcode en WP?

Antes de hablar sobre cómo crear un shortcode en WordPress, te recomendamos hacer un backup en tu sitio. Una vez hecho esto, al abrir una página o publicación en WP, el administrador buscará los shortcodes. Si se encuentra alguno, la API se hace cargo y regresa el resultado del shortcode. El string de salida que regresa, sustituye el tag shortcode donde se agregó.

Sobre la cuestión de cómo obtener un shortcode, de acuerdo con el propio WP, es posible agregar códigos utilizando la API shortcode. El proceso implica registrar una callback $func en un $tag usando “add_shortcode()”, de acuerdo con el siguiente modelo:

 

Cómo agregar un shortcode en WP

 

Si [wporg] es tu nuevo shortcode, su uso activará el código wporg_shortcode para la función de devolución de llamada.

 

 código wporg_shortcode

 

Usar códigos de acceso a WordPress es muy fácil, pero dependerá de dónde quieras colocar el código en el sitio. Por lo tanto, es importante leer la documentación de shortcode, puesta a disposición por WP para comprender cómo funciona este proceso.

Para la creación de shortcodes en WP, existen algunas reglas:

  1. El shortcode tiene una función asociada.
  2. Los atributos de shortcode siempre deben escribirse en minúscula.
  3. El objetivo del callback es enviar argumentos a la función registrada, como los atributos, el nombre del shortcode y el contenido (si corresponde).
  4. Las funciones nunca deben imprimir ningún tipo de contenido.

Ejemplos de shortcodes

Hay varios shortcodes y plugins disponibles para agilizar la rutina de quienes usan WP. A continuación, separamos algunos que pueden resultar muy útiles.

Vista de Google Docs

Algunos usuarios no están acostumbrados a descargar archivos de Internet, por lo que descargan varias aplicaciones para visualizar PDFs. El shortcode de vista previa de Google Docs resuelve este problema.

El plugin proporciona un link directo al visor de Google Docs. Es muy fácil: simplemente inserta el link para PDF en el parámetro de shortcode.

Google Adsense

Para aquellos que ganan dinero con un blog, este shortcode puede ser una gran opción, ya que facilita la monetización de sitios. Con este shortcode, es posible colocar anuncios Adsense en cualquier lugar de la publicación.

Insertar notas privadas

Si tienes un equipo dedicado a WP, aprovecha este shortcode para mejorar la comunicación entre el equipo. Al usarlo, puedes dejar mensajes que solo los administradores de blogs pueden ver.

Google Maps

Con este shortcode, puedes agregar mapas de Google Maps a tu blog, simplemente ingresando la URL proporcionada por la página del mapa.

Compartir en Twitter

Agregar el botón “compartir” de Twitter a las publicidades del blog es un gran recurso para maximizar el alcance de tu contenido. Este shortcode permite agregar un botón para compartir de Twitter a tus artículos.

Contenido solo para miembros registrados

Una tendencia creciente es restringir el contenido solo a los miembros. Con el shortcode cualquier contenido que se muestre entre los tags es visible solo para los usuarios registrados en el sitio.

También hay varios shortcodes listos para ser utilizados en la página de soporte de WP, como se enumera a continuación:

Video

  • [youtube] incorpora un video de YouTube.
  • [vimeo] incorpora un video de Vimeo.
  • [flickr] incorpora un video de Flickr.
  • [ted] incorpora un video de TED Talks.
  • [kickstarter] incorpora un video Kickstarter.
  • [ted] incorpora un video de TED Talks.
  • [[cnnmoney-video]] incorpora un video CNNMoney.
  • [dailymotion] incorpora un video DailyMotion.
  • [hulu] incorpora un video Hulu.

Para más shortcodes de video, consulta la página de soporte de WP.

Audio

  • [soundcloud] incorpora audio de SoundCloud.
  • [ audio ] muestra el archivo de audio enviado como reproductor de audio.
  • [[mancha]] incorpora música de Spotify.
  • [ playlist ] muestra una lista de reproducción para los archivos de audios cargados.

Para obtener más shortcodes de audio, consulta la página de soporte de WP.

Imágenes y documentos

  • [instagram] incorpora una imagem de Instagram.
  • [slideshare] incorpora una presentación de diapositivas de Slideshare.net.
  • [ gallery ] inserta una galería de imágenes en un post o página.
  • [googleapps] incorpora un documento de Google Docs.
  • [scribd] incorpora un documento/archivo de Scribd.
  • [slideshow] incorpora una presentación de diapositivas de fotos enviadas.

Otros

  • [contact-form-7 404 "Not Found"] agrega un formulario de contacto a tu página.
  • [twitter-timeline] incorpora una línea del tiempo de Twitter.
  • [archives] muestra un índice de archivo de posts de tu blog.
  • [googlemaps] incorpora mapas de Google.
  • [list-pages] permite listar páginas, páginas hermanas y páginas hijas.
  • [sourcecode] conserva el formato del código fuente.

Como has visto, es fácil insertar gráficos, incrustar archivos de video, crear formularios de búsqueda y agregar botones con funcionalidad de shortcode. Los códigos cortos simplifican la adición de funciones a un sitio de WordPress. La buena noticia es que si no puedes encontrar el shortcode que estás buscando, ¡puedes crear uno!


Comentarios
Presiona Enter para buscar o ESC para cerrar