What are WooCommerce Shortcodes and How to Use Them

¿Qué son los códigos cortos de WooCommerce y cómo usarlos?

Si has pasado algún tiempo usando WordPress, estoy seguro de que ya conoces los códigos cortos. Sin embargo, si no sabes qué son los códigos cortos, te ofreceré una explicación básica.

¿Qué es un código corto y cómo uso códigos cortos en WooCommerce?

Para evitar errores, asegúrese de que cuando copie y pegue los códigos cortos, asegúrese de eliminar el espacio vacío entre los corchetes: – incorrecto, - bien.

Un código corto, como su nombre indica, es una cadena corta de caracteres que normalmente se escriben entre corchetes derechos. Su objetivo principal es ayudar a los usuarios de WooCommerce a insertar o modificar contenido dinámico sin tener que salir del editor visual.

En un lenguaje aún más simple, le ayuda a implementar y cambiar los valores de elementos interactivos, formularios de suscripción, perfiles y configuraciones de usuario, estado del carrito, páginas de pago y prácticamente todos los elementos que se le ocurran.

Un buen ejemplo de un código corto de WooCommerce sería:

– insertado en el editor de publicaciones de WordPress, este código corto devolverá el carrito de WooCommerce y los elementos agregados del usuario actual.

Hay muchas extensiones y modificaciones creadas para satisfacer la necesidad de códigos cortos en WordPress, sin embargo, el más popular sería Visual Composer, que sirve a más de 350.000 sitios web. Para WooCommerce , por otro lado, existe el complemento “WooCommerce Shortcodes” , una extensión de la plataforma que brinda un entorno más visual y amigable para el uso de códigos cortos.

Una vez instalado y activado, el complemento WooCommerce Shortcodes implementará un botón Woo en su editor de publicaciones desde donde podrá administrar fácilmente todos los códigos cortos disponibles en WooCommerce y modificar sus valores según sus preferencias.

¿Qué códigos cortos se incluyen en WooCommerce?


Empecé con el sin embargo, hay muchos más códigos cortos disponibles y todos ellos son bastante intuitivos. Otra regla que se aplica a todos los códigos cortos dentro de WooCommerce, todos comienzan con WooCommerce y van seguidos del subrayado y el nombre real del código corto.

Además, vale la pena mencionar que algunos de estos códigos cortos también permiten pasar argumentos. Por ejemplo, la cantidad de productos a mostrar o la cantidad de categorías a mostrar por página.

Página de pago de WooCommerce


¿Qué es el shortcode de pago de WooCommerce?

WooCommerce Checkout Shortcode es un fragmento de código que le permite utilizar la página de pago de WooCommerce en la página de pago que desee. El shortcode acepta dos argumentos:
  1. El ID del producto WooCommerce que desea mostrar en la ventana de pago, y
  2. Un valor booleano que determina si desea mostrar o no el botón "Pagar ahora" .

¿Cómo encuentro mi código corto de WooCommerce?

Es simple: lo publicaré a continuación:



Perfil de usuario y administración de cuentas


Este shortcode le ayudará a crear una de las páginas de la tienda más importantes: la página Mi cuenta. En esta página, los clientes pueden ver pedidos anteriores, editar direcciones y detalles de pago. Mi cuenta es el panel central de clientes en una tienda WooCommerce.

¿Cómo encuentro mi código corto de WooCommerce?

Simple: simplemente copie y pegue el código corto a continuación en la página "Mi cuenta" que desee:



 

Como sugiere el nombre, mostrará los detalles de la cuenta de usuario actual y las formas de modificarlos. Además, en esta página el usuario puede ver detalles de pedidos anteriores. Este es un código corto que acepta argumentos, por lo tanto, puede elegir cuántos pedidos mostrar/página.

El número predeterminado de pedidos es 15, pero puedes configurarlo en el número que desees. Si desea mostrarlos todos, entonces su código corto debería verse así:



Si desea mostrar 10 pedidos



Mostrar productos y categorías de productos


Hay muchas variaciones de códigos cortos de WooCommerce para ayudarlo a mostrar productos, de modo que pueda mostrar productos recientes, productos destacados, solo un producto o varios productos de ciertas categorías.

a. ¿Cómo muestro un solo producto en WooCommerce?

Para hacer esto, necesitará la identificación única del producto o el SKU ( Unidad de mantenimiento de existencias ) del producto, un identificador único para el producto.

 Ejemplo de identificación : 
Ejemplo de SKU : 

¿Cómo encontrar la identificación del producto WooCommerce?

