Cómo añadir y mostrar productos destacados en WooCommerce (3 métodos) 

Los productos destacados de WooCommerce son aquellos que marcas manualmente como «Destacados» en tu panel de control. Una vez marcados, puedes mostrarlos en secciones específicas de la página de tu tienda, la página de inicio o la barra lateral mediante un bloque, un código corto o un plugin como SeedProd. La configuración lleva unos 2 minutos.

Con los productos destacados, puedes mostrar tus mejores artículos a los compradores de inmediato. Esto significa que habrá más gente interesada en los productos que realmente importan y más oportunidades de vender.

Muchos propietarios de tiendas destacan sus mejores productos en la página de inicio para que los visitantes los vean nada más entrar.

En este artículo, te mostraré 3 formas sencillas de añadir productos destacados a tu tienda WooCommerce.

Por ejemplo, los clientes pueden filtrar tu tienda para que solo se muestren los artículos destacados. Así les resulta más fácil encontrar tus mejores productos sin tener que desplazarse por toda la página.

Destacar productos es también una forma de recomendación de productos en WooCommerce, que permite dirigir a los compradores hacia tus productos más vendidos y tus selecciones de temporada.

Cómo añadir productos destacados en WooCommerce

Antes de poder mostrar los productos destacados, debes marcarlos primero en WooCommerce. Para ello, edita cualquier producto existente.

Para añadir la opción "Producto destacado" a un producto existente, vaya a Productos " Todos los productos desde el área de administración de WordPress. A continuación, pase el ratón sobre un producto y haga clic en la opción Editar.

A continuación, busque el panel "Publicar" en la parte derecha del editor de WordPress. Desde allí, haz clic en Editar junto al encabezado "Visibilidad del catálogo".

Ahora puede hacer clic en la casilla "Este es un producto destacado" y seleccionar Aceptar. Haga clic en Actualizar para guardar los cambios.

Repita este proceso para cada producto que desee establecer como destacado. Para agilizar el proceso, puedes hacer clic en la opción Edición rápida y buscar la casilla "Producto destacado" en ese panel.

También puede hacer clic en el icono de la estrella que aparece junto a cada producto para destacarlo.

¿No sabe qué artículos mostrar? Empieza por los más vendidos o las ofertas de temporada. Estos suelen ser los mejores productos para mostrar en WooCommerce.

Una vez que hayas elegido los productos destacados, ya estás listo para mostrarlos en tus páginas de productos.

Una vez que hayas marcado tus productos como destacados, aquí tienes tres formas de mostrarlos en tu tienda.

Método 1: Mostrar productos destacados de WooCommerce con SeedProd

Este primer método utiliza SeedProd para mostrar varios productos destacados en tu tienda a la vez.

SeedProd es uno de los mejores constructores de sitios web de WordPress con más de 1 millón de usuarios. Te permite crear cualquier tipo de sitio web con su potente constructor de arrastrar y soltar, sin necesidad de codificación.

Puede crear un tema de WordPress personalizado con el sencillo constructor de temas de WordPress, crear una tienda online completa con su integración de WooCommerce y utilizar el potente constructor de páginas para crear páginas de destino de alta conversión.

SeedProd incluye bloques y secciones para personalizar cada parte de tu sitio web.

Los propietarios de tiendas pueden mostrar información en tiempo real sobre los productos en cualquier parte de su sitio web. Las cuadrículas de productos, gracias a su flexibilidad, facilitan la creación de diseños personalizados sin necesidad de programar.

A continuación te explicamos cómo utilizar SeedProd para mostrar tus productos destacados de WooCommerce.

Paso 1. Instalar y activar SeedProd Instale y active SeedProd

Empieza por instalar y activar SeedProd en tu sitio de WordPress.

Nota: Necesitará el plan SeedProd Elite para acceder a las funciones WooCommerce de SeedProd.

Puedes seguir esta guía sobre cómo instalar un plugin de WordPress si necesitas ayuda.

Una vez activado SeedProd, ve aSeedProd » Ajustes eintroduce tu clave de licencia de SeedProd.

Encontrará la clave de licencia en la sección "Descargas" del panel de control de su cuenta en el sitio web de SeedProd.

Después de introducir su clave de licencia, haga clic en el botón Verificar clave para almacenar la información de su cuenta.

Paso 2. Crear un tema WooCommerce Crear un tema WooCommerce

A continuación, configura tu tienda WooCommerce. SeedProd te ofrece dos formas de hacerlo:

