Get Early Access to GutenKit Page Builder Blocks

Mulstep form navigation without clicking over next step button

Yes, you can navigate the multi-step form without making the Next button visible (Implementation video https://d.pr/v/S8CQzA). To do that:

1. You have to add a custom CSS class to the Select field > Advanced > CSS classes

2. Similarly add a CSS class to the Next Step button.

3. Install the “Simple Custom JS and CSS” plugin > Add custom JS > and paste this code and publish:

setTimeout(()=>{
	jQuery( function( $ ) {
		if ( window.elementorFrontend ) {	
			$('.test-toggle input').click(()=>{	
				$('.test-next-button button').click();
			});	
		}
	} );
}, 500)

4. Make sure that the custom CSS class name is similar to your steps 1 and 2.

5. After that you can customize the Next Step button by an icon. If you want to hide the button, please copy and paste this code to Appearance > Customize > Additional CSS:

.test-next-button{
	visibility:hidden !important;
}

Video: https://d.pr/v/S8CQzA

What are your feelings
Updated on October 22, 2023