DSafari

Thanks Greg.

It seems like they are going towards needing page builders to add things like tabs, accordions, boxed content etc. These requirement will roll out in November so just want to make sure it’s on your roadmap.

Can help anyway I can ??

Yes, I would like to make a widget for contact form 7.

I know how to make widgets, just wanted to see if anyone knew of related code for getting available forms.

Thanks for your response Greg but I need another method other than shortcodes to comply with Theme Forests new guidelines.

Widgets in widgets is supported by WordPress and is implemented in other plugins, but due to how widgets are added in your page builder, this isn’t possible.

Do you have any other methods to implement accordions / tabs that could work well with your page builder only using widgets?

Would just like some insight as you know your plugins best.

Appreciate any help ??

Great. Thanks for implementing this ??

Change line 764:
{$tw_wrapper}.height( jQuery('.{$tw_wrapper}').height() );
to:
{$tw_wrapper}.height({$tw_wrapper}.height());

Your code doesn’t define height of tw_wrapper on start and it’s still jumpy on the first transition.

My code (2nd above) is smooth

Just checked and your code wrecks the first testimonial size – it’s too small.

Change line 764 to:
{$tw_wrapper}.height( {$tw_wrapper}.height() );

It’s just supposed to specify the css height of itself, not the active testimonial div (which is smaller).

This new code below now works perfectly for me and also takes into account the first animation now.

<script type="text/javascript">
var {$tw_wrapper} = jQuery('.{$id_base}');
tpadding = {$tw_wrapper}.height() - $('.testimonials-widget').height(); //tpadding is the difference in height to take into account all styling options
{$tw_wrapper}.height({$tw_wrapper}.height()); //fixes first animation by defining height to adjust

function nextTestimonial{$widget_number}() {
	if ( ! jQuery('.{$id_base}').first().hasClass('hovered') ) {
		var active = jQuery('.{$id_base} .active');
		var next   = (jQuery('.{$id_base} .active').next().length > 0) ? jQuery('.{$id_base} .active').next() : jQuery('.{$id_base} .testimonials-widget-testimonial:first-child');

		active.fadeOut(1250, function(){
			active.removeClass('active');
			next.fadeIn(500);
			next.removeClass('display-none');
			next.addClass('active');
			{$tw_wrapper}.animate({ height: next.height() + tpadding}); //added padding
		});
	}
}

Edit: added code tags

Sorry this version doesn’t take into account .testimonials-widget-testimonials padding and borders so it ends of being to small for the container.

My version had tpadding variable to take this into account.

That might be tricky…

Animated resizing of the div.

See:
https://s3.amazonaws.com/DigitalSafari/animatetestimonials.mov

Your code makes all widgets below jump around without the animation.

Hi Michael,

It’s on a dev site, so no examples besides using a limited width widget which would have varying height for each testimonial.

I dug into your code and it was an easyish fix. From line 728 of testimonials-widget.php please add:

<script type="text/javascript">
var tpadding = $('.testimonials-widget-testimonials').height() - $('.testimonials-widget').height();

function nextTestimonial{$widget_number}() {
	if ( ! jQuery('.{$id_base}').first().hasClass('hovered') ) {
		var active = jQuery('.{$id_base} .active');
		var next   = (jQuery('.{$id_base} .active').next().length > 0) ? jQuery('.{$id_base} .active').next() : jQuery('.{$id_base} .testimonials-widget-testimonial:first');

		active.fadeOut(1250, function(){
			active.removeClass('active');
			next.fadeIn(500);
			next.removeClass('display-none');
			next.addClass('active'); 						

			$('.testimonials-widget-testimonials').animate({
			height: next.height() + tpadding
			});

		});
	}
}

If you can’t add this (or similar) please let me know as I can just fork your code for myself – but I figure others will want this too.
Just 4 new lines of js.

Same issue:

Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 261900 bytes)

I think it’s just with the new version – could you please rollback.

Great! Thanks for implementing this.

Thanks for implementing this!

No worries. It’s actually working again so maybe some github downtime.

Thanks