Cómo Añadir y Mostrar Productos Destacados de 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 dedicadas en tu página de tienda, página de inicio o barra lateral utilizando un bloque, un shortcode o un plugin como SeedProd. Configurarlo lleva unos 2 minutos.

Con los productos destacados, puedes poner tus mejores artículos delante de los compradores de inmediato. Eso significa más visibilidad para los productos importantes y más oportunidades de venta.

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

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

Por ejemplo, los compradores pueden filtrar tu tienda para mostrar solo los artículos destacados. Eso facilita encontrar tus mejores productos sin tener que desplazarse por todo.

Destacar productos es también una forma de recomendaciones de productos de WooCommerce, dirigiendo a los compradores hacia tus más vendidos y selecciones de temporada.

Cómo Añadir Productos Destacados en WooCommerce

Antes de poder mostrar productos destacados, primero debes marcarlos en WooCommerce. Puedes hacerlo editando cualquier producto existente.

Para añadir la configuración de “Producto Destacado” a un producto existente, ve a Productos » Todos los productos desde tu área de administración de WordPress. Luego, pasa el ratón sobre un producto y haz clic en la opción Editar.

A continuación, busca el panel “Publicar” en el lado derecho del editor de WordPress. Desde allí, haz clic en Editar junto al encabezado “Visibilidad en el catálogo”.

Ahora puedes marcar la casilla “Este es un producto destacado” y seleccionar OK. Ahora haz clic en Actualizar para guardar tus cambios.

Repite este proceso para cada producto que desees establecer como destacado. Para agilizar las cosas, puedes hacer clic en la opción Edición rápida y encontrar la casilla “Producto destacado” en ese panel.

Alternativamente, puedes hacer clic en el icono de estrella junto a cada producto para destacarlo.

¿No estás seguro de qué artículos mostrar? Empieza con tus más vendidos u ofertas de temporada. Esos suelen ser los mejores productos para destacar en WooCommerce.

Una vez que hayas elegido tus productos destacados, estarás listo para mostrarlos en tus páginas de producto.

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 un 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.

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

SeedProd viene con bloques y secciones para personalizar cada parte de tu sitio.

Los propietarios de tiendas pueden mostrar datos de productos en vivo en cualquier lugar de su sitio. Las flexibles rejillas de productos facilitan la creación de diseños personalizados sin código.

Así es como se usa SeedProd para mostrar tus productos destacados de WooCommerce.

Paso 1. Instalar y Activar SeedProd

Comienza instalando y activando SeedProd en tu sitio de WordPress.

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

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

Después de activar SeedProd, ve a SeedProd » Ajustes e introduce tu clave de licencia de SeedProd.

Puedes encontrar la clave de licencia en la sección “Descargas” de tu panel de cuenta en el sitio web de SeedProd.

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

Paso 2. Crear un Tema de WooCommerce

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

Tema preconstruido de WooCommerce

Puedes crear un tema de WooCommerce completo importando una plantilla de tema de WooCommerce lista para usar. SeedProd crea todas tus páginas de tienda automáticamente.

Partes individuales del tema

O bien, crea cada parte de tu tienda una a una usando el botón Plantillas de tema.

Usaremos el tema preconstruido para esta guía, ya que configura todo en un solo clic.

Para crear un nuevo tema de WooCommerce, ve a SeedProd » Theme Builder y haz clic en el botón Themes.

Esto abre la biblioteca de temas de SeedProd. Cada tema es compatible con dispositivos móviles y puedes editar el diseño en el constructor de arrastrar y soltar.

Pasa el ratón sobre cualquier diseño y haz clic en la marca de verificación para importarlo. Estamos usando el "Tema de inicio de WooCommerce" aquí.

Después de importar, verás todas las plantillas que componen tu sitio. Puedes editar cada una en el constructor de SeedProd.

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

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

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

Busca la plantilla de la página de la Tienda en el constructor de temas y haz clic en Edit Design.

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 de Cuadrícula de productos, donde puedes:

• Cambiar el número de columnas
• Mostrar productos por tipo y mostrar productos de 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 fuente, colores, espaciado y más en la pestaña Avanzado.

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

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

Primero, desplázate hacia abajo hasta el panel de bloques de WooCommerce en la barra lateral izquierda. Luego, busca el bloque Featured Products y arrástralo a tu página.

