将特定的CSS添加到小部件

时间：2012-08-05 作者：Terix

我有一个带有侧栏和3个小部件的主题。我想更改其中一个小部件的颜色。问题是所有小部件都有相同的代码：

<div class="box_outer">
  <div class="widget">
    <h3 class="widget_title">Widget title</h3>
    <div class="wid_border"></div>
    <div class="menu-widget-container">
      <!-- widget content -->
    </div>
  </div>
</div>
如何更改生成的代码，使其为每个小部件构建唯一的标识符，并获得如下结果：

<div class="box_outer" id="widget1">
  <div class="widget">
    <h3 class="widget_title">Widget title</h3>
    <div class="wid_border"></div>
    <div class="menu-widget-container">
      <!-- widget content -->
    </div>
  </div>
</div>

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

如果以这种方式注册侧栏，则所有动态小部件都会自动获得一个唯一的类，例如-class="widget-container widget_archive" 

register_sidebar( array(
    \'name\' => __( \'Primary Widget Area\', \'twentyten\' ),
    \'id\' => \'primary-widget-area\',
    \'description\' => __( \'The primary widget area\', \'twentyten\' ),
    \'before_widget\' => \'<li id="%1$s" class="widget-container %2$s">\',
    \'after_widget\' => \'</li>\',
    \'before_title\' => \'<h3 class="widget-title">\',
    \'after_title\' => \'</h3>\',
) );

注意-

\'before_widget\' => \'<div id="%1$s" class="widget %2$s">\',

  • " %1$s " - 将打印唯一的小部件id。
  • " %2$s " - 将打印每个小部件的唯一类
然后，我们可以根据需要对该唯一类应用自定义样式。

参考-Codex - Register Sidebar

结束
标签： widgets   customization   css   sidebar   小码农  

相关推荐

未使用wp_enQueue_style应用css

我试图在插件中加载我的样式表，但它们没有被调用，但是javascript文件正在加载。<?php /** Plugin Name: Plugin URI: Description: Version: Author: Author URI: **/ define(\"MPF_PATH\", ABSPATH . \'wp-content/plugins/\' . basename(dirname(__FILE__