Tema WooCommerce prediseñado

Puedes crear un tema completo de WooCommerce importando una plantilla de tema de WooCommerce ya preparada. SeedProd crea automáticamente todas las páginas de tu tienda.

Partes temáticas individuales

O bien, crea cada parte de tu tienda una por una utilizando el botón «Plantillas de temas».

En esta guía utilizaremos el tema preconfigurado, ya que permite configurarlo todo con un solo clic.

Para crear un nuevo tema WooCommerce, vaya a SeedProd " Theme Builder y haga clic en el botón Temas.

Esto abre la biblioteca de plantillas de SeedProd. Todas las plantillas están optimizadas para dispositivos móviles y puedes editar el diseño en el editor de arrastrar y soltar.

Pasa el cursor por encima de cualquier diseño y haz clic en la marca de verificación para importarlo. En este caso, estamos utilizando el «WooCommerce Starter Theme».

Una vez realizada la importación, verás todas las plantillas que componen tu sitio web. Puedes editar cada una de ellas en el editor de SeedProd.

Le mostraremos cómo hacerlo personalizando la página Tienda.

Paso 3. Añadir la cuadrícula de productos destacados de WooCommerce

En este paso, editarás la página «Tienda» y añadirás una cuadrícula de productos que muestre únicamente tus productos destacados.

Busca la plantilla de la página «Tienda» en el generador de temas y haz clic en «Editar diseño».

El constructor de páginas de SeedProd es muy fácil de usar. Hay bloques y secciones a la izquierda y una vista previa en vivo a la derecha. 

Haz clic en cualquier elemento para editar su configuración. Haz clic en un producto para abrir el panel «Cuadrícula de productos», donde podrás:

• Cambiar el número de columna
• Mostrar productos por tipo y mostrar productos WooCommerce por categoría para diseños de productos más enfocados.
• Mostrar paginación
• Cambiar el orden de los productos

Puedes personalizar las fuentes, tamaños de letra, colores, espaciado y mucho más en la pestaña Avanzado.

Añadir contenido es igual de fácil. Arrastra un bloque desde el panel de la izquierda y suéltalo en la página.

Así es como puedes añadir productos destacados a la página de tu tienda.

Primero, desplázate hasta el panel de bloques de WooCommerce en la barra lateral izquierda. A continuación, busca el bloque Productos destacados y arrástralo a tu página.

Haz clic en el bloque para abrir su configuración. Filtra tus productos automáticamente según su estado de «Destacados».

Sólo queda personalizar la parrilla de productos para adaptarla a sus necesidades.

Puedes destacar los productos destacados cambiando el color de la insignia o el borde de la imagen, o añadiendo un título encima de la cuadrícula.

Cuando estés satisfecho con el diseño, haz clic en el botón verde «Guardar ». Puedes repetir este proceso para personalizar el resto de tu tema, incluyendo:

• Archivos de productos
• Página del producto
• Encabezado y pie de página
• Página del blog
• Barra lateral
• Página de inicio

Paso 4. Publique su tema WooCommerce

Una vez que hayas terminado de configurar tus productos destacados, ya estás listo para publicarlos.

Para ello, vaya a SeedProd " Theme Builder y ponga el interruptor Enable SeedProd Theme en la posición "On".

¡Ya está!

Ahora puedes obtener una vista previa de tu tienda y ver tus productos destacados en tiempo real.

Método 2: Usar el Widget de Productos Destacados de WooCommerce

WooCommerce cuenta con un bloque de «Productos destacados» integrado que puedes añadir a cualquier página, entrada o barra lateral de tu tienda online. No necesitas ningún plugin adicional.

Tiene menos opciones que SeedProd, pero se configura rápidamente si solo necesitas una presentación básica.

Para utilizar este método, cree o edite una página y haga clic en el icono más (+) del editor de bloques de WordPress para añadir un nuevo bloque. A continuación, escribe "WooCommerce" en el campo de búsqueda y haz clic en el bloque Productos destacados.

A partir de ahí, elija un producto para mostrar y haga clic en Listo.

Tu producto aparecerá en la página de inmediato. La configuración del bloque te permite controlar:

• Descripción
• Precio
• Superposición
• Opacidad de la superposición

También puedes arrastrar productos a un bloque de columnas para crear un diseño en cuadrícula.

Cuando hayas terminado, haz clic en «Publicar» o «Actualizar». A continuación, previsualiza la página para ver los productos en tiempo real.

