Fields of Style Customizer | WordPress's form builder plugin: AForms

AForms Eats PRO comes with a “Style Customizer” that allows you to customize the style of your order form.
In this article, we will explain the items that can be changed in Style Customizer.
The information is based on AForms Eats PRO v1.2.0.

General

Field Name	Type	Default	Description
Break Width	number	782	Specify the width in pixels that will be the boundary between the PC view and the smartphone view. If the width of the window is less than or equal to the value specified here, the form will be in the smartphone view.
Dark Theme	boolean	false	Specify whether your pages are whitish or blackish. In AForms Eats styling, the colors specified in each field are mixed with other colors or changed in brightness. The way the colors are mixed depends on whether the whole page is whitish or blackish.
Base Color	color	#111111	The basic text color. The default value is black.
Base Bgcolor	color	#FFFFFF	The basic background color. The default value is white.
Alt Bgcolor	color	#F0F0F0	Alternative background color. The default value is light gray.
Primary Color	color	#EB4166	The color to use for areas that stand out. The default value is dark pink.
Error Color	color	#DD4422	The color to use for errors, etc. The default value is red.
Rounded Corners	number	0	The width of the rounded corners of buttons or input boxes. Specify it in a pixel value.
Raise Buttons	boolean	false	Whether to add a shadow to the button.

Products

Field Name	Type	Default	Description
Max Form Width	number	600	Specify the maximum width of the form in pixels. This width does not include the details (shopping cart contents) displayed on the right side. The details are intended to be displayed on the right side of the form. If the details are sticking out of the screen, changing this field may improve the situation.
Form Padding	number	0	Specifies the inner margin (padding) of the form in a pixel value.
Navbar Height	number	60	Specify the height of the navigation bar (list of groups) displayed at the top of the form in a pixel value.
Cart Button Size	number	80	Specify the size (width and height) of the cart button that appears in the smartphone view in a pixel value.
Picture Width	number	292	Specify the width of the product photo in a pixel value. The products will be lined up horizontally, so if you decrease this number, you can have three or more products lined up horizontally.
Picture Height	number	250	Specify the height of the product photo in a pixel value.

Details

The “Details” is a component placed on the right side of the form that displays the cart contents and total amount.

Field Name	Type	Default	Description
Details Width	number	250	Specifies the width of the details in a pixel value.
Details Gap	number	20	Specify the margin between the form and the details in a pixel value. The details are to be displayed to the right of the form.

Attributes

Field Name	Type	Default	Description
Display in Table Format	boolean	false	When checked, the Customer Attributes area will be styled as a table.
Show Checkboxes as Plain	boolean	false	When checked, AForms’ own decorations will be removed from checkboxes and radio buttons to give them a standard look.
Show ‘Optional’ Tags	boolean	false	About “required” and “optional” tags. If checked, not only “required” tags but also “optional” tags will be displayed.
Show Tags in Front	boolean	false	About “required” and “optional” tags. If checked, the tag will be displayed before the field name.
Fill in Tags	boolean	false	About “required” and “optional” tags. If checked, the tag will be filled in and become decorative.
Disable Animation on Selection	boolean	false	Checkboxes and radio buttons are designed to animate when selected. If checked, this behavior will be disabled.
Disable Animation on Focus	boolean	false	Each component of your form is designed to animate when focused. If checked, this behavior will be disabled.

0 0