Guía Completa: Cómo Agregar Shortcodes en WordPress

Un Shortcode es un código específico de WordPress que te permite hacer cosas ingeniosas con muy poco esfuerzo. Los códigos cortos pueden incrustar archivos o crear objetos que normalmente requerirían muchas líneas de código complicadas. En términos simples, Shortcode es un acceso directo a una función.

En otras palabras, Shortcode es una forma condensada de una pieza de código más grande y, a menudo, compleja. Le permite insertar un script en la sección de contenido de su página, que luego será ejecutado por WordPress.

Los códigos cortos se introdujeron en WordPress 2.5 y desde entonces han contribuido mucho a realizar la tarea compleja de una manera mucho más fácil. El uso de códigos abreviados ahorra tiempo y nos permite hacer cosas de una manera más sencilla que, de otro modo, requerirían una gran cantidad de conocimientos técnicos y codificación.

Beneficios de los códigos cortos

• Mejore la eficiencia y ahorre tiempo: el código abreviado evita la redundancia. Ayuda a los usuarios a implementar cualquier funcionalidad en particular escribiendo el código una vez y reutilizando el código abreviado cada vez que se necesita esa funcionalidad.
• Marcado personalizado selectivo: según su tema, su sitio de WordPress tendrá un diseño y un diseño específicos. Pero, ¿qué pasa si desea que algunas de sus publicaciones, páginas o secciones dentro de su página se vean diferentes de la plantilla de estilo general? Shortcodes hace que esta tarea sea una hazaña fácil de lograr.
• Acceso a áreas de contenido inalcanzables: ciertas tareas, como insertar un widget de texto en su encabezado o agregar contenido personalizado a su barra lateral, no son fáciles. Pero con códigos abreviados, dicha tarea se puede realizar con mucha facilidad y flexibilidad.
• Ayuda a crear diseños mejores y únicos: todos los sitios de WordPress se basan en un diseño estándar que consta de un encabezado, un pie de página, una barra lateral y la sección de contenido principal. Los códigos cortos nos permiten desviarnos del diseño estándar y crear un diseño diferente para su sitio, compuesto por sus propios elementos o componentes.

Cómo usar códigos cortos en WordPress

Para usar un shortcode, simplemente insértelo en la página o publicación de WordPress.

Un código abreviado se parece a esto: [nombre del código corto],

Suponiendo que dicho Shortcode ya esté definido, cuando se usa en un sitio web, muestra una lista de las publicaciones más recientes del autor en cualquier lugar dentro del sitio.

Aquí hay otro ejemplo de una sintaxis de shortcode, utilizando un objeto de shortcode hipotético, "shortcode_ex".

[shortcode_ex] Aquí es donde aparece tu contenido[/shortcode_ex]

WordPress viene con los siguientes códigos cortos por defecto:

Códigos cortos de video

• [dailymotion] incrusta un video de DailyMotion.
• [hulu] incrusta un video de Hulu.
• [ted] incrusta un video de TED Talks.
• [vimeo] incrusta un video de Vimeo
• [youtube] incrusta un video de YouTube.

Audio

• [audio] muestra el archivo de audio cargado como un reproductor de audio
• [spotify] incorpora música de Spotify.

Imágenes y Documentos

• inserta una galería de imágenes en una publicación o página.
• [instagram] incrusta una imagen de Instagram.
• [slideshare] incrusta una presentación de diapositivas de Slideshare.net.
• [slideshow] incrusta una presentación de diapositivas de las fotos cargadas.
• [googleapps] incrusta un documento de Google Docs.

Diverso

Códigos abreviados útiles para agregar un índice de archivo de blog, formulario de contacto, encuestas y más.

• [blog_subscription_form] incorpora un formulario de suscripción que permite a las personas registrarse para recibir actualizaciones por correo electrónico

En la publicación de hoy, discutiremos cómo agregar fácilmente códigos cortos a su sitio de WordPress usando el complemento Shortcodes Ultimate. Vamos a empezar.

Complemento definitivo de códigos cortos

Los complementos de código corto nos permiten crear códigos cortos con facilidad y flexibilidad, sin codificación. Contiene un conjunto de códigos abreviados predefinidos que puede copiar y pegar en su página/publicación. Hay muchos complementos de códigos cortos disponibles en el mercado. En este artículo, nos centraremos en el complemento Shortcodes Ultimate de Vladimir Anokhin.

Shortcodes Ultimate es un complemento popular de WordPress que se puede usar para crear pestañas, botones, cuadros, videos receptivos y mucho más. Viene con más de 50 códigos cortos increíbles, junto con un generador de códigos cortos para crear códigos cortos personalizados.

Para usar el complemento, simplemente instálelo y haga clic en el botón "Códigos cortos" en su página/publicación. Se puede integrar con complementos premium para mejorar aún más su funcionalidad.

Este complemento es muy popular en la comunidad de WordPress, lo cual es evidente por el hecho de que tiene más de 700 000 instalaciones activas y casi 4000 calificaciones de 5 estrellas.

Características clave del complemento Ultimate de códigos cortos

