Como una de las plataformas de comercio electrónico más populares del mundo, WooCommerce ofrece una amplia gama de funciones que le permiten vender productos y servicios en línea.
Pero, ¿sabías que hay una función que puede ayudarte a sacar aún más partido a tu tienda de comercio electrónico?
Estamos hablando de shortcodes.
Si no está familiarizado con ellos, no hay necesidad de preocuparse. Te explicamos qué son y cómo utilizarlos para optimizar tu tienda online. Además, exploraremos formas efectivas de resolver errores de código corto.
¿Listo para aprender todo sobre los códigos cortos de WooCommerce?
¿Qué son los shortcodes de WooCommerce?
Los shortcodes de WooCommerce son fragmentos de código de WordPress que realizan una función específica en tu sitio web. Estos fragmentos de código vienen con una funcionalidad predefinida y fueron creados específicamente para WooCommerce.
Los shortcodes de WooCommerce son fragmentos de código de WordPress que realizan una función específica en tu sitio web.
Todos los códigos cortos tienen la misma estructura: textos cortos entre corchetes. Si se utilizan varios textos, se unirán entre sí con guiones bajos y comas. Una vez que comprenda la sintaxis o la función del controlador, puede comenzar a agregar códigos cortos a las páginas de su sitio web.
Los shortcodes de WooCommerce se pueden utilizar con parámetros o argumentos (args), que te permiten personalizar aún más tu sitio web. Un parámetro es el atributo que se ajusta mediante un código corto, mientras que un argumento es el valor asignado a ese atributo.
Por ejemplo, si está utilizando un código corto de producto, puede establecer el número de productos que se mostrarán (es decir, el parámetro) y el número de columnas que desea (es decir, el argumento).
Aquí hay un vistazo a los parámetros y argumentos en un código corto de WooCommerce:
[related_products limit=»4″]
En este ejemplo, «limit» es el parámetro, mientras que «4» es el argumento. Los parámetros le permiten modificar los códigos cortos para que puedan funcionar de diferentes maneras según sus necesidades o requisitos. Sin embargo, no todos los shortcodes de WooCommerce utilizan parámetros.
¿Por qué deberías usar los shortcodes de WooCommerce?
Los shortcodes de WooCommerce te permiten personalizar tu tienda de comercio electrónico añadiendo varias funciones a tus publicaciones y páginas sin necesidad de tener experiencia en codificación. Mediante el uso de código preexistente, puede ahorrar una cantidad significativa de tiempo que se habría dedicado a escribir su propio código.
Los códigos cortos ofrecen una forma rápida y conveniente de mejorar el diseño de su sitio web para obtener más conversiones. Estos fragmentos de código le permiten crear una experiencia de compra superior y diferenciar su marca de la competencia.
Según un informe de McKinsey, el 75% de los clientes en línea esperan que las marcas les brinden una experiencia de compra fluida. Por lo tanto, mejorar la experiencia del usuario de su sitio web conduce a niveles más altos de satisfacción del cliente, lo que lo ayuda a generar más ingresos.
Cómo usar los códigos cortos de WooCommerce
Ahora que sabes qué son los shortcodes de WooCommerce y por qué son importantes, vamos a explorar cómo utilizarlos. Añadir shortcodes a tu tienda WooCommerce es bastante sencillo, incluso si no tienes conocimientos de codificación.
Sin embargo, antes de realizar cualquier cambio en su sitio web, es mejor hacer una copia de seguridad de sus datos. De esta manera, puede restaurar su sitio web a su estado anterior si algo sale mal.
Si está utilizando el Editor clásico, solo necesita copiar y pegar el código corto elegido en la página deseada.
Por otro lado, el editor de bloques de Gutenberg requiere que agregues el shortcode a un bloque de shortcode. En este tutorial, te mostraremos cómo añadir códigos cortos a tu sitio web de WordPress utilizando el editor de Gutenberg.
Empecemos:
- Inicia sesión en tu panel de control de WordPress.
- Vaya a Páginas, que se encuentra en el menú de la izquierda, y seleccione Agregar nuevo. Tenga en cuenta que puede utilizar una página nueva o existente.
- Haga clic en el icono negro más (+) para crear un bloque.
- Una vez que hayas hecho clic en el icono más, verás el bloque de código corto. Haga clic en él para agregarlo al editor. Alternativamente, escriba [/] en la página y busque «shortcode».
- Escriba o pegue el código abreviado deseado en el campo proporcionado.
- Obtenga una vista previa de la página para asegurarse de que todo se vea bien.
- Haga clic en el botón Publicar en la esquina superior derecha de la página.
¡Eso es todo! Has añadido con éxito un shortcode de WooCommerce a tu página. Ahora que sabes cómo usar estos fragmentos de código, exploremos varios códigos cortos que puedes usar para mejorar tu sitio web de WordPress.
Códigos cortos de WooCommerce y cómo usarlos
Si bien hay muchos códigos cortos de WooCommerce, todos sirven para diferentes propósitos. Hemos recopilado una lista de algunos de los shortcodes más populares que puedes utilizar para mejorar la funcionalidad de tu tienda online.
Códigos cortos de la página de WooCommerce
Si has pasado por el Asistente de configuración de WooCommerce, es posible que hayas notado que los códigos cortos de página se generan automáticamente. Estos son los códigos cortos de página más populares y cómo usarlos.
Carro
El shortcode de carrito de WooCommerce simplifica el proceso de agregar una página de carrito a su tienda en línea. Crea una página de carrito predeterminada, por lo que no tiene que crear una desde cero.
Además de mostrar todos los productos que sus clientes han agregado a sus carritos, este código corto muestra el subtotal, así como la cantidad y el precio de cada producto. El shortcode del carrito de WooCommerce es el siguiente:
[woocommerce_cart]
Seguimiento de pedidos
Este shortcode crea un formulario predeterminado que los compradores online pueden utilizar para comprobar el estado de sus pedidos. Una vez creado el formulario, los clientes deben ingresar sus ID de pedido y correos electrónicos de facturación para realizar un seguimiento de sus pedidos.
Para crear un formulario de seguimiento de pedidos, ingrese el código corto a continuación:
[woocommerce_order_tracking]
Así es como se vería el formulario de seguimiento de pedidos en la interfaz de tu tienda:
Mi cuenta
Este shortcode muestra los detalles de la cuenta de un cliente. Permite a los clientes ver, modificar y actualizar su información personal. Por ejemplo, pueden ver sus pedidos anteriores, cambiar sus contraseñas y direcciones de correo electrónico e iniciar y cerrar sesión en sus cuentas.
El código corto para esto es:
[woocommerce_my_account]
Caja
Este shortcode de WooCommerce crea una página de pago. Como tal, incluye campos para que los clientes agreguen sus detalles de facturación e información de envío. Este shortcode incorpora también el botón Realizar pedido .
Para añadir la página de pago a tu sitio web de WooCommerce, introduce el siguiente código corto:
[woocommerce_checkout]
Dado que más del 70% de los carritos de compras en línea están abandonados, personalizar su página de pago de WooCommerce es una forma efectiva de optimizar la tasa de conversión de su sitio web.
Puedes personalizar tu página de pago utilizando plugins como YITH WooCommerce Checkout Manager. Este plugin te permite modificar los campos existentes y añadir campos personalizados para agilizar el proceso de pago.
Códigos cortos de productos de WooCommerce
Los shortcodes de productos de WooCommerce te permiten crear páginas de productos personalizadas y mostrarlos en cualquier lugar que desees. Repasemos cómo puede usarlos para mostrar sus productos de diferentes maneras en su sitio web.
Productos
Muestre cualquier artículo en stock utilizando el código abreviado de los productos:
[products]
La página de productos se puede personalizar aún más para mostrar los productos en orden ascendente (ASC) o descendente (DESC).
Por ejemplo, si desea enumerar productos en orden ascendente, el código abreviado se vería así:
[products order=»ASC»]
Si desea realizar más personalizaciones, tiene la opción de restringir el número de productos que se mostrarán:
[products limit=»5″ order=»ASC»]
Otros parámetros para este shortcode incluyen:
- Ordenar por
- Categoría
- Columnas
- Paginar
- SKU
- Etiqueta
- Clase
- Best_selling
- Top_rated
- On_sale
Vale la pena mencionar que parámetros como best_selling, top_rated y on_sale no deben usarse juntos.
Productos recientes
Este código corto le permite mostrar productos recientes en su sitio web. Si ha lanzado productos nuevos y emocionantes, puede usar este código corto para llamar la atención sobre ellos y atraer a los clientes a realizar una compra.
Supongamos que desea mostrar sus seis productos más nuevos en tres filas. El código corto para esto sería:
[products limit=»6″ columns=»3″ orderby=»id» order=»DESC» visibility=»visible»]
Este código abreviado enumera los productos en función de sus ID únicos, que se generan cuando se crean las páginas de productos.
Productos destacados
Si hay ciertos productos sobre los que quieres llamar la atención de tus clientes , este shortcode de WooCommerce es el indicado para ti. El shortcode base es:
[featured_products]
Sin embargo, si desea mostrar dos elementos en una fila, el código abreviado se verá así:
[featured_products limit=»2″ columns=»2″]
Productos en venta
Si quieres mostrar productos en oferta, los shortcodes de WooCommerce pueden ser de gran ayuda. Para mostrar tres productos en oferta ordenados por su popularidad, puede usar este código abreviado:
[products limit=»3″ columns=»3″ orderby=»popularity» on_sale=»true»]
Productos mejor valorados
Al buscar productos que satisfagan sus necesidades, la mayoría de los clientes buscan los artículos mejor calificados. Aquí es donde entra en juego el shortcode de los productos mejor valorados. Te permite mostrar los artículos con las puntuaciones más altas en tu tienda online.
El código corto para esto es:
[top_rated_products]
Este shortcode no debe usarse junto con on_sale o best_selling.
Productos más vendidos
Los códigos cortos de productos más vendidos le permiten mostrar sus productos más vendidos. Puede mostrarlos en su página de inicio para llamar la atención sobre ellos una vez que un cliente potencial visite su sitio web.
Si desea mostrar una cuadrícula de cuatro columnas de sus cuatro productos más vendidos, el código abreviado es el siguiente:
[products limit=»4″ columns=»4″ best_selling=»true»]
Etiquetas de producto
Las etiquetas de producto le permiten mostrar solo productos con una etiqueta en particular. El código abreviado para esta función es bastante sencillo. Por ejemplo, para exhibir productos con la etiqueta «pantalones», puede usar el código corto:
[products tag=»pants»]
Códigos cortos de categorías de productos de WooCommerce
Otro shortcode de WooCommerce comúnmente utilizado es el shortcode de categoría de producto. Estos son los dos códigos cortos principales y sus casos de uso.
Categoría de producto
Este shortcode te permite mostrar productos de una categoría específica en cualquier página. Si quieres atraer clientes a una nueva categoría de producto, este shortcode puede ser útil:
[product_category]
Por ejemplo, para mostrar productos de la categoría pantalones, puede utilizar este código abreviado:
[product_category category=»pants»]
Puede optar por modificar esto aún más. Por ejemplo, puede mostrar seis productos de la categoría pantalones en tres columnas y en orden descendente utilizando este código abreviado:
[product_category category=»pants» limit=»6″ columns=»3″ order=»DESC»]
También puede agregar más categorías de productos y separarlas con comas. En el siguiente ejemplo, agregaremos chaquetas a la categoría de pantalones.
[product_category category=»pants,jackets»]
Categorías de productos
El shortcode de categorías de productos te permite mostrar todas tus categorías de productos a la vez:
[product_categories]
Por lo tanto, si tienes varias categorías como pantalones, camisetas y chaquetas, este shortcode mostrará todas estas opciones.
Este código abreviado también se puede utilizar para resaltar ID de categorías específicas. Por ejemplo:
[product_categories ids=»5,6,7″]
Otros shortcodes útiles de WooCommerce
Además de los códigos cortos de WooCommerce enumerados anteriormente, aquí hay otros códigos cortos útiles para agregar a su sitio web.
Productos relacionados
Como su nombre lo indica, este código corto le permite mostrar productos relacionados con los productos que un cliente ve en su sitio web. El shortcode base es:
[related_products]
Acepta argumentos como limit, orderby y columnas. Por ejemplo, puede mostrar cuatro productos relacionados agregando un parámetro de límite al código corto:
[related_products limit=»4″]
El parámetro limit controla el número de productos relacionados que desea mostrar a cada cliente.
He aquí otro ejemplo:
[related_products limit=»4″ columns=»4″]
Esto le permite mostrar productos relacionados en una cuadrícula que contiene cuatro productos por fila.
Página del producto
El shortcode de la página del producto te permite mostrar una sola página del producto por ID o SKU. Supongamos que desea mostrar un producto cuyo ID es 28.
El shortcode sería:
[product_page id=»28″]
Si te interesa escribir entradas de blog, utiliza este shortcode para incrustar un producto específico en tu publicación, permitiendo a tus lectores acceder a él fácilmente.
Para encontrar el ID de un producto, inicie sesión en su panel de administración de WordPress y navegue hasta Productos > Todos los productos. Coloca el cursor sobre el título de un producto específico y verás el ID único del producto.
Tabla de productos
Con la tabla de productos de WooCommerce, puedes añadir tablas de productos a tu tienda online y ofrecer a los clientes una agradable experiencia de compra en una sola página. Los clientes pueden encontrar los productos que necesitan, seleccionar las cantidades deseadas y añadir productos al carrito sin tener que visitar varias páginas.
Además, este plugin incluye montones de opciones de personalización. Por ejemplo, puede seleccionar categorías de productos específicas que desee mostrar. También puede optar por mostrar las variaciones del producto mediante menús desplegables.
Por último, puede mostrar la tabla de productos en cualquier sección de su sitio web utilizando el código abreviado:
[cwpt_table]
Añadir a la cesta
El shortcode de añadir al carrito te permite mostrar el botón de añadir al carrito de un solo producto. Es una función útil cuando no desea mostrar los detalles completos del producto.
Una publicación de blog es un excelente lugar para usar el botón agregar al carrito. El shortcode de WooCommerce para esto es:
[add_to_cart id=»99″]
Cómo solucionar problemas de códigos cortos de WooCommerce
Si alguna vez te encuentras con algún problema al usar los shortcodes de WooCommerce, aquí tienes una serie de consejos útiles que puedes utilizar para solucionarlos.
- Comprueba si has incrustado el shortcode entre <las etiquetas pre> . Si este es el caso, vaya al editor de texto para eliminar estas etiquetas no deseadas.
- Asegúrese de que las comillas sean rectas («) y no rizadas («).
- Utilice corchetes.
- Asegúrese de que cada valor de atributo, que sigue al signo igual, esté entre comillas.
- Utiliza la última versión de WooCommerce.
- Cambia a un tema diferente, ya que tu tema actual puede estar en conflicto con el código corto de WordPress que deseas usar.
- Si sospechas que un plugin está causando el error, desactiva cada plugin uno por uno y sigue probando el shortcode para ver si funciona.
Alternativas a los shortcodes de WooCommerce
Si estás buscando otras formas de mostrar productos en tu sitio web y personalizar tu tienda, aquí tienes algunas alternativas a los shortcodes de WooCommerce que puedes utilizar.
Bloques de WooCommerce
Los bloques de WooCommerce son una gran alternativa a los shortcodes. Ofrecen varios bloques que puedes utilizar para crear y personalizar tu tienda de comercio electrónico.
Mediante el uso de bloques de WooCommerce, puede mostrar una cuadrícula de sus productos más vendidos, resaltar reseñas de categorías específicas, mostrar todos los productos de su tienda y permitir que los compradores vean sus carritos desde cualquier página.
Plugins de shortcode de WooCommerce
Varios complementos en el mercado le permiten agregar códigos cortos a su sitio web sin ninguna experiencia técnica. Intense es uno de esos complementos. Ofrece más de 100 códigos cortos y 19 tipos de publicaciones personalizadas.
Los tipos de publicaciones personalizadas proporcionan una forma de expandir el marketing de contenidos más allá de las publicaciones de blog. Este plugin es responsive móvil y se crea teniendo en cuenta el rendimiento de tu sitio web, lo que te ayuda a crear una experiencia de usuario superior.
Reflexiones finales: Códigos cortos de WooCommerce: una guía para principiantes
Los shortcodes de WooCommerce te permiten destacar las características y beneficios de los productos, proporcionar un acceso rápido a la información, simplificar el proceso de pago y alcanzar tus objetivos comerciales. Este nivel de personalización es difícil de superar.
Y con un panorama de comercio electrónico altamente competitivo, es importante construir su negocio sobre una base sólida. Esto requiere elegir un proveedor de alojamiento web confiable, como Bluehost.
Nuestros planes de alojamiento de WooCommerce vienen con herramientas y funciones que simplifican la creación y administración de sitios web. Además, tendrás acceso a soporte en tiempo real, por lo que siempre tendrás ayuda cuando la necesites.
Póngase en contacto con nosotros hoy mismo para descubrir cómo podemos ayudarle a hacer crecer su tienda online.
Escriba un comentario