![]() |
Languages: |
English |
This form field makes it possible to create titles, texts, descriptions and even alert boxes. It also allows you to bring order in the settings for extensions, by separating them with useful titles. Or adding descriptions for certain settings (without having to rely on the tooltips). Or adding any other text you want.
The syntax is pretty straight-forward:
<field name="..." type="note" label="..." description="..." class="..." close="..." />
Contents |
In the following code examples we will use these example language strings:
LOREMIPSUM="Lorem ipsum dolor sit amet" LOREMIPSUM_DESC="Consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat."
So with this note field you can either use the title or the description or both.
<field name="opt10" type="text" label="Some Other Option" /> <field name="note11" type="note" label="LOREMIPSUM" /> <field name="opt11" type="text" label="Some Other Option" /> <field name="note12" type="note" description="LOREMIPSUM_DESC" /> <field name="opt12" type="text" label="Some Other Option" /> <field name="note13" type="note" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt13" type="text" label="Some Other Option" />
File:Help25-note-form-field-title-screenshot.png
You can add classes to the note. This way you can make (bootstrap) alerts very easily. But also any other styling via class names you want (like a 'well').
<field name="opt20" type="text" label="Some Other Option" /> <field name="note21" type="note" class="alert" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt21" type="text" label="Some Other Option" /> <field name="note22" type="note" class="alert alert-info" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt22" type="text" label="Some Other Option" /> <field name="note23" type="note" class="alert alert-success" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt23" type="text" label="Some Other Option" /> <field name="note24" type="note" class="alert alert-error" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt24" type="text" label="Some Other Option" />
File:Help25-note-form-field-classes-screenshot.png
A close button can be added to the alerts by adding the close="true" attribute to the tag. If you use a different class than the alert, use the required value for the data-dismiss of the bootstrap close icon instead of the value "true". But here is the code to test the close icon on an alert.
<field name="opt30" type="text" label="Some Other Option" /> <field name="note31" type="note" class="alert" close="true" label="LOREMIPSUM" description="LOREMIPSUM_DESC" /> <field name="opt31" type="text" label="Some Other Option" />
File:Help25-note-form-field-close-screenshot.png