Mostrar algunos datos en una estructura html específica para productos simples y variables
En WooCommerce, me gustaría crear una función que genere una simple "lista" de datos, para cada variación o un producto variable. O, si es un producto simple, entonces los detalles de ese producto en sí. Los detalles que necesito incluir para cada uno son:regular price
, size attribute
(usado para las variaciones)sale price
, stock
.
Esto es para una versión de "catálogo" de las páginas de productos de WooCommerce, por lo que no habrá un botón Agregar al carrito o un menú desplegable Variación. En cambio, quiero presentar la información decada producto / variación para el usuario.
Necesito generar los datos de cada uno, como elementos de la lista dentro de un<ul>
. Un nuevo<ul>
para cada variación
Ejemplo de un producto con 3 variaciones:
<div class="fs-product-data-wrapper">
<ul>
<li class="fs-data-price">$49.98 ea.</li>
<li class="fs-data-size">Size: 15-18"</li>
<li class="fs-data-sale">$49.98 ea. Preferred Customer Price</li>
<li class="fs-data-stock">Quantity in Stock: 40</li>
</ul>
<ul>
<li class="fs-data-price">$799.98 ea.</li>
<li class="fs-data-size">Size: 2-2.5'</li>
<li class="fs-data-sale">$67.98 ea. Preferred Customer Price</li>
<li class="fs-data-stock">Quantity in Stock: 15</li>
</ul>
<ul>
<li class="fs-data-price">$29.98 ea.</li>
<li class="fs-data-size">Size: 12"</li>
<li class="fs-data-sale">$19.98 ea. Preferred Customer Price</li>
<li class="fs-data-stock">Quantity in Stock: 0</li>
</ul>
</div>
Ejemplo de un producto sin variaciones, pero es solo un producto simple:
<div class="fs-product-data-wrapper">
<ul>
<li class="fs-data-price">$99.98 ea.</li>
<li class="fs-data-size">Size: 15-18"</li>
<li class="fs-data-sale">$99.98 ea. Preferred Customer Price</li>
<li class="fs-data-stock">Quantity in Stock: 32</li>
</ul>
</div>
Captura de pantalla del ejemplo:
Puedo administrar el CSS de la misma. Solo necesito la capacidad de producir estos datos dentro de unul
para cada "opción". Idealmente, esto también se haría a través de shortcode, ya que lo completaré a través de una plantilla de generador de páginas. Pero podría hacerlo si se engancha en un gancho de página de producto existente. Quizáswoocommerce_after_single_product
.