• Más de 50 códigos cortos de aspecto profesional
• Totalmente receptivo
• Resalte texto, cuadro de visualización, imágenes, Google Maps, etc.
• Editor de CSS personalizado
• Inserción de shortcode con 1 clic con vista previa en vivo
• Soporte RTL y funciona bien con fuentes multilingües
• Potente API

Instalación de códigos cortos Ultimate

La instalación del complemento es fácil e implica algunos pasos que se describen a continuación.

• Inicie sesión en su panel de administración de WordPress.
• Haga clic en la opción Complementos en el menú de la barra lateral izquierda
• Haga clic en el botón Agregar nuevo de los complementos
• Aparecerá una nueva ventana, escriba " Shorcodes Ultimate " en el menú de búsqueda en la esquina superior izquierda de la ventana y presione Entrar.
• Aparecerá una lista de complementos. Desde aquí, seleccione el complemento y haga clic en el botón Instalar ahora.

Una vez completada la instalación, haga clic en Activar

Después de la activación, será redirigido a su página de Complementos y allí podrá encontrar el complemento Shortcodes Ultimate junto con los demás. Eso es todo, ahora está listo para usar el complemento y crear códigos cortos en su sitio de WordPress

Explorando códigos cortos Ultimate

Tras la instalación de Shortcodes Ultimate, aparecerá un menú de Shortcodes en su tablero. Haga clic en Menú de códigos cortos y luego en Menú de ejemplo. Esto abrirá la página Ejemplos. Esta página tiene una lista precompilada de los códigos cortos más utilizados que puede usar.

Acordeones, spoilers, estilos y anclas: esto nos permite agregar cosas como acordeones y anclas. Los acordeones se utilizan si desea ocultar algún contenido detrás de un signo "+" , que se expande para revelar su contenido al hacer clic. También hay varios estilos diferentes disponibles e íconos que puede agregar al frente.

Pestañas y anclajes de pestañas

Esto permite agregar diferentes pestañas a sus páginas con varias opciones de estilo.

Diseño de columna

Este shortcode se puede usar para dividir el contenido de nuestra página en varias columnas.

Elementos multimedia

Agregue archivos multimedia como YouTube, archivos de video Vimeo en su publicación / página usando este código abreviado.

animaciones

Este shortcode nos permite agregar animaciones como texto volando desde diferentes direcciones, diferentes colores, columnas animadas, botones y mucho más. Las animaciones mejoran su contenido y son útiles para resaltar cualquier contenido en particular para sus usuarios.

Además de los códigos abreviados básicos, también hay varios otros códigos abreviados avanzados disponibles.

Creación de códigos cortos usando el complemento Ultimate de códigos cortos

Al instalarlo, podemos encontrar que este complemento viene con más de 50 códigos cortos, categorizados en estilo, escritura de contenido, división de contenido.

Para agregar un shortcode a su página, vaya a su panel de administración y luego haga clic en Páginas y luego seleccione la página donde desea agregar su shortcode.

En la pantalla del editor de publicaciones, ahora debería notar que se ha agregado un nuevo botón al menú del editor, titulado Insertar código abreviado.

Haga clic en este botón y se le presentará la siguiente página. Aquí puede elegir el código abreviado apropiado según sus requisitos. Los códigos abreviados también se pueden filtrar según el contenido, la caja, los medios, la galería, los datos y

Después de hacer su elección, puede personalizar ese elemento para cambiar su apariencia o simplemente insertarlo tal como está.

Ahora haga clic en el botón Insertar código abreviado para insertarlo en su página/publicación.

Y eso es todo, su shortcode ahora está insertado en su página/publicación.

Así se verá el botón

Shortcode para dividir el contenido de nuestra página en múltiples columnas

Vaya a su tablero y luego a las páginas. Cree una nueva página o seleccione una existente y haga clic en Insertar código abreviado como se indicó anteriormente.

En el ejemplo vamos a dividir los contenidos usando columnas. Las columnas, sin embargo, residen dentro de las filas. Entonces, comenzaremos agregando un código abreviado de Filas haciendo clic en la opción "Fila".

Esto mostrará el cuadro de diálogo "Agregar fila". Como queremos crear un diseño de 3 columnas, no haremos ningún cambio y haremos clic en Instalar código abreviado

El código abreviado de la fila ahora debe insertarse en su publicación. Inserte su contenido entre [su_fila] y [/su_fila].

Ahora puede insertar los códigos cortos de columna dentro de los códigos cortos de fila para crear su diseño de varias columnas.

Coloque el cursor al comienzo de su código abreviado de fila y nuevamente haga clic en el botón Insertar código abreviado y seleccione Columna de las opciones de código abreviado.

Ajuste su configuración para el menú de opciones de código abreviado de su columna y haga clic en el botón Insertar código abreviado una vez que haya terminado.

El shortcode ahora se mostrará en su editor de publicaciones.

Puede agregar más columnas repitiendo los pasos anteriores o simplemente copiando y pegando los códigos abreviados existentes.

Finalmente, complete los espacios entre los códigos cortos con su contenido. Una vez que haya terminado, haga clic en el botón Actualizar/Publicar para finalizar el proceso.

La salida aparecerá así dependiendo de la cantidad de columnas agregadas y el tamaño de cada columna.