Title: Increase widget with 1
Last modified: August 31, 2016

---

# Increase widget with 1

 *  Resolved [alvinkonda](https://wordpress.org/support/users/alvinkonda/)
 * (@alvinkonda)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/increase-widget-with-1/)
 * Hello,
 * Let’s say we have 4 widgets on a particular sidebar
 * what i would like to accomplish with the “before widget” is that for each widget
   i should add this tag
 * data-id=”1″
    data-id=”2″ data-id=”3″ data-id=”4″
 * i cant seem to find the autoincrement correctly with the “before widget” code
 * Any idea?
 * Thanks in advance
    Alvin

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Thread Starter [alvinkonda](https://wordpress.org/support/users/alvinkonda/)
 * (@alvinkonda)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/increase-widget-with-1/#post-7057641)
 * I found the solution exactly what i was looking for
 * [https://wordpress.org/support/topic/how-to-first-and-last-css-classes-for-sidebar-widgets?replies=9](https://wordpress.org/support/topic/how-to-first-and-last-css-classes-for-sidebar-widgets?replies=9)
 *  Thread Starter [alvinkonda](https://wordpress.org/support/users/alvinkonda/)
 * (@alvinkonda)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/increase-widget-with-1/#post-7057642)
 * Topic Closed
 *  Thread Starter [alvinkonda](https://wordpress.org/support/users/alvinkonda/)
 * (@alvinkonda)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/increase-widget-with-1/#post-7057643)
 * Just in case someone might need to add CSS3 animations like this [http://jackonthe.net/css3animateit](http://jackonthe.net/css3animateit)
 * here is the hook to create Data id’s for each widget
 *     ```
       /**
        * Add data Id for CSS3 animate plugin
        */
       function CSS3_Data_ID($params) {
   
       	global $my_widget_num; // Global a counter array
   
       	$this_id = $params[0]['id']; // Get the id for the current sidebar we're processing
   
       	$arr_registered_widgets = wp_get_sidebars_widgets(); // Get an array of ALL registered widgets	
   
       	if(!$my_widget_num) {// If the counter array doesn't exist, create it
       		$my_widget_num = array();
       	}
   
       	if(!isset($arr_registered_widgets[$this_id]) || !is_array($arr_registered_widgets[$this_id])) { // Check if the current sidebar has no widgets
       		return $params; // No widgets in this sidebar... bail early.
       	}
   
       	if(isset($my_widget_num[$this_id])) { // See if the counter array has an entry for this sidebar
       		$my_widget_num[$this_id] ++;
       	} else { // If not, create it starting with 1
       		$my_widget_num[$this_id] = 1;
       	}
   
       	$data_id = 'data-id="' . $my_widget_num[$this_id] . ''; // Add a widget number class for additional styling options
   
       	/* if($my_widget_num[$this_id] == 1) { // If this is the first widget
       		$class .= 'widget-first ';
       	} elseif($my_widget_num[$this_id] == count($arr_registered_widgets[$this_id])) { // If this is the last widget
       		$class .= 'widget-last ';
       	} */
   
       	$params[0]['before_widget'] = str_replace('data-id="', $data_id, $params[0]['before_widget']); // Insert our new classes into "before widget"
   
       	return $params;
   
       }
       add_filter('dynamic_sidebar_params','CSS3_Data_ID');
       ```
   

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Increase widget with 1’ is closed to new replies.

## Tags

 * [before](https://wordpress.org/support/topic-tag/before/)
 * [increment](https://wordpress.org/support/topic-tag/increment/)
 * [widget](https://wordpress.org/support/topic-tag/widget/)

 * 3 replies
 * 1 participant
 * Last reply from: [alvinkonda](https://wordpress.org/support/users/alvinkonda/)
 * Last activity: [10 years, 3 months ago](https://wordpress.org/support/topic/increase-widget-with-1/#post-7057643)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics