WooCommerce自定义短代码产品类别下拉列表

时间:2016-12-07 23:11:19

标签: javascript php jquery woocommerce shortcode

我正在尝试添加WooCommerce类别 - 下拉式 - 短代码,但这似乎无效。我能够看到下拉列表,但是当我选择一个类别时,它没有注册,也没有任何反应。

sc: [product_categories_dropdown orderby =“title”count =“0”hierarchical =“0”]

放在我的functions.php文件中的代码

<?php
/**
 * WooCommerce Extra Feature
 * --------------------------
 *
 * Register a shortcode that creates a product categories dropdown list
 *
 * Use: [product_categories_dropdown orderby="title" count="0"                hierarchical="0"]
 *
 */
add_shortcode( 'product_categories_dropdown','woo_product_categories_dropdown' );
function woo_product_categories_dropdown( $atts ) {
  extract(shortcode_atts(array(
    'count'         => '0',
    'hierarchical'  => '0',
    'orderby'       => ''
    ), $atts));

     ob_start();

    $c = $count;
$h = $hierarchical;
$o = ( isset( $orderby ) && $orderby != '' ) ? $orderby : 'order';

// Stuck with this until a fix for      http://core.trac.wordpress.org/ticket/13258
woocommerce_product_dropdown_categories( $c, $h, 0, $o );
?>
<script type='text/javascript'>
/* <![CDATA[ */
    var product_cat_dropdown = document.getElementById("dropdown_product_cat");
    function onProductCatChange() {
        if ( product_cat_dropdown.options[product_cat_dropdown.selectedIndex].value !=='' ) {
            location.href = "<?php echo home_url(); ?>/?product_cat="+product_cat_dropdown.options[product_cat_dropdown.selectedIndex].value;
        }
    }
    product_cat_dropdown.onchange = onProductCatChange;
/* ]]> */
</script>
<?php

return ob_get_clean();

 }

2 个答案:

答案 0 :(得分:2)

更新(2019)

以下是自woocommerce 3发布以来此自定义产品类别下拉列表的工作代码版本:

  • wc_product_dropdown_categories()替换自woocommerce 3
  • 以来弃用的woocommerce_product_dropdown_categories()
  • 修改了Javascript / jQuery代码。
  • 其他一些变化。

新的工作代码:

add_shortcode( 'product_categories_dropdown', 'shortcode_product_categories_dropdown' );
function shortcode_product_categories_dropdown( $atts ) {
    // Shortcode Attributes
    $atts = shortcode_atts( array(
        'show_count'    => '0',
        'hierarchical'  => '0',
        'orderby'       => ''
    ), $atts, 'product_categories_dropdown' );

    ob_start();

    wc_product_dropdown_categories( array(
        'show_count'    => $atts['show_count'],
        'hierarchical'  => $atts['hierarchical'],
        'orderby'       => ( isset($atts['orderby'])  && empty($atts['orderby']) ? $atts['orderby'] : 'order' ),
    ) );
    ?>
    <script type='text/javascript'>
    jQuery(function($) {
        $('.dropdown_product_cat').change(function(){
            if( $(this).val() !=='' ) {
                location.href = '<?php echo home_url(); ?>/?product_cat='+$(this).val();
            }
        });
    });
    </script>
    <?php

    return ob_get_clean();
}

代码放在活动子主题(或活动主题)的function.php文件中。经过测试和工作。

USAGE示例:

1)在页面内容或帖子内容文本编辑器(或文本小部件)

[product_categories_dropdown orderby="title" count="0" hierarchical="0"]

2)在php模板或代码上:

echo do_shortcode("[product_categories_dropdown orderby='title' count='0' hierarchical='0']");

原始回答:

如果您阅读了您选择here的此代码来源的评论,那么他们就会出现一些错误,并且最近发现了一些问题。

所以正确的更新代码似乎就是这个:

/**
 * WooCommerce Extra Feature Shortcode
 * --------------------------
 *
 * Register a shortcode that creates a product categories dropdown list
 *
 * Use: [product_categories_dropdown orderby="title" count="0" hierarchical="0"]
 *
 */
add_shortcode( 'product_categories_dropdown', 'woo_product_categories_dropdown' );
function woo_product_categories_dropdown( $atts ) {
    extract(shortcode_atts(array(
        'show_count'    => '0',
        'hierarchical'  => '0',
        'orderby'       => ''
    ), $atts));

    ob_start();

    $c = $count;
    $h = $hierarchical;
    $o = ( isset( $orderby ) && $orderby != '' ) ? $orderby : 'order';

    // Stuck with this until a fix for http://core.trac.wordpress.org/ticket/13258
    woocommerce_product_dropdown_categories( $c, $h, 0, $o );
    ?>
    <script type='text/javascript'>
    /* <![CDATA[ */
        var product_cat_dropdown = jQuery(".dropdown_product_cat");
        function onProductCatChange() {
            if ( product_cat_dropdown.options[product_cat_dropdown.selectedIndex].value !=='' ) {
                location.href = "<?php echo home_url(); ?>/?product_cat="+product_cat_dropdown.options[product_cat_dropdown.selectedIndex].value;
            }
        }
        product_cat_dropdown.onchange = onProductCatChange;
    /* ]]> */
    </script>
    <?php

    return ob_get_clean();
}
  

但它不起作用,因为 woocommerce_product_dropdown_categories() 是一个不推荐使用的错误功能。请参阅this reference about。

为此,您可以尝试使用this plugin

答案 1 :(得分:0)

对于仍然坚持这一点的人来说,这是目前正在使用的解决方案:

<ng-form name="frmdisbursementScheduleMaintenance">