最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

functions - Using add_filter() in Widgets

programmeradmin1浏览0评论

Just have a query reference the add_filter() function.

Can you use this function inside a WordPress widget class.

Example

I have a widget with dynamic created code that I want to pass to another function created within the plugin. Can this be achieved?

<?php
/**
 * Display the actual Widget
 *
 * @param Array $args
 * @param Array $instance
 */
public function widget($args, $instance){

    extract($args);

    /* All the widget code. Hidden to save space */

    /* Generate unique id if shortcode - used for styling */
    $sc_id = mt_rand(1, 100000);
    $wcss = '';

    /* Here is the actual output code that I want to pass to another function I created */
    $wcss .= ".awp_archive_widget_sc".$sc_id." { border:".$awp_archives_border_width.' '.$awp_archives_border_style.' '.$awp_archives_border_color." !important }\n";
    $wcss .= $awp_archives_border_radius == 'round' ? '.awp_archive_widget_sc'.$sc_id.' { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px }' : ''.''." \n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a, .awp_archive_widget_sc".$sc_id." li { font-size:".$awp_archives_font_size." !important }\n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a { color:".$awp_archives_link_std." !important }\n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a:hover { color:".$awp_archives_link_hover." !important }\n";

    $out = '';

    /* Rest of widget code - hidden to save space */

    echo $out;
}
?>

The code marked $wcss is the actual code that I want to pass to another function.

I thought I could do something like this from within the plugin constructor.

add_filter('advanced_widget_pack_css',array(&$this,'$this->widget'));

Any help would be greatly appreciated.

Just not sure how to achieve this from within the widget class.

Additonal Code

The plugin allows for custom css styles through creating a custom CSS file through WordPress AJAX.

Here is how I generate the custom AJAX CSS stylesheet:

Generate WordPress AJAX CSS file

/**
 * Enqueue the widgets stylesheet
 */
public function add_awp_css(){

    wp_enqueue_style($this->hook, plugins_url('advanced-widget-pack/css/advanced-widget-pack.css' , dirname(__FILE__)), array(), '', 'screen'); 

    wp_enqueue_style(
        $this->hook.'-custom',
        add_query_arg(
            array(
                'action' => 'advanced_widget_pack_gen_css',
                /* Include this to ensure changes don't get cached by the browser */
                'layout' => substr(md5(serialize($this->hook)), 0, 8)
            ),
            site_url()
        ),
        array($this->hook),
        $this->version
    );  
}

This works greats.

Now the function that the above enqueue calls is this:

The callback function for the WordPress AJAX CSS file

/**
 * Echo the CSS for the custom widgets style
 */
public function advanced_widget_pack_css() {
    if(empty($_GET['action']) || $_GET['action'] != 'advanced_widget_pack_gen_css') return;
    if(!isset($_GET['ver'])) return;

    $css_text = '';

    /* ============================= */
    /* Archives Widget               */
    /* ============================= */
    if(awp_option('archives_style_border') == 'true'){ 

        $css_text .= ".awp_archive_widget { border:".awp_option('archives_style_border_width').' '.awp_option('archives_style_border_style').' '.awp_option('archives_style_border_color')." !important }\n";
        $css_text .= awp_option('archives_style_border_radius') == 'round' ? '.awp_archive_widget { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px }' : ''.''." \n";
    }
        $css_text .= ".awp_archives_colour { color:".awp_option('awp_archives_dropdown_inst_colour')." !important }\n"; 

    /**
     * Filter the unprocessed CSS array
     */
    $css_text = apply_filters('advanced_widget_pack_css', $css_text);

    header("Content-type: text/css");
    echo $css_text;
    exit();
}

This above function also works fine. It outputs a CSS file.

Just have a query reference the add_filter() function.

Can you use this function inside a WordPress widget class.

Example

I have a widget with dynamic created code that I want to pass to another function created within the plugin. Can this be achieved?

<?php
/**
 * Display the actual Widget
 *
 * @param Array $args
 * @param Array $instance
 */
public function widget($args, $instance){

    extract($args);

    /* All the widget code. Hidden to save space */

    /* Generate unique id if shortcode - used for styling */
    $sc_id = mt_rand(1, 100000);
    $wcss = '';

    /* Here is the actual output code that I want to pass to another function I created */
    $wcss .= ".awp_archive_widget_sc".$sc_id." { border:".$awp_archives_border_width.' '.$awp_archives_border_style.' '.$awp_archives_border_color." !important }\n";
    $wcss .= $awp_archives_border_radius == 'round' ? '.awp_archive_widget_sc'.$sc_id.' { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px }' : ''.''." \n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a, .awp_archive_widget_sc".$sc_id." li { font-size:".$awp_archives_font_size." !important }\n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a { color:".$awp_archives_link_std." !important }\n";
    $wcss .= ".awp_archive_widget_sc".$sc_id." li a:hover { color:".$awp_archives_link_hover." !important }\n";

    $out = '';

    /* Rest of widget code - hidden to save space */

    echo $out;
}
?>