Puedes utilizar el mismo widget para mostrar productos destacados en la barra lateral de tu WooCommerce. Para ello, ve a Apariencia " Widgets, haz clic en el icono más en cualquier barra lateral y añade el widget Productos destacados.

Guarda los cambios y, a continuación, visita cualquier página que contenga esa barra lateral para ver el widget.

Método 3: Usar el código corto de productos destacados de WooCommerce

El tercer método utiliza un código corto. Funciona en el editor clásico de WordPress o si quieres añadir productos destacados directamente en una plantilla de tema de WordPress.

Edita o crea una página y pega este código corto en el editor.

[featured_products]

Cuando veas la vista previa de la página, verás todos tus productos destacados en una cuadrícula.

Puedes controlar cuántos productos se muestran y cuántas columnas se utilizan. Por ejemplo:

[featured_products per_page="2" columns="2"]

También puedes filtrar por categoría utilizando category="slug", cambia el orden de clasificación con orderby="date" o orderby="popularity", y establecer la dirección con order="ASC" o order="DESC".

Prueba con diferentes valores hasta que encuentres una disposición que te guste. Las opciones son limitadas en comparación con SeedProd, pero es la forma más rápida de mostrar productos destacados sin necesidad de configuración.

Preguntas frecuentes sobre los productos destacados de WooCommerce

¿Cómo puedo quitar el estado de «destacado» a un producto en WooCommerce?

Ve a Productos » Todos los productos en tu panel de control de WordPress y haz clic en el icono de la estrella situado junto al producto para desactivar su estado de «Destacado». También puedes utilizar la función «Edición rápida» y desmarcar la casilla «Producto destacado»; a continuación, guarda los cambios. El producto ya no aparecerá en las galerías de productos destacados ni en los códigos cortos.

¿Cómo puedo mostrar solo los productos destacados en la página de mi tienda WooCommerce?

La forma más sencilla es utilizar SeedProd para personalizar la página de tu tienda WooCommerce y añadir un bloque de «Productos destacados» que filtre automáticamente según el estado de «destacado». Si prefieres el bucle predeterminado de la tienda, necesitarás un plugin o un fragmento de código que filtre los productos según el indicador de «destacado».

¿Puedo limitar el número de productos destacados que se muestran?

Sí. Con el método del código corto, añade per_page="4" para configurar el número: [featured_products per_page="4"]. Con el bloque de cuadrícula de productos de SeedProd, puedes establecer el número de productos directamente en el panel de configuración del bloque, sin necesidad de programar.

¿Aparecen automáticamente los productos destacados de WooCommerce en mi página de inicio?

No. Marcar un producto como destacado solo le otorga ese estado en WooCommerce. Aún así, es necesario añadir un bloque, un código corto o un widget a una página para que se muestren. La mayoría de los propietarios de tiendas añaden productos destacados a la página de su tienda o a la página de inicio manualmente, utilizando uno de los tres métodos que se describen en esta guía.

Más formas de personalizar WooCommerce

¿Quieres sacar más partido a tu tienda de WooCommerce? Aquí tienes algunas guías que te pueden ayudar:

• Cómo personalizar la pestaña de información adicional de WooCommerce
• Cómo añadir el botón Ver carrito en WooCommerce
• Cómo cambiar el título de la página de la tienda en WooCommerce
• Cómo crear una impresionante galería de imágenes de productos en WooCommerce 
• Cómo añadir estrellas a las páginas de productos de WooCommerce
• Cómo mostrar productos relacionados en WooCommerce
• Cómo mostrar categorías de productos y etiquetas en WooCommerce 
• Cómo obtener y mostrar descripciones de productos en WooCommerce
• Cómo Arreglar WooCommerce Ver Cesta No Funciona
• Cómo ocultar productos agotados en WooCommerce

Ahora tienes tres formas de mostrar los productos destacados de WooCommerce, desde un diseño totalmente personalizado hasta un código corto rápido. Elige el método que mejor se adapte a tu tienda.

¿Estás listo para darle un toque personalizado a tus productos destacados? Prueba SeedProd, el constructor de WooCommerce de arrastrar y soltar que te permite diseñar toda tu tienda sin necesidad de programar.

Gracias por leernos. Nos encantaría conocer tu opinión, así que no dudes en unirte a la conversación en YouTube, X y Facebook para obtener más consejos y contenidos útiles para hacer crecer tu negocio.