The outer HTML area
The outer HTML area affects all Visforms CSS classes of the outermost HTML div element generated by Visforms.
All CSS classes refer to the outermost div element generated by Visforms: <div class="visforms …"></div>.
The contiguous colored areas denote alternative classes that are mutually exclusive in the sense of ‘either or’.
| CSS Class | Scope | Appears | Origin / Configuration | Use Case |
|---|
| visforms | | Always |
Outermost div element created by Visforms.
<div class="visforms ..."></div>
|
Visforms |
| com-visforms | Renderer | When using | | Visforms: component |
| mod-visforms | Renderer | When using | | Visforms: Module |
| plg-vfdataview | Renderer | If used | | Visforms: Plugin Data View |
| plg-vfformview | Renderer | When using | | Visforms: Plugin Form View |
| CSS Class | Scope | Appears | Origin / Configuration | Use Case |
|---|
| visforms-form | Everything about the form | Always |
- Joomla configuration:
- Menu entry of type 'Visforms - Form'
- Menu entry of type 'Data View with Edit Link'
- Menu entry of type 'My Transmissions'
- Module of type 'Visforms'
- Visform's Plugin Form View
|
Form |
| visforms-form-form | Form | Plus |
|
Form: View |
| visforms-form-message | Form | Plus |
- Form configuration: 'Result' tab, 'Success text' option
|
Form: Success message |
| visforms-form-already-submitted-message | Form | Plus |
-
Form configuration: tab 'General'
- 'Force only transfer for logged-in users' option
- Option 'Show instead of form' = ' 'Only one transmission possible' Show message '
|
Form Alternative: One-Transfer-Possible-Only-Message View |
| visforms-form-edit | Form | Plus |
-
Form configuration: tab 'Data display in frontend'
- Option 'Allow frontend data view' = 'Yes'
|
Form: form in data editing view |
| visforms-form-edit-link | Form | Plus |
-
Form configuration: tab 'General'
- 'Force only transfer for logged-in users' option
- Option 'Show instead of form' = 'Show link for data editing
|
Form alternative: edit link view |
Use case: Saved Transmissions
| CSS Class | Scope | Appears | Origin / Configuration | Use Case |
|---|
| visforms-data | Everything about data | Always |
-
Form configuration: tab 'Result'
- Option 'Save result' = 'Yes'
|
Saved Transmissions |
| visforms-data-datas | Data | Plus |
-
Joomla configuration
- Menu item of type 'Visforms form data'
- Menu entry of type 'Data View with Edit Link'
- Menu entry of type 'My Transmissions'
|
Saved Transmissions: Record List |
| visforms-data-data | Data | Plus |
-
Joomla configuration
- Menu entry of type 'Form data single record'
-
Visforms configuration
|
Transfers Saved: Single Record |
| CSS Class | Scope | Appears | Origin / Configuration | Use Case |
|---|
| plg-vfdataview-default | Layout | Plus |
-
Visform's Plugin Data View
- Plugin string parameters: name 'layout', value: no value set
| Visforms Plugin Data View |
| plg-vfdataview-list | Layout | Plus |
-
Visform's Plugin Data View
- Plugin string parameters: name 'layout', value: 'list'
| Visforms Plugin Data View |
Use case: Joomla PageClass parameters
| CSS Class | Scope | Appears | Origin / Configuration | Use Case |
|---|
| Custom | Custom PageClass | Plus |
-
Joomla configuration
- Menu item configuration, tab 'Page display', parameter 'CSS class page'
-
Visforms Configuration: Display via Plugin Form View
- Plugin String Parameter: Name 'pageclass_sfx'
| Joomla PageClass parameters |