Masks Form Fields vs StepraEngine Lite

Add a class in the form field. Example of use with Contact Form 7: [tel your-phone class:phone placeholder "Phone"] Listing of classes available for use. ('span.start, input.start').mff_mask('00/0000'); ('span.date, input.date').mff_mask('00/00/0000'); ('span.time, input.time').mff_mask('00:00:00'); ('span.time2, input.time2').mff_mask('00:00'); ('input.date_time').mff_mask('00/00/0000 00:00:00'); ('input.date_time2').mff_mask('00/00/0000 00:00'); ('input.cep').mff_mask('00000-000', { clearIfNotMatch: true }); ('input.zip').mff_mask('00000'); ('input.phone, input[name="phonebr"]').mff_mask(PhoneMaskBehavior, nonoOptions); ('input.phone_us').mff_mask('(000) 000-0000'); ('input.taxid').mff_mask('00-0000000'); ('input.ssn').mff_mask('000-00-0000'); ('input.mixed').mff_mask('AAA 000-S0S'); ('input.cpf').mff_mask('000.000.000-00', { reverse: true, clearIfNotMatch: true }); ('input.cnpj').mff_mask('00.000.000/0000-00', { reverse: true, clearIfNotMatch: true }); ('input.money').mff_mask('000.000.000.000.000,00', { reverse: true }); ('input.money2').mff_mask('#.##0,00', { reverse: true }); ('input.money3').mff_mask('#,##0.00', { reverse: true }); ('input.money4').mff_mask('000,000,000,000,000.00', { reverse: true }); ('input.money5').mff_mask('#.##0', { reverse: true }); ('input.money6').mff_mask('#,##0', { reverse: true }); ('input.ip_address').mff_mask('099.099.099.099'); ('input.percent').mff_mask('##0,00%', { reverse: true }); ('input.percent2').mff_mask('##0.00%', { reverse: true }); ('input.percent3').mff_mask('990,0%', { reverse: true }); ('input.percent4').mff_mask('990.0%', { reverse: true }); ('input.percent5').mff_mask('#,##0%', { reverse: true }); ('input.percent6').mff_mask('#.##0%', { reverse: true }); Click here for more details on how to add custom mask. Optional – Added option for the format of the Brazilian phone number, with attribute name equal to phonebr. Credits jQuery Mask Plugin

