Cómo usar do_shortcode en WordPress

Ampliar la funcionalidad de tu sitio web es fácil con la ayuda de shortcodes. Para colocarlos en cualquier parte de tu sitio web, puedes utilizar la función do_shortcode de WordPress. Aquí te mostraremos cómo usarla. ¡Comencemos explorando los conceptos básicos de los shortcodes!

Descarga la hoja de trucos de WordPress definitiva

¿A qué se le llama shortcode?

Los shortcodes de WordPress añaden funcionalidades extras que te permiten incrustar contenido en páginas, post y sidebars. Una gran cantidad de temas y plugins usan los shortcodes para mejorar agregar contenido dinámicamente a tu sitio. Para dejar claro cómo funciona un shortcode, usemos el shortcode del plugin Contact Form 7:

[contact-form-7 id="12" title="hostinger-tutorials.com Contact Form"]

Como puedes ver es bastante simple. Tenemos el macro de Contact Form 7 dentro de los brackets cuadrados. El macro es generado por el plugin de Contact form 7. WordPress reemplaza el macro con contenido que es producido por una función PHP. Si agregamos este shortcode a un post, una página o un sidebar, WordPress tiene que mostrar nuestro formulario de contacto.

¿Pero qué pasa si quieres usar los shortcodes de WordPress dentro de los archivos del tema? Para eso puedes usar la función do_shortcode. A continuación, veremos a fondo cómo usar dicha función.

¿Qué necesitas?

Antes de continuar con este tutorial asegúrate de contar con lo siguiente:

  • Acceso a tu escritorio de administrador de WordPress

Usando do_shortcode en WordPress

Ahora que ya tienes una mejor idea de cómo funcionan los shortcodes en WordPress, avanzaremos para mostrarte cómo puedes usar los shortcodes para mejorar la funcionalidad de tu sitio.

Por ejemplo, asumamos que quieres incluir el plugin Contact Form 7 en algún lugar de la cabecera de tu sitio. Pero el problema es que no tienes ningún widget en esa zona de tu tema.

Primero que nada, necesitaras conseguir el shortcode del plugin que quieres usar. Por ejemplo, para sacar el shortcode de Contact Form 7 tienes que seguir estos pasos:

  1. Ingresa al escritorio de administrador de WordPress, selecciona Contacto > Formas de contacto.
  2. Encontrarás el shortcode del lado derecho del nombre del formulario:
Imagen 1
[contact-form-7 id="12" title="hostinger-tutorials.com Contact Form"]
  1. Da doble clic en el shortcode y cópialo.

Debido a que tu tema no tiene ningún widget en la cabecera y no podemos simplemente copiar el shortcode en la cabecera, procederemos a usar la función do_shortcode de WordPress. Se verá así:

<?php echo do_shortcode( '[your shortcode goes here]' ); ?>

Ahora para agregar Contacto Form 7 a la cabecera necesitaremos editar el archivo header.php. Antes de prosguir recomendamos que hagas un respaldo de los archivos de tu tema que vayas a alterar y un respaldo de tu WordPress.

En los siguientes pasos te mostraremos como editar los archivos de WordPress con el administrador de archivos de Hostinger, aunque puedes hacerlo usando un cliente FTP, o desde el menú Apariencia > Editar en el escritorio de administración de WordPress:

  1. Accede del Panel de Control de Hostinger y seleccionar Administrador de Archivos.
  2. Dentro del administrador tienes que localizar el directorio de instalación de WordPress. Generalmente se encuentra instalado en public_html. Ahora navega a la carpeta wp-contents > themes.
  3. Encontraras todos los temas que tengas instalados, selecciona el tema que estes usando y ábrelo.
  4. Como vamos a editar la cabecera, abre el archivo header.php.
  5. Desplaza la página y selecciona el lugar y el div en el que quieres agregar el shortcode. Nuestra función do_shortcode se tiene que ver así:
<?php echo do_shortcode(“[contact-form-7 id="12" title="hostinger-tutorials.com Contact Form"]”); ?>
  1. Ahora guarda el archivo y revisa como se ve tu sitio web.

En la mayoría de los casos editar los archivos de tu tema puede quebrarlo. Es bastante seguro que también tengas que alterar el CSS para hacer que tu WordPress siga viéndose bien.

Conclusión

Ahora has aprendido a usar códigos cortos y mostrarlos con la función do_shortcode de WordPress. Simplemente colócalo en el archivo del tema y estarás listo para comenzar. No olvides hacer una copia de seguridad de tu sitio antes de editar el archivo para evitar el riesgo de perder datos.

¿Tienes alguna pregunta sobre el tema? ¡Deja un comentario a continuación!

Author
El autor

Gustavo B.

Gustavo es un apasionado por la creación de sitios web. Se enfoca en la aplicación de estrategias SEO en Hostinger para España y Latinoamérica, así como la creación de contenidos de alto nivel. Cuando no está aplicando nuevos trucos en WordPress lo puedes encontrar tocando la guitarra, viajando o tomando un curso online.