3

I am providing a means for Mobile Widgets and Desktop Widgets in all custom widgets I am creating, so I think it would be a good idea to indicate if a widget is mobile/desktop in the title of the widget area in the backend so as to help make this section more user friendly.

Is there a filter that can be used to load up an image within the titlebar of widgets (to the left of the widget title), to include a mobile/desktop icon to be able to identify which active widgets are desktop and which active widgets are mobile, without having to open up the widget to see in the options of it?

Is there a hook somewhere in wordpress to capture this only in the backend admin widgets.php page? Would like to use php hook for when page loads. Already using jQuery for when option changes from mobile to desktop and vice versa. It's the initial load of the widgets page that has me needing to do this.

Possible?

Example below, if possible to do on initial widgets.php page load easily from within and extended WP_Widgets class file? Or filters, actions, etc...

enter image description here

So, I've tried to do the following like this inside the Widget class that extends WP_Widget:

function __construct() {

        parent::__construct(
            'social_media_widget',
            __('Social Media Widget', 'mydomain')
        );

        add_filter('dynamic_sidebar_params', array($this, 'my_sidebar_params'), 10, 1);

    }

    function my_sidebar_params($params) {

        $sidebar_id = $params[0]['id'];

        if (is_admin() && $params[0]['widget_name'] == 'Social Media Widget')
        {
            $_widget = get_option('widget_social_media_widget');

            if (!empty($_widget) && isset($_widget[$params[1]['number']]))
            {
                // $platform is being set in here as "desktop" because if I do a var_dump, it gives me "desktop", however, the image is not showing in the titlebar using before_title below... why?
                $platform = isset($_widget[$params[1]['number']]['platform']) ? $_widget[$params[1]['number']]['platform'] : '';
            }

            if (!empty($platform))
            {
                $params[0]['before_title'] = '<img src="' . get_stylesheet_directory_uri() . '/img/' . $platform . '-icon.png" alt="' . $platform . ' menu" class="menu-icon ' . $platform . '-icon" />';
            }
        }
    return $params;
}

So, $platform is the correct value now, but the image is not being attached before the title in the title bar of the admin Widgets area, so I'm not sure why it is not showing... Any ideas?

1 Answer 1

4

I believe you are looking for $params = apply_filters( 'dynamic_sidebar_params', $params ); (look here: https://github.com/WordPress/WordPress/blob/master/wp-includes/widgets.php#L706).

Now this filter will evaluate both in front end and back end. so to answer your question, you could wrap your filter in a if( is_admin() ){ // Do icons } check.

Better yet, you could define this at registration level with your register_sidebar( $args ) function. Check out Line 236 for the definition of the function and Line 250 for the actual argument you would need to customize conditionnaly. Something like this

$before_title = is_admin() ? '<span class="custom-icon"></span><h2 class="widgettitle">' : '<h2 class="widgettitle">';

$args = array(
  // ... your custom args definition
  'before_title' => $before_title,
);

register_sidebar( $args );

UPDATE

After digging deeper into code, my answer doesn't fit your need because of a few things.

  • Widget titles are being HTML escaped, so no tag can be rendered
  • A filter exists widget_title to override HTML escape behaviour, but it is not applied for the admin area, therefore we cannot modify this behaviour for your use case since it's already ecaped when printed on Line 229
  • So the only solution possible here is to revert back to jQuery/CSS to apply your desired glyphs
5
  • Thanks, but I need to know if $instance['platform'] == 'mobile' || $instance['platform'] == 'desktop' and not sure how to get a reference to $instance in the register_sidebar function, so I think I will have to do this in the class somewhere... Aug 9, 2016 at 5:15
  • Updated question with an attempt to get the value of platform by using get_option, however, even though it is getting the value of platform, it is still not applying it to the before_title param and is not showing initially as it should. How to do this? Aug 9, 2016 at 6:10
  • I'd have to dig deeper into the code, for some reason, the filter only applies to the front end and none of the options I pass to the constructor are taken into consideration when rendering the admin controls of the widget. My solution now would consider using jQuery to add/remove classes based on the user platform selection. Might not be what you are looking for but it still would get the job done. If I find a better solution, I will update here
    – bynicolas
    Aug 9, 2016 at 23:15
  • I found out that wordpress is using strip_tags to remove all html from within the title that gets put in there via $params for some reason. So, looks like the only viable solution is to echo it in a hidden div, than use jQuery to move it where it should be. Thanks for your help just the same. I hope there will be a filter for more flexibility on this in the future. Or better yet, a function inside the class. Aug 10, 2016 at 5:51
  • Exactly, some sort of escaping is used in the frontend too but a filter enables us to change that behaviour. Oh well we don't have that opportunity for the admin area. jQuery would definitely be a quicker solution. good luck!
    – bynicolas
    Aug 10, 2016 at 6:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.