将类添加到具有下拉列表和计数器的所有窗口小部件的Beer_Widget

时间:2013-07-30 作者:fuxia

一些预定义的小部件提供了使用select 元素(下拉列表)和/或每个条目后的计数器。如何添加CSS类widget-with-dropdownwidget-with-counters 这些小部件?

已经有解决方案custom widgets, known sidebar idspositions, 但我必须检查当前实例的参数,并且我希望捕获所有可能的位置或小部件(如果它们遵循WordPress命名方案)。

3 个回复
最合适的回答,由SO网友:fuxia 整理而成

CSS类应用于函数中dynamic_sidebar(). 没有特定的过滤器:

// Substitute HTML id and class attributes into before_widget
$classname_ = \'\';
foreach ( (array) $wp_registered_widgets[$id][\'classname\'] as $cn ) {
    if ( is_string($cn) )
        $classname_ .= \'_\' . $cn;
    elseif ( is_object($cn) )
        $classname_ .= \'_\' . get_class($cn);
}
$classname_ = ltrim($classname_, \'_\');
$params[0][\'before_widget\'] = sprintf($params[0][\'before_widget\'], $id, $classname_);
但有一个过滤器$params 在此代码块之后:

$params = apply_filters( \'dynamic_sidebar_params\', $params );
要获取当前小部件的设置,我们必须搜索全局变量$wp_registered_widgets 使用键输入$params[ 0 ][ \'widget_id\' ].
如果它存在,它有一个类实例作为回调,我们可以使用该对象的方法get_settings() 获取设置
返回的数组可能有一个等于$params[1][ \'number\' ].
与此键关联的又是一个数组,在这里我们可能会找到另一个键dropdown (或count) 值为01.
如果是1, 我们将新类添加到$params[0][\'before_widget\'].

我认为这更容易理解为代码:

is_admin() || add_filter( \'dynamic_sidebar_params\', \'wpse_widget_classes\' );

/**
 * Add classes for widgets with counters or dropdowns.
 *
 * @param  array $params
 * @return array
 */
function wpse_widget_classes( $params ) {

    global $wp_registered_widgets;

    $classes     = array();
    $instance_id = $params[1][ \'number\' ];
    $widget_id   = $params[ 0 ][ \'widget_id\' ];
    $settings    = $wp_registered_widgets[ $widget_id ][ \'callback\' ][ 0 ]->get_settings();

    if ( empty ( $settings[ $instance_id ] ) )
        return $params;

    if ( ! empty ( $settings[ $instance_id ][ \'dropdown\' ] ) )
        $classes[] = \'widget-with-dropdown\';

    if ( ! empty ( $settings[ $instance_id ][ \'count\' ] ) )
        $classes[] = \'widget-with-counters\';

    if ( empty ( $classes ) )
        return $params;

    $params[0][\'before_widget\'] = str_replace(
        \'class="\',
        \'class="\' . join( \' \', $classes ) . \' \',
        $params[0][\'before_widget\']
    );

    return $params;
}

SO网友:divydovy

或者,您可以只使用一个插件:

这两个插件的表现与@toscho在回答中所显示的几乎相同。

小部件CSS类插件

$this_id    = $params[0][\'id\']; // Get the id for the current sidebar we\'re processing
$widget_id  = $params[0][\'widget_id\'];
$widget_obj = $wp_registered_widgets[$widget_id];
$widget_num = $widget_obj[\'params\'][0][\'number\'];
<支持>Source link to v1.2.1

自定义小部件类插件

global $wp_registered_widgets;
$widget_id    = $params[0][\'widget_id\'];
$widget_obj    = $wp_registered_widgets[$widget_id];
$widget_opt    = get_option($widget_obj[\'callback\'][0]->option_name);
$widget_num    = $widget_obj[\'params\'][0][\'number\'];
<支持>Source link to v1.1

只是为了证明@toscho是正确的,似乎没有其他选择可以继续下去

SO网友:Satish Gandham

首先在构造函数中添加自定义占位符类

<?php
public function __construct() {
   $widget_ops  = array(
      \'classname\'                   =>; \'widget_text eaa __eaa__\', //__eaa__ is my placeholder css class
      \'description\'                 =>; __( \'AdSense ads, arbitrary text, HTML or JS.\',\'eaa\' ),
      \'customize_selective_refresh\' =>; true,
   );
   $control_ops = array( \'width\' =>; 400, \'height\' =>; 350 );
   parent::__construct( \'eaa\', __( \'Easy AdSense Ads &amp; Scripts\', \'eaa\' ), $widget_ops, $control_ops );
}
?>
然后根据如下小部件选项将其替换为您选择的类

<?php
if ( $instance[\'no_padding\'] ) {
   $args[\'before_widget\'] = str_replace( \'__eaa__\', \'eaa-clean\', $args[\'before_widget\'] );
}
?>
我们使用占位符来限制before\\u小部件的html可能影响插件功能的方式

有关详细信息,请访问http://satishgandham.com/2017/03/adding-dynamic-classes-custom-wordpress-widgets/

结束

相关推荐

覆盖主题模板时丢失的CSS

我已复制并修改了模板文件: header.php 在我的主题中,孩子和我走的是同一条路。这是完整的文件 <?php /** * Your Inspiration Themes * * @package WordPress * @subpackage Your Inspiration Themes * @author Your Inspiration Themes Team <[email protected]>