ExpressionEngine Docs

# Other Channel Fields

For all of the other channel fields, you have several options for outputting the form field.

### Custom Fields Tag Pair

The Custom fields tag pair will conveniently show all your custom fields, but it has limited design flexibility.

    {custom_fields}

        <label for="{field_name}">{if required}* {/if}{field_label}</label>
        {field_instructions}
        {formatting_buttons}

        {if error}
          <p class="error">{error}</p>
        {/if}

        {if text}
          <input type="text" dir="{text_direction}" id="{field_name}" name="{field_name}" value="{field_data}" maxlength="{maxlength}" size="50">
        {/if}

        {if grid}
          {display_field}
        {/if}

        {if multiselect}
          <select id="{field_name}" name="{field_name}[]" multiple="multiple">
            {options}
              <option value="{option_value}"{selected}>{option_name}</option>
            {/options}
          </select>
      {/if}

    {/custom_fields}

### `{field:}`

To output an individual field, the `{field:}` tag is available:
Your Custom Field (Text field)

{error:my_field_name}
{field:my_field_name} For example, if your field is called `zipcode`, you would use:

    <label for="zipcode">Your Custom Field (Text field)</label>
    <div class="error">{error:zipcode}</div>
    {field:zipcode}

The field tag should output all of the required html needed for either a new entry or an edit.

## Manually Constructed Input Fields

In rare cases, the field tag may not be flexible enough for the desired output. In that case, most native fields can be manually coded.

### Checkbox field

    {options:my_field_name}
      <input type="checkbox" name="my_field_name[]" value="{option_value}"
       {checked}  {option_name}</br>
     {/options:my_field_name}

See the {options:my_field_name} tag pair.

### Date field

    <input type="text" id="my_field_name" name="my_field_name" value="{my_field_name}" size="50">

Note: inclusion of the localization select field is not currently supported, whether constructing the field manually or using variables.

### File field

There are several additional inputs that may be specified when manually constructing a file field:

- `my_field_name_directory` - the file directory the image is assigned to. This field is required if submitting a file.
- `my_field_name_hidden_directory` - if specified, this will take precedence over `my_field_name_directory` and can be used to allow editing.
- `my_field_name_hidden_file` - the name of an existing, uploaded file. If specified, this will take precedence over `my_field_name` and can be used to allow editing.

If editing entries, you will need to specify the existing directory and file name or the file content will be lost :

    <input type="file" name="my_field_name" />
    <input type="hidden" name="my_field_name_directory" value="1" />
    <input type="hidden" name="my_field_name_hidden_file" value="{my_field_name}{file_name}{/my_field_name}" />

Note: For the `hidden_file` input, use the variable pair to pull in only the `{file_name}` since we’re already providing the directory above.

Note: If you want to allow users to change the file associated with the entry when editing, you will need to provide a way (typically Javascript) to reset the my_field_name_hidden_file to empty.

### Grid field

Manual construction of grid type fields is not supported. Most customization of grid fields can be done by overriding the CSS.

### Multi Select field

    <select name="my_field_name[]" id="my_field_name" multiple size="2">
      {options:my_field_name}
        <option value="{option_value}"{selected}>{option_name}</option>
      {/options:my_field_name}
    </select>

See `{options:my_field_name}` tag pair.

### Radio field

    {options:my_field_name}
      <input type="radio" name="my_field_name" value="{option_value}" {checked}>
        {option_name}</br>
    {/options:my_field_name}

See `{options:my_field_name}` tag pair.

### Relationship field

Simple relationship fields with only 1 relationship allowed are very similar in format to Multi Select fields, though note the slight variation in name:

    <select name="my_field_name[data][]" id="my_field_name">
      {options:my_field_name}
        <option value="{option_value}"{selected}>{option_name}</option>
      {/options:my_field_name}
    </select>

For relationship fields that allow multiple selections, you may also set the sort order:

    {options:my_field_name}
        Order:
        <input type="text" name="my_field_name[sort][]" value="{option_order}" />
        <input type="checkbox" name="my_field_name[data][]" value="{option_value}" {checked}/>
        {option_name}<br />
    {/options:my_field_name}

### Select field

    <select name="my_field_name" id="my_field_name">
      {options:my_field_name}
        <option value="{option_value}"{selected}>{option_name}</option>
      {/options:my_field_name}
    </select>

See `{options:my_field_name}` tag pair.

### Text Input field

    <input type="text" name="my_field_name" id="my_field_name" value="{my_field_name}">

### Textarea field

    <textarea name="my_field_name" id="my_field_name" cols="90" rows="10">{my_field_name}</textarea>