Skip to Content
WooCommerceSingle product related

Single Product Related

El bloque de relacionados del PDP mezcla selección manual, fallback Woo y highlights informativos.

Archivos clave:

  • woocommerce/single-product/related.php
  • woocommerce/single-product/related-card.php
  • setup/modules/woocommerce-setup/module.php

Entradas de datos

El template recoge tres fuentes distintas:

  • related_products_section del producto
  • product_info_highlights del producto
  • single_product_detail_panels.product_info_highlights como fallback global

Además recibe el array related_products que Woo ya le pasa por contexto.

Selección manual y fallback

Primero normaliza productos manuales y productos sugeridos por Woo. Luego renderiza ambas secciones por separado si existen.

Cierre real del archivo:

$render_related_section($manual_related_products, $manual_section_title); $render_related_section($default_related_products, __('Puede interesarte', 'woocommerce'));

Eso implica:

  • puede haber una sección manual arriba
  • y otra automática debajo
  • ambas excluyen el producto actual y deduplican IDs

Título manual

Si el editor rellena related_products_section.section_title, ese título pisa el genérico Productos relacionados.

Layout de cards

El carrusel no siempre usa la misma card. Resuelve el layout desde setting:

  • current
  • photo

Si el layout es photo y existe bs_wc_setup_get_product_card(), entra por la card reusable del módulo Woo setup. Si no, usa related-card.php.

Highlights del producto

Antes del carrusel, el template puede pintar hasta cuatro highlights informativos.

Cada item soporta:

  • icono media ACF
  • icono legacy por nombre
  • título
  • contenido

Si el producto no trae highlights propios, cae al bloque global definido en single_product_detail_panels.

Runtime del carrusel

El slider no depende aquí de Swiper o Slick. Lleva una lógica inline propia:

  • calcula visibles según viewport
  • fija width de cada slide
  • mueve la pista con translate3d
  • recalcula en resize

Por eso, si el carrusel falla, hay que revisar este template antes de buscar una librería externa.

Regla práctica

  • si quieres controlar qué productos salen, revisa related_products_section primero
  • si cambia el diseño de la card, comprueba si el setting usa current o photo
  • si falla el carrusel, la lógica está en related.php y no en un bundle JS global del child
Last updated on