Using add_filter() in Widgets

Just have a query reference the add_filter() function.

Can you use this function inside a WordPress widget class.

Read More

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.

Related posts

2 comments

  1. <?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;
    }
    
  2. 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.

Comments are closed.