Add icons to form fields

[scottknz]

Hi,

I've been trying to add icons to form fields, like most modern forms now include (e.g. an email symbol on the left inside the form field)

Is this possible with CASPIO? We don't seem to have much control over the HTML of form elements and most of what I have read, especially for bootstrap css, requires a div element to be added to the form HTML element. For example:

<div class="form-group">
  <label class="control-label" for="email">
    Email
  </label>
  <div class="input-group">
    <div class="input-group-addon">
      @
    </div>
    <input class="form-control" id="email" name="email" type="text"/>
  </div>
</div>

Where the div class="input-group-addon" is a bootstrap class that inserts a icon at the start of the field.
Thanks,
Scott

[BaySunshine]

Hi @scottknz,

A simple way to show an icon is to save the email image on your web server. In the form, use an HTML block and click on the image button and add the URL of your email image. Specify the height, width etc. In the Advanced tab, select 'continue element on the same line' option.

Hope that helps.

Regards.

[PotatoMato]

Hello @scottknz, Caspio has a Youtube tutorial regarding "How to Add Icons Next to Field Names". I hope this helps.

 

- PotatoMato

 

[PotatoMato]

Hi! Just to update this post. You may also refer to this video tutorial regarding custom symbols: