自定义WordPress小工具-产品类别

时间:2017-07-05 作者:Xenocide122

我想在我的类别小部件中的类别旁边添加一些自定义项目符号,因此我创建了一个新的小部件,并添加到新的html和类中,以便我可以更改它的外观。不幸的是,由于某种原因,我的小部件在整个商店页面以及它需要的位置(在类别列表/侧栏中)添加了一个指向我最后一个类别的链接。虽然一切似乎都很正常,但到处都是空的a标签却把其他元素的造型搞得一团糟,增加了额外的空间,让事情变得一帆风顺。

Here is my full widget code:

class mdk_wpcat_widget extends WP_Widget {
// Set up the widget name and description.
public function __construct() {
    $widget_options = array( 
        \'classname\' => \'mdk_wpcat_widget\', 
        \'description\' => \'Custom MDK Woocommerce Category Widget\' 
        );
    parent::__construct( \'mdk_wpcat_widget\', \'Woo Cat Widget\', $widget_options );
}

// Create the widget output.
public function widget( $args, $instance ) {
    $title = apply_filters( \'widget_title\', $instance[ \'title\' ] );

    // before and after widget arguments are defined by themes
    //$blog_title = get_bloginfo( \'name\' );
    //$tagline = get_bloginfo( \'description\' );
    echo $args[\'before_widget\'] . $args[\'before_title\'] . $title . $args[\'after_title\']; 

    // Custom Woo Category Output
    $args = array(
        \'number\'     => $number,
        \'orderby\'    => \'menu_order\',
        \'order\'      => \'ASC\',
        \'hide_empty\' => $hide_empty,
        \'include\'    => $ids
    );
    //Hides "film" category by ID
    $args[\'exclude\'] = \'72\';

    $product_categories = get_terms( \'product_cat\', $args );

    $count = count($product_categories);
     if ( $count > 0 ){
         echo \'<ul class="shop-categories">\';
         foreach ( $product_categories as $product_category ) {
            echo \'<li class="shop-category \' . (( $product_category->name == single_cat_title(\'\', false) )?"active-cat":"") . \'"><a href="\' . get_term_link( $product_category ) . \'"><span class="bulletpoint"></span><span class="category-title">\' . $product_category->name . \'</span></li>\';

         }
         echo \'</ul>\';
     }

    echo $args[\'after_widget\'];
}

// Create the admin area widget settings form.
public function form( $instance ) {
    $title = ! empty( $instance[\'title\'] ) ? $instance[\'title\'] : \'\'; ?>    
    <p>
      <label for="<?php echo $this->get_field_id( \'title\' ); ?>">Title:</label>
      <input type="text" id="<?php echo $this->get_field_id( \'title\' ); ?>" name="<?php echo $this->get_field_name( \'title\' ); ?>" value="<?php echo esc_attr( $title ); ?>" />
    </p><?php
}

// Apply settings to the widget instance.
public function update( $new_instance, $old_instance ) {
    $instance = $old_instance;
    $instance[ \'title\' ] = strip_tags( $new_instance[ \'title\' ] );
    return $instance;
  }
}

// Register the widget.
function mdk_wpcat_load_widget() { 
register_widget( \'mdk_wpcat_widget\' );
}
add_action( \'widgets_init\', \'mdk_wpcat_load_widget\' );
我知道是小部件导致了问题,因为我可以将其从功能中删除。php文件,一切看起来都正常了。截至2017年7月5日,我正在运行最新版本的wp和woocommerce,我还尝试了2017年的主题,以确保它不是我当前的主题。

谢谢你的帮助!

1 个回复
最合适的回答,由SO网友:Dave Romsey 整理而成

查看小部件呈现的输出可以发现标记缺少结束符<a> 术语链接和小部件实例的标记没有结束符</li>.

查看页面源代码并格式化输出可以更容易地识别这些问题:

<li id="mdk_wpcat_widget-2" class="widget-container mdk_wpcat_widget">
  <h3 class="widget-title">Wooooo!</h3>

  <ul class="shop-categories">
    <li class="shop-category ">
      <a href="http://example.com/product-category/test-category-1/">
        <span class="bulletpoint"></span>
        <span class="category-title">Test Category 1</span>

    </li>

    <li class="shop-category ">
      <a href="http://example.com/product-category/test-category-1/test-subcategory-1/">
        <span class="bulletpoint"></span>
        <span class="category-title">Test Subcategory 1</span>

    </li>
  </ul>
下面是输出HTML的代码的更新版本。格式已经改进,缺少的结束锚标记已经修复。保持良好的格式有助于识别错误。

$count = count( $product_categories );
if ( $count > 0 ) {
  echo \'<ul class="shop-categories">\';

  foreach ( $product_categories as $product_category ) {
    $active_cat = $product_category->name == single_cat_title( \'\', false ) ? \' active-cat\' : \'\';
    echo \'
      <li class="shop-category\' . $active_cat . \'">\' .
        \'<a href="\' . esc_url( get_term_link( $product_category ) ) . \'">\' .
          \'<span class="bulletpoint"></span>\' .
          \'<span class="category-title">\' . esc_html( $product_category->name ) . \'</span>\' .
        \'</a>\' .
      \'</li>\';
  }

  echo \'</ul>\';
}
缺失的关闭</li> 控件实例的标记是由于覆盖$args 具有传递给的参数的数组get_terms(). 这导致echo $args[\'after_widget\']; 发出警告。开发时始终打开错误报告。

为传递给的参数创建单独的数组get_terms():

// Custom Woo Category Output
$get_terms_args = array(
    \'number\'     => $number,
    \'orderby\'    => \'menu_order\',
    \'order\'      => \'ASC\',
    \'hide_empty\' => $hide_empty,
    \'include\'    => $ids,
    \'exclude\'    => \'72\', //Hides "film" category by ID
);

$product_categories = get_terms( \'product_cat\', $get_terms_args );
请注意$number, $hide_empty, 和$ids 也都是未定义的,因此这些变量应该正确初始化。

结束