Vaya al Panel de administración > Productos ( bajo el botón WooCommerce, en el panel izquierdo ) > Pase el mouse sobre el título de un producto. El ID del producto aparecerá primero, en la misma línea que "Edición rápida", "Editar", etc.

b. Cómo mostrar varios productos ciertos de WooCommerce

Este es otro código corto que acepta argumentos y estos son los argumentos order y orderby. De lo contrario, este código abreviado es exactamente el mismo que el de un solo producto, solo que en este caso se separan los ID y los SKU por coma.

 Ejemplo de identificación :
 Ejemplo de SKU :

C. Cómo mostrar los productos destacados de WooCommerce

Como sabrás, WooCommerce te permite configurar productos destacados, productos que eliges para promocionar y ahora puedes decidir cuáles mostrar y cuántos quieres mostrar en una página.

Para hacer esto, utilizamos el Código corto. Es un código corto dinámico que acepta argumentos como per_page y columns .

Entonces para usarlo:

ejemplo : mostrar 15 productos destacados en 3 columnas

d. Cómo mostrar los productos recientes de WooCommerce

Si desea mostrar las últimas incorporaciones de productos de su tienda WooCommerce, puede aprovechar la shortcode que permite 2 argumentos: per_page y columnas

ejemplo : muestra los últimos 30 productos de tu tienda en 3 columnas

mi. Página completa del producto WooCommerce

Esto es bastante similar a mostrar un solo producto, solo que mostrará una página completa de un solo producto.

 Ejemplo de identificación :

 Ejemplo de SKU :

F. Mostrar toda la categoría de producto

Puede mostrar todos los productos de una determinada categoría utilizando el Código corto. El shortcode acepta 5 argumentos:

  • per_page : número de publicaciones por página
  • columnas : número de columnas para productos
  • ordenar por : título, fecha, etc.
  • orden : ascendente o descendente
  • categoría : la categoría de productos que desea mostrar

ejemplo : Mostrar 16 productos de la categoría Cuadernos ordenados por fecha, ascendiendo en 4 columnas

gramo. ¿Cómo muestro los productos más vendidos en WooCommerce?

Son los productos con mayor número de ventas. Puedes mostrarlos usando Código corto. Acepta el argumento per_page .

Ejemplo: muestra los 15 productos más vendidos en tu tienda.

h. Mostrar solo productos disponibles en oferta

– mostrará sólo los productos disponibles a la venta. Acepta 4 argumentos:

  • por página
  • columnas
  • ordenar
  • orden

ejemplo: mostrar 20 productos en oferta ordenados por título en orden descendente en 2 columnas

i. Mostrar productos relacionados con WooCommerce

Éstas son una buena manera de aumentar las impresiones de páginas de su sitio web y generar más conciencia sobre los productos menos populares. Puede mostrar productos relacionados utilizando el Código corto.

El shortcode acepta 3 argumentos:

  • por página
  • columnas
  • ordenar

ejemplo: para mostrar 5 productos relacionados, simplemente use el código corto

Botón Agregar al carrito y URL


Un shortcode muy importante, que te ayuda a personalizar el aspecto de tu botón "Agregar al carrito" de WooCommerce y te ayuda a colocarlo donde lo consideres necesario. Puede colocarlo en otras publicaciones o páginas porque depende del producto.

Entonces, para mostrar un botón Agregar al carrito, debe usar el código corto que admite 3 argumentos: id , estilo y sku.

ejemplo : Para mostrar un botón Agregar al carrito para un producto con el número de identificación 25 con el borde de estilo:2px solid #ccc; fondo:#999; color:#000; 12 píxeles; tener SKU – pro
 id=”25″ estilo=”borde:2px sólido #ccc; fondo:#999; color:#000; 12px;” sku=”pro” >

Si no necesita el botón para agregar al carrito y solo necesita una URL, puede usar el shortcode que admite id y sku .

 ejemplo : id=”25″ sku=”pro”>

Esto devolverá la URL completa para que el usuario agregue un determinado producto con el id=25 en su carrito.


Tenga en cuenta

Cuando utilice códigos cortos de WooCommerce y códigos cortos de WordPress, asegúrese de no colocarlos entre los y etiquetas porque WordPress las confundirá con el código y no ejecutará su código corto. Además, como especifiqué al principio del artículo, asegúrese de eliminar el espacio vacío entre corchetes: – incorrecto, - bien.

Leave a comment

All comments are moderated before being published.

Este sitio está protegido por reCAPTCHA y se aplican la Política de privacidad de Google y los Términos del servicio.