Skip to main content
  1. Home
  2. File upload

File upload

The file upload allows users to upload files.

You should only ask users to upload something if it’s critical to the delivery of your service.

File upload with label and hint

Input

= f.govuk_file_field :profile_photo,
  label: { text: 'Identification photograph' },
  hint: { text: 'Upload a clear colour photograph of yourself looking straight at the camera' }
<%= f.govuk_file_field :profile_photo, label: { text: 'Identification photograph' }, hint: { text: 'Upload a clear colour photograph of yourself looking straight at the camera' } %>

Output

Upload a clear colour photograph of yourself looking straight at the camera
<div class="govuk-form-group">
  <label for="person-profile-photo-field" class="govuk-label">
    Identification photograph
  </label>
  <div class="govuk-hint" id="person-profile-photo-hint">
    Upload a clear colour photograph of yourself looking straight at the camera
  </div>
  <input id="person-profile-photo-field" class="govuk-file-upload" aria-describedby="person-profile-photo-hint" type="file" name="person[profile_photo]" />
</div>

Related information