The code marked $wcss is the actual code that I want to pass to another function.

I thought I could do something like this from within the plugin constructor.

add_filter('advanced_widget_pack_css',array(&$this,'$this->widget'));

Any help would be greatly appreciated.

Just not sure how to achieve this from within the widget class.

Additonal Code

The plugin allows for custom css styles through creating a custom CSS file through WordPress AJAX.

Here is how I generate the custom AJAX CSS stylesheet:

Generate WordPress AJAX CSS file

/**
 * Enqueue the widgets stylesheet
 */
public function add_awp_css(){

    wp_enqueue_style($this->hook, plugins_url('advanced-widget-pack/css/advanced-widget-pack.css' , dirname(__FILE__)), array(), '', 'screen'); 

    wp_enqueue_style(
        $this->hook.'-custom',
        add_query_arg(
            array(
                'action' => 'advanced_widget_pack_gen_css',
                /* Include this to ensure changes don't get cached by the browser */
                'layout' => substr(md5(serialize($this->hook)), 0, 8)
            ),
            site_url()
        ),
        array($this->hook),
        $this->version
    );  
}

This works greats.

Now the function that the above enqueue calls is this:

The callback function for the WordPress AJAX CSS file

/**
 * Echo the CSS for the custom widgets style
 */
public function advanced_widget_pack_css() {
    if(empty($_GET['action']) || $_GET['action'] != 'advanced_widget_pack_gen_css') return;
    if(!isset($_GET['ver'])) return;

    $css_text = '';

    /* ============================= */
    /* Archives Widget               */
    /* ============================= */
    if(awp_option('archives_style_border') == 'true'){ 

        $css_text .= ".awp_archive_widget { border:".awp_option('archives_style_border_width').' '.awp_option('archives_style_border_style').' '.awp_option('archives_style_border_color')." !important }\n";
        $css_text .= awp_option('archives_style_border_radius') == 'round' ? '.awp_archive_widget { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px }' : ''.''." \n";
    }
        $css_text .= ".awp_archives_colour { color:".awp_option('awp_archives_dropdown_inst_colour')." !important }\n"; 

    /**
     * Filter the unprocessed CSS array
     */
    $css_text = apply_filters('advanced_widget_pack_css', $css_text);

    header("Content-type: text/css");
    echo $css_text;
    exit();
}

This above function also works fine. It outputs a CSS file.

Share Improve this question edited Sep 25, 2013 at 2:21 Jason asked Sep 24, 2013 at 5:18 JasonJason 1532 silver badges9 bronze badges 4
  • I think you are misunderstanding how filters work. See: wordpress.stackexchange/a/103644/21376 – s_ha_dum Commented Sep 24, 2013 at 7:28
  • @s_ha_dum Do you know what would be the best way to pass the variable $wcss and it's contents to the function named 'advanced_widget_pack_css'? – Jason Commented Sep 25, 2013 at 1:40
  • I have been thinking about it. Your biggest problem is that the widget method runs after the <head> of the document. If not for that this would not be hard. – s_ha_dum Commented Sep 25, 2013 at 2:07
  • @s_ha_dum My whole goal here is to simply pass the dynamically generated CSS code from the widget class to another function that I created. I will append the above code snippet to show a WP AJAX function that I created that creates a dynamic CSS file. I could simply echo the $wcss variable code out to the page and it will display properly, however the plugin has 15 widgets and this would end up with very messy code. Therefore I would like to append any 'extra' generated CSS code onto the original AJAX generated CSS file. – Jason Commented Sep 25, 2013 at 2:18
Add a comment  | 

2 Answers 2

Reset to default 3
<?php
/**
 * Display the actual Widget
 *
 * @param Array $args
 * @param Array $instance
 */
public function widget($args, $instance){
    …
    $wcss = apply_filters( 'my-filter-name', $wcss );
    …
}
?>

To create your own filter hook just use the function "apply_filters" then as you mentioned add a function in your constructor i.e.

function __constructor()
{
    …
    add_filter( 'my-filter-name', array( &$this, 'my_function_name' );
    …
}

Be sure your function returns something

function my_function_name( $css )
{
    // Do whatever you want
    return $css;
}

First do apply_filters( 'your-filter-name', $wcss, $this ) into widget function. I put $this as third parameter as you might want other widget data for your function.

Then do

add_filter( 'your-filter-name', 'your-functin-name', 10, 2 );
function your-functin-name( $css, $data ) {
    // do your stuff
    return $css;
}

where ever you want.

发布评论

评论列表(0)

  1. 暂无评论