Haz clic en el bloque para abrir su configuración. Filtra tus productos por estado de Destacado automáticamente.

Todo lo que queda es personalizar la cuadrícula de productos para que se adapte a tus necesidades.

Puedes hacer que los productos destacados destaquen cambiando el color de la insignia, el borde de la imagen o añadiendo un encabezado encima de la cuadrícula.

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

• Archivos de productos
• Página de Producto
• Encabezado y Pie de Página
• Página del Blog
• Barra lateral
• Página de inicio

Paso 4. Publica tu tema de WooCommerce

Una vez que hayas terminado de configurar tus productos destacados, estarás listo para lanzar.

Para ello, ve a SeedProd » Theme Builder y activa el interruptor Enable SeedProd Theme a la posición "On".

¡Eso es todo!

Ahora puedes previsualizar tu tienda y ver tus productos destacados en vivo.

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

WooCommerce tiene un bloque integrado de Productos Destacados que puedes añadir a cualquier página, publicación o barra lateral de tu tienda online. No se necesita ningún plugin adicional.

Tiene menos opciones que SeedProd, pero es rápido de configurar si solo necesitas una visualización básica.

Para usar este método, crea o edita una página y haz clic en el icono más (+) en el editor de bloques de WordPress para añadir un nuevo bloque. Luego escribe "WooCommerce" en el campo de búsqueda y haz clic en el bloque Featured Products.

A partir de ahí, elige un producto para mostrar y haz clic en Done.

Tu producto aparece 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 de cuadrícula.

Haz clic en Publicar o Actualizar cuando hayas terminado. Luego, previsualiza tu página para ver los productos en directo.

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

Guarda los cambios y visita cualquier página con esa barra lateral para ver el widget.

Método 3: Usa el Shortcode de Producto Destacado de WooCommerce

El tercer método utiliza un shortcode. Funciona en el editor clásico de WordPress, o si deseas añadir productos destacados directamente en una plantilla de tema de WordPress.

Edita o crea una página y pega este shortcode en el editor.

[featured_products]

Cuando previsualices la página, verás todos tus productos destacados en una cuadrícula.

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

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

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

Prueba diferentes valores hasta que encuentres un diseño que funcione. Las opciones son limitadas en comparación con SeedProd, pero es la forma más rápida de mostrar productos destacados sin configuración.

Preguntas frecuentes sobre productos destacados de WooCommerce

¿Cómo elimino el estado de destacado de un producto en WooCommerce?

Ve a Productos » Todos los Productos en tu panel de WordPress y haz clic en el icono de estrella junto al producto para desactivar el estado de destacado. También puedes usar Edición Rápida y desmarcar la casilla Producto Destacado, luego guardar. El producto ya no aparecerá en las visualizaciones de productos destacados ni en los shortcodes.

¿Cómo muestro solo productos destacados en mi página de tienda de WooCommerce?

La forma más fácil es usar SeedProd para personalizar tu página de tienda de WooCommerce y añadir un bloque de Productos Destacados que filtre automáticamente por estado de destacado. Si prefieres el bucle de tienda predeterminado, necesitarás un plugin o un fragmento de código que filtre los productos por la marca de destacado.

¿Puedo limitar cuántos productos destacados se muestran?

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

¿Los productos destacados de WooCommerce aparecen automáticamente en mi página de inicio?

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

Más Formas de Personalizar WooCommerce

¿Quieres hacer más con tu tienda de WooCommerce? Aquí tienes algunas guías que pueden ayudarte:

• 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 Tienda en WooCommerce
• Cómo Crear una Impresionante Galería de Imágenes de Producto en WooCommerce 
• Cómo añadir valoraciones de estrellas a las páginas de productos de WooCommerce
• Cómo mostrar productos relacionados en WooCommerce
• Cómo mostrar categorías y etiquetas de productos en WooCommerce 
• Cómo obtener y mostrar descripciones de productos en WooCommerce
• Cómo solucionar que la vista del carrito de WooCommerce no funcione
• Cómo ocultar productos sin stock en WooCommerce

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

Listo para darle un aspecto personalizado a tus productos destacados? Consigue SeedProd, el constructor de WooCommerce de arrastrar y soltar que te permite diseñar toda tu tienda sin código.

¡Gracias por leer! Nos encantaría conocer tu opinión, así que únete a la conversación en YouTube, X y Facebook para obtener más consejos y contenido útil para hacer crecer tu negocio.