HTML Components

Regular HTML elements may also be used to accept data from the user.

// Text
<div class="form-group">
   <label>Text</label>
   <input 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.