Contact Sandbox

Pro 2.10.3 Multi-Step Forms With Lottie Icons

Two Col Layout Example

Desktop Only

Let's start with your name.

What is an email to be contacted at.

Phone number to be reached.

Sample Email Template

Hi Chris, [field id=”name”] would like you to reach them at.
Email Address [field id=”contact_email”]
Phone Number [field id=”contact_phone”]

CSS Used To Put Steps On Bottom.

.flipform .elementor-form {
display: flex;
flex-direction: column-reverse;
}

.flipform .e-form__indicators–type-number_text {
padding-top: 1.618em;
}

.flipform .e-form__indicators__indicator__progress {
margin-top: 13px;
}


Note: This will cause the success message to display at the top of the form. You may wish to use a different action after submissions such as a redirect, or pop-up if this bothers you.

Forms With Lottie Icons No Steps

Let's start with your name.

What is an email to be contacted at.

Phone number to be reached.

Step Templates Used

Put the shortcode of these in the form HTML widget.

Let's start with your name.

What is an email to be contacted at.

Phone number to be reached.

Lottie Icons Used

These were made in Ae with Font Awesome Pro Icons and Exported with Bodymovin Extension to JSON.

My Sandbox Website Contact Sandbox

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Opening Hours:
Monday – Friday 8am – 9pm

Phone: (310) 495 – 7015
Email: info@mysandboxwebsite.comĀ 

Address: Knoxville, TN