Show Product variation attributes for tab selection, so the products can be filtered

I have a WordPress page template that creates a modal in the cart, so that the user can select a few selected products to be inserted in the cart for free.
These products must be filtered by color (each color in a tab). Currently it’s getting color directly from HTML code. But I needed it to get from product atributes, so that it gets all available colors automatically.

Here’s a piece of the code:

<div class=”tab”>
<?php foreach ( $wfg_free_products as $product ):
if ( empty( $product->detail ) ) {
continue;
}

?>

<button class=”tablinks” onclick=”openTab(event, ‘Black’)”>Black</button>
<button class=”tablinks” onclick=”openTab(event, ‘White’)”>White</button>
<form action=”<?php echo admin_url( ‘admin-ajax.php’ ); ?>” method=”post”>
<input type=”hidden” name=”action” value=”wfg_add_gifts”/>

<?php wp_nonce_field( ‘wfg_add_free_gifts’, ‘_wfg_nonce’ ); ?>
<div id=”Black” class=”tabcontent”><br>

<h3>Black</h3>

<div class=”wfg-gift-item”>
<div class=”wfg-heading”>
<label for=”wfg-item-7268″ class=”wfg-title”>
<img src=”https://www.agenciarederica.com.br/stiefel/wp-content/uploads/2017/09/91-listrado-costas-150×150.jpg” style=”width:150px; height:150px;” alt=””>
</label>
<h3></h3>
</div>

Thanks in advance!

Read more here:: Show Product variation attributes for tab selection, so the products can be filtered

Leave a Reply

Your email address will not be published. Required fields are marked *