HTML Components
Regular HTML elements may also be used to accept data from the user.
// Text
<div class="form-group">
<label>Text</label>
<input type="text" class="form-control" name="text">
</div>
// Email
<div class="form-group">
<label>Email</label>
<input type="email" class="form-control" name="email">
</div>
// Textarea
<div class="form-group">
<label>Textarea</label>
<textarea class="form-control" name="textarea"></textarea>
</div>
// Radiobuttons
<div class="form-group">
<label><input type="radio" value="Value1" name="radio"/>Value 1</label>
<label><input type="radio" value="Value2" name="radio"/>Value 2</label>
</div>
// Checkbox
<div class="form-group">
<label><input type="checkbox" value="Checkbox1" name="checkbox"/>Checkbox1</label>
<label><input type="checkbox" value="Checkbox2" name="checkbox"/>Checkbox2</label>
<label><input type="checkbox" value="Checkbox3" name="checkbox"/>Checkbox3</label>
</div>
// Checkbox boolean
<div class="form-group">
<label><input type="checkbox" name="checkboxBoolean" data-value-type="boolean"/>True/False</label>
</div>
// Single Selection
<div class="form-group">
<select id="select" name="single" class="form-control">
<option value="Value1">Value 1</option>
<option value="Value2">Value 2</option>
<option value="Value3">Value 3</option>
<option value="Value4">Value 4</option>
</select>
</div>
// Multiple selection
<div class="form-group">
<select id="multiple-select" multiple name="multiple" class="form-control">
<option value="Value1">Value 1</option>
<option value="Value2">Value 2</option>
<option value="Value3">Value 3</option>
<option value="Value4">Value 4</option>
</select>
</div>
Checkbox boolean
For checkboxes you can use the data attribute data-value-type="boolean"
to make it return true
or false
.
Hide settings for editors
By adding the data attribute "data-global-setting
" to a config element, it will only be visible in the addons area in the SiteVision editor.
Did you find the content on this page useful?