Table of Contents
Sometimes we come across situations where we are in a desperate need to add custom classes to the wordpress widget specifically to the individual elements to meet some specific design or functionality requirements.
I was facing the same issue and ended up spending hours in searching for a feasible solution. And, after going through so many online articles and posts and spending hours.. I came across a solution that I thought to share and create a summarized post that might help saving your time and efforts.
Register a WordPress Widget
Add the following piece of code to your plugin or theme functions.php file.
if ( function_exists('register_sidebar') ) {
$mySidebar = array(
'id' => 'yourUniqueSidebarId',
'before_widget' => '<div class="widget %2$s">',
'after_widget' => '</div>',
'before_title' => '<h2 class="widget_title">',
'after_title' => '</h2>',
'name'=>__( 'Your Sidebar Name', 'textdomain' ),
);
register_sidebar( $mySidebar );
}
Add Custom Class To Your Widget Element
Adjust your conditional checks as per need. You can check and apply it for all “Image” widget elements or further restrict to a specific sidebar widget using sidebar id.
if(!is_admin()){
add_filter( 'dynamic_sidebar_params', 'my_add_widget_class' );
function my_add_widget_class( $params ) {
if(!empty($params) && $params[0]['widget_name']=='Image' && $params[0]['id']=='yourUniqueSidebarId'){
$params[0] = array_replace($params[0], array('before_widget' => str_replace("widget_media_image", "widget_media_image sg-footer-ter", $params[0]['before_widget'])));
}
return $params;
}
}
Place this script in your functions.php file
This is tested code and I hope it helps you as well. Good luck.