将文本小工具的标题强制放在管理区域的新行上

时间:2013-05-07 作者:Jonathan Beech

我通过扩展WP\\u widget类,在标准WP文本小部件的基础上创建了一些自定义小部件。我非常希望将小部件的标题强制添加到管理部分侧栏摘要区域的新行。

我在考虑使用一个换行html标记,这样标题就不会被截断或截断。我注意到WordPress向小部件添加了一个span元素。php文件。该文件位于wp admin/includes/widgets中。php。通过在第188行的此处添加换行标记

<div class="widget-title"><h4><?php $widget_title ?><br><span class="in-widget-title">  </span></h4></div>
我可以把实际的标题加在第二行。

然而,结果并不令人满意,因为css显然不能适应内容的高度。

问题是,我不确定在哪里放置这样的html标记,以便在下面的实际小部件代码中使更改生效?我可以自己更改wordpress文件,但更新会删除我所做的更改。任何帮助都将不胜感激。

代码随附。

  <?php
  /**
   * Counselling Widget
   *
   * @since 2.8.0
   */
  /**
   * Add function to widgets_init that\'ll load our widget.
   * @since 0.1
   */
  add_action( \'widgets_init\', \'counselling_widget\' );

  /**
   * Register our widget.
   * \'Example_Widget\' is the widget class used below.
   *
   * @since 0.1
   */
  function counselling_widget() {
       register_widget( \'counselling_widget\' );
  }
  /**
   * Widget setup.
   */
  class counselling_widget extends WP_Widget {

       function __construct() {
            /* Widget settings. */
            $widget_ops = array(\'classname\' => \'counselling_widget\', \'description\' => __(\'Add or amend text or HTML for the Counselling section\'));
            /* Widget control settings. */
            $control_ops = array(\'width\' => 400, \'height\' => 350);
            /* Create the widget. */
            parent::__construct(\'counselling_widget\', __(\'Counselling\'), $widget_ops, $control_ops);
       }
       /**
        * How to display the widget on the screen.
        */
       function widget( $args, $instance ) {
            extract($args);
            /* Our variables from the widget settings. */          
            $title = apply_filters( \'widget_title\', empty( $instance[\'title\'] ) ? \'\' : $instance[\'title\'], $instance, $this->id_base );
            $text = apply_filters( \'widget_text\', empty( $instance[\'text\'] ) ? \'\' : $instance[\'text\'], $instance );
            /* Before widget (defined by themes). */
            echo $before_widget;
            if ( !empty( $title ) ) { echo $before_title . $title . $after_title; } ?>
                 <div class="textwidget"><?php echo !empty( $instance[\'filter\'] ) ? wpautop( $text ) : $text; ?></div>
            <?php
            echo $after_widget;
       }
       /**
        * Update the widget settings.
        */
       function update( $new_instance, $old_instance ) {
            $instance = $old_instance;
            /* Strip tags for title and name to remove HTML (important for text inputs). */
            $instance[\'title\'] = strip_tags($new_instance[\'title\']);
            if ( current_user_can(\'unfiltered_html\') )
                 $instance[\'text\'] =  $new_instance[\'text\'];
            else
                 $instance[\'text\'] = stripslashes( wp_filter_post_kses( addslashes($new_instance[\'text\']) ) ); // wp_filter_post_kses() expects slashed
            $instance[\'filter\'] = isset($new_instance[\'filter\']);
            return $instance;
       }
       /**
        * Displays the widget settings controls on the widget panel.
        * Make use of the get_field_id() and get_field_name() function
        * when creating your form elements. This handles the confusing stuff.
        */
       function form( $instance ) {

            $defaults = array(
              \'title\' => __(\'Counselling\', \'counselling_widget_text\'),
              \'text\' => \'<div class="counselling">
  <p>Often referred to as person centred, this approach based on the belief that being able to talk to a caring professional about your feelings can provide you with the clarity, self awareness and solutions to promote the potential for change. The therapeutic \\\'space\\\' is utilised to listen to the client\\\'s problems, reflect back to the client what they are saying and offer clarification to achieve awareness and confidence at managing one\\\'s difficult circumstances<a href="#" class="button">read more</a></p>
  </div><!--end counselling-->\',
            );

            $instance = wp_parse_args((array) $instance, $defaults);
            $title = strip_tags($instance[\'title\']);
            $text = esc_textarea($instance[\'text\']);
  ?>
            <p><label for="<?php echo $this->get_field_id(\'title\'); ?>"><?php _e(\'Title:\'); ?></label>
            <input class="widefat" id="<?php echo $this->get_field_id(\'title\'); ?>" name="<?php echo $this->get_field_name(\'title\'); ?>" type="text" value="<?php echo esc_attr($title); ?>" /></p>

            <textarea class="widefat" rows="16" cols="20" id="<?php echo $this->get_field_id(\'text\'); ?>" name="<?php echo $this->get_field_name(\'text\'); ?>"><?php echo $text; ?> </textarea>

            <p><input id="<?php echo $this->get_field_id(\'filter\'); ?>" name="<?php echo $this->get_field_name(\'filter\'); ?>" type="checkbox" <?php checked(isset($instance[\'filter\']) ? $instance[\'filter\'] : 0); ?> />&nbsp;<label for="<?php echo $this->get_field_id(\'filter\'); ?>"><?php _e(\'Automatically add paragraphs\'); ?></label></p>
  <?php
       }
  }

  ?>

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

您可以尝试使用此自定义CSS代码为后端的小部件启用多个标题行:

function custom_css_wpse_98587() {
    echo "<style>
        .widget-top{height:auto !important;}
        .widget-title h4, .widget-title span.in-widget-title{ white-space:normal; }
    </style>";
}
add_action(\'admin_head-widgets.php\',\'custom_css_wpse_98587\');
以下是小部件在我的Chrome浏览器中的显示方式:

之前:

before

之后:

widgets

结束

相关推荐

Using tabs in admin widgets

更新:我应该指出,我在插件/主题选项页面上测试了下面的方法,效果非常好。事实上,我还能够包括jQuery cookie插件,以保留页面加载之间的当前选项卡选择(很好!)。当您有多个小部件选项时,尝试向管理小部件添加选项卡以减少表单占用空间。我正在使用WordPress附带的jQuery UI选项卡。以下是我迄今为止在插件中编写的代码。http://pastebin.com/fe4wdBcp当小部件被拖动到小部件区域时,选项卡似乎呈现为OK,但您无法单击查看第二个选项卡。更糟糕的是,如果刷新窗口小部件页面,