Contact Form widget
Creating product page you may need a contact form to let your customers contact you anytime they need. Add it using this widget.
Content Settings
Form Fields
In this section you see a list of buttons. You can change them or add new. To change the section field (for example, "Name" field), click on the appropriate button and you will see available settings:
- Set field's type (telephone, text, email, etc.).
- Give section the name.
- Set label and placeholder (they must be similar to the name).
- Required - mark the field as required, if you need it.
- Set column width.
Customize every field separately in the same way. Also, here you can set up:
- Input size.
- Labels - show or hide labels.
- Required marks - showe or hide required marks.
Submit Button
Submit button has own settings:
- Text - enter input text of the button.
- Size - set the size of the button.
- Column width - set the width.
- Alignment - set button's position in the section.
- Icon - select icon for the button.
- Icon position - set the icon before of after text.
- Icon spacing - set the distance between text and icon inside the button.
Email & Options
Here you can enter text of the message, that will be sent to the customer after he sent a message to you. Also, you can add a redirect URL. In this case, a message will be redirected to another page if needed.
Style Setting
Form
- Set column and rows gap.
- Set spacing, typography, text and mark color for Labels.
- Set border width, typography, text, background and border color for "Success" message.
Field
- Set text color.
- Typography - set size, font, style, letter spacing, etc.
- Choose background color.
- Set border color, width and radius.
- Set text padding.
Button
for Normal position are available next settings:
- Text and background color
- Typography
- Border type and radius
- Text padding
for Hover position are available next settings:
- Color settings - text, background
- Animation - set the animation of the section.
Advanced Settings
- Element Style (margin, padding, entrance appearance).
- Background & Border (type, radius, box shadow).
- Responsive (hide or show it on a desktop, tablet, mobile).