Page Element Settings
Last updated
Last updated
The page element settings screen is invoked via the in the .
The element settings screen allows you to change settings and the design of a page element.
For all elements, the element settings screen consists of three tabs:
Options, Design and Advanced
The options tab generally consists of settings specific to the selected element.
However, there are two common settings that appear for all elements:
Name and Custom CSS Classes.
The Name setting allows you to provide a friendlier name to an element. By default the page editor assigns a sequential name for the element.
The Custom CSS Classes setting allows you to add one or more CSS classes to the page element. The classes can be from:
Custom CSS files or styles that you can define in the Page Settings or App Settings.
The example below shows the element settings specific to the Text element.
The common settings Name and Custom CSS Classes are present along with settings specific to the Text element.
Please refer to the element specific information sections for more information.
The design tab allows you to customize how the element gets rendered on your page.
These settings are organized into various categories like Font, Spacing, Border Radius, etc.
The settings in this tab require knowledge of HTML and CSS and hence we do not normally recommend modifying any settings here.
The standard based CSS classes that Zingy supports.
For quickly adjusting margin and padding settings using CSS classes, see .
Most page elements provide quick access to styling and design controls in the . You only need use the design tab if you are looking for something beyond what is offered.
Additionally the setting in the options tab also allows for style and design customization, using either standard based CSS classes that Zingy supports, or your own (if you provide your own CSS files or CSS style definitions).
The responsive design implementation allows you to control the look & feel for various screen sizes. For more information see .
The advanced tab provides HTML specific information about the selected element. This information can be used in scenarios like using custom javascript code in .
The Element ID shown in this tab is the for the element.
