显示 WooCommerce 可变产品选项

Question

我正在尝试创建一个显示产品及其相关信息的查询。

我坚持展示他们的可变产品选项（它们都将是可变产品）。在此之后，我必须创建一个添加到购物车的按钮，该按钮将添加到购物车，产生成功或错误消息，并让用户继续购物。一旦用户的购物车中有东西，我想显示一个结帐按钮，将他们带到结帐页面。

这是我到目前为止所得到的

<?php
    $args = array(
        'post_type' => 'product',
        'posts_per_page' => 12,
        // Indicate the product category - in this case "training"
        'product_cat' => 'training'
    );
    $loop = new WP_Query( $args );
    if ( $loop->have_posts() ) {
        while ( $loop->have_posts() ) : $loop->the_post();

            // Show the product Featured Image and gallery images
            woocommerce_show_product_images();

            // Show the product Title
            echo the_title();

            // Show the product Custom Fields
            echo get_post_meta($post->ID, 'Description', true);
            echo get_post_meta($post->ID, 'Specifications', true);
            echo get_post_meta($post->ID, 'Video', true);

            // Show the Product Price
            echo $product->get_price_html();

            // Show the Variable Product options, for example: Color, Size etc 
            // stuck here!

            // Show the Add to cart button  
            // stuck here!

            // Show the Checkout button if there is an item in the users cart
            // stuck here!

        endwhile;
    } 
    wp_reset_postdata();
?>

有谁知道我应该使用哪些功能来显示这些信息？ 我很难在文档/谷歌上找到任何关于它的信息。

谢谢大家！！！

Answer 1

Woocommerce 默认带有可变产品选项。为此，您首先必须创建属性。如果所有产品都具有相同的属性，您可以创建全局，也可以为每个产品单独创建属性。

这是我工作的网站的屏幕截图。我们有 4 种不同的套餐。所以我的属性是“包”，我们有 4 个包。

保存属性后，转到名为 'variations' 的下一个选项卡。选择包属性，它将自动加载所有变体。这是另一个屏幕截图。您将不得不选择一个默认变体。

完成上述所有更改后，您可以单击任何变体并更改价格、图像等产品参数。

变体可用于衬衫等产品，您可以有不同颜色的衬衫，虽然衬衫的价格相同，但您可以让用户选择颜色并查看衬衫在该颜色下的外观。

虽然 woocommerce 已经默认设置了所有内容，但是如果您要更改默认的 wordpress 模板，那么最好的方法是从 woocommerce 复制模板文件夹并将此文件夹放在您的活动主题中，以 woocommerce 的名称命名，因此类似于 wp-content/themes/theme-name/woocommerce。在这些文件中，您需要 woocommerce 的模板文件夹中的所有文件和文件夹。 Woocommerce 将自动选择所有这些文件并提供服务。 woocommerce 推荐使用此方法，因为直接更改插件会在下一次插件更新时丢失所有自定义项。

根据您的情况编辑：对不起，我想我得意忘形了：p。无论如何，这取决于您所处的情况以及您用来获取这些值的文件，但是，下面的代码将输出所有产品变体以及该变体中的所有属性。我还没有测试过，可能需要稍微调整一下。 **

global $product, $post;
$variations = $product->get_available_variations();
foreach ($variations as $key => $value) {
    echo 'variation ID'.$value['variation_id'];
    foreach ($value['attributes'] as $attr_key => $attr_value) {
       echo $attr_key.': '.$attr_value;
    }
}

Answer 2

低头，瞧.. 解决方案非常简单。 我必须在循环中拥有的是：

    wc_get_template_part( 'content', 'single-product' );

现在我的循环看起来像这样

    <?php
        $args = array(
            'post_type' => 'product',
            'posts_per_page' => 12,
            // Indicate the product category - in this case "Training"
            'product_cat' => 'training'
        );
        $loop = new WP_Query( $args );
        if ( $loop->have_posts() ) {
            while ( $loop->have_posts() ) : $loop->the_post();

                wc_get_template_part( 'content', 'single-product' );

            endwhile;
        }
        wp_reset_postdata();
    ?>

工作正常，并且我只是创建了以下子版本的产品信息样式：
- 内容单一产品.php
- 产品图像.php
- 变量.php
- meta.php
- 产品缩略图.php
一直编辑到我心满意足为止。

Answer 3

我使用了一些 Omer Farooq 的代码。谢谢奥马尔！这将为您提供您选择的属性的完整下拉菜单。在这种情况下，我使用的是 pa_color。我还删除了重复项，以便它只返回一组颜色。这应该在产品循环内使用。就我而言，我使用 WP_Query 来查询产品。

<?php   
 /* Check if this is a variable product */                   
 if ($product->is_type( 'variable' )) { ?>
   <select name="pa_color"><?php 

 global $product, $post;

 $variations = $product->get_available_variations();

 $allcolors = array();

 foreach ($variations as $key => $value) {

    foreach ($value['attributes'] as $attr_key => $attr_value) {

   /* Get Name (Label) from Attribute Slug */
   $taxonomy = 'pa_color'; /* Change to whatever you want */
   $meta = get_post_meta($value['variation_id'], 'attribute_'.$taxonomy, true);
   $term = get_term_by('slug', $meta, $taxonomy);

    /* Only Return pa_color attributes - Change to whatever you want */
   if ($attr_key == 'attribute_pa_color') {

       $color = $attr_value; 

       /* Checking for duplicates and removing them */
       if( ! in_array( $color, $allcolors ) ) {

         echo '<option value="' . $attr_value . '">' . $term->name . '</option>';

         $allcolors[] = $attr_value; /* Array value to use to check for duplicates */
       }

   } 
 } 
} 
?>
</select>
<?php } ?>