StepraEngine Lite turns long WordPress forms and WooCommerce classic checkout into clean, responsive multi-step forms, multi-page forms, and checkout steps using the form wizard layout visitors expect. It works with your existing form builder or WooCommerce classic checkout and adds step navigation, progress styles, Next and Previous buttons, and required-field validation. Your original form plugin still controls fields, submissions, email notifications, entries, spam protection, and integrations. WooCommerce still controls checkout fields, shipping, payment, order review, coupons, and final order placement. StepraEngine is a form wizard plugin for WordPress that improves the frontend form and checkout experience without replacing your form builder or WooCommerce. Supported Form Builders and Checkout StepraEngine Lite adds multi-step forms and checkout steps to: Contact Form 7 — Contact Form 7 multi-step forms WPForms standard forms — WPForms multi-step forms Forminator — Forminator multi-step forms Elementor Forms — Elementor multi-step forms WooCommerce Classic Checkout — WooCommerce multi-step checkout Why Use StepraEngine Lite? Long WordPress forms and long WooCommerce checkout pages can feel hard to complete, especially on mobile. StepraEngine helps by splitting the form or checkout into a multi-step form wizard so visitors move through one section at a time instead of facing every field at once. You can use StepraEngine Lite’s multi-step form wizard for: Contact forms Quote request forms Booking request forms Lead capture forms Onboarding forms Survey forms Service request forms Form wizard layouts WooCommerce checkout steps WooCommerce multi-step checkout flows No Form Rebuilding StepraEngine does not make you rebuild your forms inside a new system. You keep using Contact Form 7, WPForms, Forminator, Elementor Forms, or the standard WooCommerce classic checkout. StepraEngine adds the multi-step form wizard or checkout step layout around the form or checkout that already exists on your site. Automatic and Manual Step Splitting StepraEngine Lite supports automatic and manual step splitting for WordPress multi-step forms and WooCommerce checkout steps. Automatic splitting lets StepraEngine divide supported long forms into steps. Manual splitting lets you control where steps begin: Contact Form 7 multi-step forms: use H3 or H4 headings in the form template. Elementor multi-step forms: use HTML fields containing H3 or H4 headings. Forminator multi-step forms: use Section fields. WPForms multi-step forms: StepraEngine uses WPForms field containers for automatic splitting. WooCommerce multi-step checkout: StepraEngine uses classic checkout sections such as billing, shipping, order details, and payment. Checkout H3 or H4 headings can be used as step titles where present. You can also enable Strict H3 mode if you want only H3 headings to create manual step breaks. WooCommerce Classic Checkout Steps StepraEngine Lite can turn the standard WooCommerce classic checkout into a WooCommerce multi-step checkout without replacing WooCommerce checkout, payment, shipping, coupons, or order placement. WooCommerce checkout in Lite can use up to 4 checkout steps. This gives stores a cleaner checkout flow while keeping the native WooCommerce order review and payment process in control. StepraEngine Lite does not include the WooCommerce review summary feature. The WooCommerce review summary is available in StepraEngine Pro. Progress Styles StepraEngine Lite includes two progress styles for your multi-step form wizard and WooCommerce multi-step checkout: Bar progress Numbered progress With numbered progress, visitors can click completed previous steps to go back. Future steps stay locked so visitors cannot skip required validation. Basic Customization StepraEngine Lite includes basic customization controls for progress style, colors, button labels, validation language, and heading behavior. Advanced customization, unlimited form steps, WooCommerce review summary, deeper checkout enhancements, and priority email support are available in StepraEngine Pro. Validation and User Experience StepraEngine checks the current step of your multi-step form or WooCommerce checkout before allowing visitors to continue. Validation helpers include: Required fields Email format URL fields requiring http:// or https:// Phone number format Postal code format Date year range If the original form plugin or WooCommerce checkout returns a validation error after submission, StepraEngine can return the visitor to the step containing the invalid field when supported. Mobile-Friendly Multi-Step Forms StepraEngine Lite is designed for responsive multi-step form, multi-page form, and WooCommerce checkout flows. It helps long WordPress forms and checkout pages feel cleaner on desktop, tablet, and mobile by showing one step at a time. The final design still depends on your theme and form builder styling. Upgrade to Pro StepraEngine Pro adds unlimited form steps, WooCommerce review summary, advanced customization, deeper checkout enhancements, and priority email support. How to upgrade from Lite: Open your WordPress admin dashboard. Go to StepraEngine > Upgrade. Review the Lite vs Pro comparison and available Pro plans. Choose a Pro plan and complete checkout through the secure Freemius checkout. Download StepraEngine Pro from the purchase screen, your Freemius account, or the purchase email. Go to Plugins > Add New > Upload Plugin and upload the Pro ZIP file. Activate StepraEngine Pro and activate your license. When Pro is activated, the Lite version is automatically deactivated to prevent duplicate StepraEngine runtimes. Compatibility Notes StepraEngine Lite does not replace your form builder. Your original form plugin remains responsible for fields, entries, email notifications, spam protection, integrations, and final submission. If your form already uses native multi-step, pagination, or another multi-step add-on on the same form, StepraEngine may pause on that form to help prevent layout and validation conflicts. To use StepraEngine Lite on a form, disable the form builder’s native multi-step or pagination feature for that form. Advanced payment fields, conditional logic, third-party add-ons, or heavily customized form templates may require additional compatibility testing. For WooCommerce, StepraEngine Lite targets the standard/classic checkout flow and requires WooCommerce 6.0 or higher. WooCommerce Block Checkout or third-party multi-step checkout plugins should be tested separately and should not be combined on the same checkout flow. StepraEngine Lite includes WooCommerce classic checkout steps. StepraEngine Lite does not include the WooCommerce review summary feature; that is available in StepraEngine Pro.