Using few the same widgets – wrong ID

Hi,

I’m missing the context for this issue ?? Where are you adding the $this->id code? Does $this->id fail if you have the Widget Shortcode active (and it works otherwise)? Any guide on how I could replicate this issue?

Hi

Please take a look here: https://ml.dev.pax1.eu/testy/wordpress/
There are 3 widgets in content and 3 widgets in sidebar.
There are wrong IDs in content: https://www.screencast.com/t/FBN5zGQNt8f
OK in sidebar: https://www.screencast.com/t/ofPp9Tnk

Thanks

I see. I checked and the -1 ID is set specifically by the the_widget function which is what the plugin uses in the plugin to display the widget outside a widget area.
Might I ask why you want this? Note that the widget wrapper has the proper ID, and if you wish to add the widget ID as a classname you could do:

<?php

function custom_widget_shortcode_classes( $atts ) {
	$atts['container_class'] .= ' widget-%1$s';
	return $atts;
}
add_filter( 'shortcode_atts_widget', 'custom_widget_shortcode_classes' );

The widget-{widgetID} class is now added to all widgets displayed by the plugin.

Hi

Thank you.
I have this code inside plugin:

		<script>
			jQuery(document).ready(
				function($)
				{
				    $('#<?php echo $this->id; ?> .pe-recent-posts-outer').carousel({
				    	interval: <?php echo $interval; ?>,
						pause: "<?php echo $slider_pause; ?>"
				    })
				}
			);
		</script>

I need a some way to get widget ID inside the plugin’s code.

Thanks.

Hi!

Inside the widget( $args, $instance ) method, you can access $args['widget_id'] and that properly outputs the widget ID. This is not overrided with a fake ID and so it should work as you expect.

Another alternative (which I personally prefer) would be to ditch the inline <script> tag and instead do it like so:

<script>
jQuery( function($) {
	$( '.pe-recent-posts-outer' ).each( function(){
		var $this = $( this );
		$this.carousel({
			interval: $this.data( 'interval' ),
			pause: $this.data( 'pause' )
		});
	} );
} );
</script>

And in your widget output, you’d use data-interval="" HTML attribute; this way the same JavaScript code is used for all the widgets and their parameters are dynamic as well.

Hope this helps!

Great support.

Thank you very much ??