Aviso de garantía legal en WooCommerce: widget gratis

En WooCommerce, añades el aviso de garantía legal a la plantilla de la página de producto con un bloque “HTML personalizado”, justo debajo del botón de añadir al carrito. Con temas clásicos, basta un pequeño hook en el tema hijo.

El código para WooCommerce

<div data-garantielabel></div>
<script src="https://www.garantielabel.app/widget.js" async></script>

Más opciones, como la forma de mostrarlo y el idioma, las ajustas en el generador de código.

Paso a paso en WooCommerce

Abre la plantilla
En WordPress, ve a Apariencia → Editor → Plantillas y abre la plantilla de producto individual (“Single Product”). Con un tema clásico, salta al paso 4.
Inserta un bloque
Debajo del bloque de añadir al carrito con opciones (“Add to Cart with Options”), inserta un bloque “HTML personalizado”.
Pega el código
Pega el código del widget y guarda la plantilla. Así se aplica a todas las páginas de producto.
Tema clásico
Sin el editor de bloques, muestra el código en tu tema hijo mediante el hook woocommerce_single_product_summary con prioridad 35, o usa un plugin de fragmentos de código.

Lo que conviene saber de WooCommerce

Los plugins de caché y optimización (por ejemplo, los que combinan archivos JavaScript) no deberían modificar widget.js. Si hace falta, excluye el archivo de la optimización.
Un script en un bloque “HTML personalizado” solo se conserva si tu usuario puede guardar HTML sin filtrar (la capacidad unfiltered_html; en multisitio, solo los superadministradores). Si no, carga el script con un plugin de fragmentos de código.
Si tu tienda es multilingüe, el widget detecta el idioma a partir de <html lang>. Con data-sprache puedes fijarlo.

Dónde colocar el aviso en WooCommerce

En los temas de bloques, editas la plantilla “Single Product” en el editor del sitio. En los temas clásicos, WooCommerce construye la página de producto a partir de la plantilla content-single-product.php y sus hooks:

woocommerce_single_product_summary rellena el resumen junto a las imágenes. Según la plantilla, contiene el título (prioridad 5), la valoración y el precio (10), la descripción corta (20), el botón de añadir al carrito (30), los metadatos (40) y los enlaces para compartir (50). Con la prioridad 35, el widget queda por tanto justo debajo del botón de añadir al carrito.
woocommerce_after_single_product_summary sigue debajo del resumen, antes de las pestañas (10), las ventas dirigidas (15) y los productos relacionados (20). Ahí el aviso queda más lejos del botón de compra.

Para el aviso en el pie de página, usa en los temas de bloques la parte de plantilla “Footer”. La encuentras en Apariencia → Editor → Patrones, entre las partes de plantilla. Según WooCommerce, las partes de plantilla están siempre sincronizadas: un cambio se aplica en todos los lugares donde se usa el pie de página. Ahí basta un bloque “HTML personalizado” con data-darstellung="link".

Variaciones, marca e identificador del modelo

Un producto variable se compone de variaciones. Cada variación tiene sus propios campos, entre ellos el SKU y “GTIN, UPC, EAN, or ISBN”. Si se quedan vacíos, se aplica el valor del producto principal. Las marcas forman parte del núcleo desde WooCommerce 9.6. Las gestionas en Productos → Marcas y las seleccionas en el producto.

WooCommerce no tiene un campo propio para el identificador del modelo. El SKU es tu propio número de artículo y no es automáticamente el identificador del modelo del productor. La etiqueta GARAN indica la marca y el identificador del modelo, así que hay una etiqueta por identificador del modelo. Si todas las variaciones comparten el mismo identificador del modelo, basta una etiqueta para el producto. El widget muestra exactamente una etiqueta GARAN por marcador de posición y no cambia con la variación elegida. Si las variaciones tienen identificadores del modelo distintos, crea esos modelos como productos separados, cada uno con su propia etiqueta.

Errores habituales en WooCommerce

Actualizaciones del tema: los cambios en los archivos de WooCommerce o del tema padre se pierden con la siguiente actualización. Por eso las plantillas se sobrescriben en el tema hijo, en la carpeta woocommerce/.
Plantillas obsoletas: WooCommerce no actualiza las plantillas sobrescritas. Cuáles están obsoletas lo ves al final de WooCommerce → Estado → Estado del sistema.
Hook en lugar de plantilla: el widget no necesita ninguna plantilla sobrescrita. Basta un hook en el functions.php del tema hijo. WordPress lo carga además del archivo del tema padre.
Pie de página: un cambio en la parte de plantilla se aplica en todas las páginas con ese pie de página. Ahí no hay vista previa, así que comprueba el sitio publicado.

Más fuentes

Aviso de garantía legal en la confirmación de pedido

Según las directrices de la Comisión, el aviso también debería aparecer en el correo de confirmación. Los correos de WooCommerce se personalizan en WooCommerce → Ajustes → Correos electrónicos. Para añadir el aviso de garantía legal al correo del pedido, inserta ahí como imagen el gráfico oficial de nuestra página de descargas, según tu tema mediante las plantillas de correo o un plugin de correo. Es poco probable que un simple enlace cuente como soporte duradero (TJUE, asunto C-49/11, Content Services); lo más seguro es poner el aviso directamente en el correo como imagen, texto o adjunto. Encontrarás los archivos oficiales en nuestra página de descargas.

¿Garantía del productor? Entonces añade la etiqueta GARAN

Si el productor da gratis una garantía comercial de durabilidad de más de dos años que cubre la totalidad del bien, la etiqueta GARAN también va en la página de producto. Con el generador de etiquetas GARAN la creas en segundos a partir de los años, la marca y el modelo; tus primeras 3 etiquetas son gratis y sin registro. Debajo de cada etiqueta terminada recibes un código para insertar con direcciones de imagen permanentes: no subes nada y lo pegas en WooCommerce como se muestra arriba.

¿Prefieres tus propios archivos? Sube la versión completa y la anidada a la biblioteca de medios de WooCommerce e introduce las direcciones en el código del widget:

<div data-garantielabel
  data-garan-voll="https://…/GARAN-MX-500.svg"
  data-garan-klein="https://…/GARAN-MX-500-anidada.svg"></div>

El widget muestra entonces la versión anidada debajo del aviso de garantía legal, y un clic abre la etiqueta GARAN completa.

Preguntas frecuentes

¿Necesito un plugin?

No. Basta con un bloque “HTML personalizado”. Solo con temas clásicos sin editor de bloques lo más sencillo es un plugin de fragmentos de código o un tema hijo.

¿Funciona con Elementor o Divi?

Sí. Ambos tienen un elemento HTML o de código que arrastras debajo del botón de añadir al carrito en la plantilla de producto. En Elementor, las plantillas de producto requieren Elementor Pro (Theme Builder).

¿Se volverá más lenta mi tienda?

Apenas. El script es pequeño, se carga de forma asíncrona y no bloquea la representación de la página.

¿Por qué la prioridad 35 para el hook?

Según la plantilla de WooCommerce, el botón de añadir al carrito está enganchado con la prioridad 30 y los metadatos con la 40. Con 35, el widget queda justo en medio, directamente debajo del botón de compra.

¿Cada variación necesita su propia etiqueta GARAN?

Solo si las variaciones tienen identificadores del modelo distintos. El widget muestra una etiqueta por marcador de posición y no cambia con la variación. Es mejor crear esos modelos como productos separados.

¿Dónde indico la marca para la etiqueta GARAN?

Desde WooCommerce 9.6, en Productos → Marcas. La marca se selecciona en el producto. El antiguo plugin Brands ya no hace falta.

Añade el aviso de garantía legal a WooCommerce