El bloque de Descripción Corta extrae y muestra dinámicamente la descripción corta de cada producto de WooCommerce en tus Plantillas de Producto Único. En lugar de escribir una descripción estática, este bloque utiliza un shortcode para obtener automáticamente la descripción corta correcta para cada producto de tu catálogo, manteniendo tus plantillas precisas sin ningún esfuerzo manual.
Este bloque está diseñado exclusivamente para su uso en Plantillas de Producto Único. La descripción corta suele aparecer cerca del título y el precio del producto, ofreciendo a los compradores una visión general concisa del producto antes de que lean más. Puedes complementar el shortcode con texto personalizado, ajustar la alineación y el tamaño de fuente por dispositivo, y aplicar estilos de tipografía y color para que la descripción se ajuste perfectamente a tu marca.
Añadir el Bloque de Descripción Corta a tus Páginas
Sigue estos pasos para añadir un bloque de Descripción Corta a tu Plantilla de Producto Único de SeedProd:
Paso 1: Añadir el Bloque
En Diseño > Bloques > Etiquetas de Plantilla de WooCommerce, arrastra y suelta el bloque Descripción Corta en la sección deseada de tu Plantilla de Producto Único.
Paso 2: Configurar los Ajustes de Contenido
Una vez añadido, haz clic en el bloque de Descripción Corta para abrir su configuración. En la pestaña Contenido, la sección Texto contiene el campo del shortcode y las opciones de visualización para la descripción corta del producto.
- Texto: El campo de contenido está pre-rellenado con el shortcode
, que extrae automáticamente la descripción corta de WooCommerce para cada producto. Puedes añadir texto personalizado antes o después del shortcode si es necesario. Cambia entre el Editor Visual (texto enriquecido) y los modos Editar HTML (código) usando el botón debajo del campo. - Alineación: Establece la alineación horizontal del texto de la descripción: Izquierda, Centro o Derecha. Admite alineación por dispositivo para escritorio, tableta y móvil.
- Tamaño de Fuente: Establece el tamaño de fuente del texto de la descripción usando el deslizador (10–72px). Admite tamaño por dispositivo para escritorio, tableta y móvil.
Paso 3: Personaliza el Diseño
En la pestaña Avanzado, puedes estilizar la apariencia del texto de la descripción y controlar su visibilidad en diferentes dispositivos.
Estilos:
- Tipografía: Establece la familia de fuentes, el peso, la altura de línea, el espaciado entre letras y la transformación del texto para el texto de la descripción corta, lo que te da un control detallado más allá del deslizador de Tamaño de Fuente de la pestaña Contenido.
- Color: Establece el color del texto de la descripción corta.
- Sombra de texto: Añade un efecto de sombra directamente al texto de la descripción. Elige entre tamaños preestablecidos (Ninguno, Delgado, Pequeño, Mediano, Grande, X Grande, 2X Grande) para añadir profundidad o énfasis al texto.
- Sombra: Añade una sombra al bloque completo para que destaque visualmente del contenido de la página circundante.
Espaciado:
- Margen: Controla el espaciado exterior alrededor de tu bloque de Descripción Corta (Superior, Derecho, Inferior, Izquierdo). Esto determina cuánto espacio aparece entre la descripción y los elementos circundantes, como el título del producto o el botón de añadir al carrito.
- Relleno: Ajusta el espaciado interior dentro de tu bloque de Descripción Corta (Superior, Derecho, Inferior, Izquierdo). Esto crea espacio entre el texto de la descripción y los bordes del bloque.
Atributos:
- ID CSS: Muestra el identificador único generado automáticamente para tu bloque de Descripción Corta. Este ID es creado automáticamente por SeedProd para estilos personalizados o para apuntar con JavaScript.
- Clase Personalizada: Agregue clases CSS personalizadas para aplicar estilos específicos de su tema o CSS personalizado.
- Atributos Personalizados: Añade cualquier atributo HTML al elemento contenedor del bloque. Introduce cada atributo en una nueva línea usando el formato: nombre-atributo|valor (por ejemplo, data-description|short).
Visibilidad del Dispositivo:
- Ocultar en Escritorio: Oculta el bloque de Descripción Corta en pantallas de escritorio.
- Ocultar en Tableta: Oculta el bloque de Descripción Corta en dispositivos tableta.
- Ocultar en Móvil: Oculta el bloque de Descripción Corta en dispositivos móviles.
Efectos de Animación:
- Animación de Entrada: Elige entre varios efectos de animación que se reproducen cuando el bloque de Descripción Corta aparece en la vista. Las opciones incluyen Rebote, Fundido de Entrada, Zoom de Entrada, Giro de Entrada y muchas más.
Paso 4: Guarde sus Cambios
Una vez que hayas terminado de configurar el bloque de Descripción Corta y personalizar su apariencia, asegúrate de guardar tu trabajo.
¡Has añadido con éxito un bloque de Descripción Corta a tu Plantilla de Producto Único! El bloque muestra automáticamente la descripción corta correcta para cada producto en tu tienda WooCommerce, ahorrándote tiempo y garantizando la coherencia en tu catálogo. Experimenta con la tipografía, el color del texto y la alineación por dispositivo para presentar las descripciones de tus productos de una manera que guíe a los compradores hacia una compra.