There are several ways to handle ALT text for images in Backdrop.
Alternative text in image fields on Nodes
In Drupal 7 core the text was stored in the same field as the reference to the image. This is how Backdrop CMS handles ALT text on images out of the box.
Alternative text in text fields on Files
If you would prefer to handle ALT text the way it is handled by Drupal 7's file_entity module, where the text was stored in a field on the File entity, that is also relatively simple to achieve.
All that is needed is a preprocess implementation in your theme.
The following will make this change only for a field named field_image
function mytheme_preprocess_field(&$variables){
if ($variables['element']['#field_name'] == 'field_image') {
$lang = LANGUAGE_NONE;
$image = $variables['items'][0]['#item'];
$field_alt = $image['field_alt'][$lang][0]['safe_value'];
$variables['items'][0]['#item']['alt'] = $field_alt;
}
}The following will make this change for all image fields field_image
function mytheme_preprocess_field(&$variables) {
if ($variables['element']['#field_type'] == 'image') {
$lang = LANGUAGE_NONE;
$image = $variables['items'][0]['#item'];
$field_alt = $image['field_alt'][$lang][0]['safe_value'];
$variables['items'][0]['#item']['alt'] = $field_alt;
}
}Fallback ALT text on nodes
If you would like to use the text stored on the node, only when there is no text stored on the file entity, you can add a check for that value before overwriting the default.
This approach is only recommended if most of your ALT text is stored on nodes, and has not yet been migrated over to Files.
function mytheme_preprocess_field(&$variables) {
if ($variables['element']['#field_type'] == 'image') {
$lang = LANGUAGE_NONE;
$image = $variables['items'][0]['#item'];
if (isset($image['field_alt']) && !empty($image['field_alt'][$lang])) {
$field_alt = $image['field_alt'][$lang][0]['safe_value'];
$variables['items'][0]['#item']['alt'] = $field_alt;
}
}
}ALT text on nodes as an override for ALT text on Files
My favorite and recommended approach is to allow the ALT text to be stored on files, since the text should be a verbal description of what is seen in the image. I like to use the ALT text on nodes as an override, for the rare cases when you need a slightly different description for the context, since the node provides the necessary context.
function mytheme_preprocess_field(&$variables) {
if ($variables['element']['#field_type'] == 'image') {
// Start with an empty alt tag.
$alt = '';
// Set the file ALT as default.
$lang = LANGUAGE_NONE;
$image = $variables['items'][0]['#item'];
if (isset($image['field_alt']) && !empty($image['field_alt'][$lang])) {
$alt = $image['field_alt'][$lang][0]['safe_value'];
}
// Overwrite with image ALT.
if (!empty($image['alt'])) {
$alt = $image['alt'];
}
$variables['items'][0]['#item']['alt'] = $alt;
}
}The node edit form shouldn't confuse the editor
Set the default value on the image ALT field
function mymodule_form_node_form_alter(&$form, &$form_state) {
if (isset($form['field_image'])) {
$lang = LANGUAGE_NONE;
foreach ($form['field_image'][$lang] as $delta => $image) {
if (isset($image['#entity_type'])) {
$file_alt = $image['#default_value']['field_alt'][$lang][0]['safe_value'];
$form['field_image'][$lang][$delta]['#default_value']['alt'] = $file_alt;
}
}
}
}Prevent ALT text from being saved in two locations
When the Node form is saved, this text fron the File is likely to be saved onto the Node. Some work will need to be done to prevent that. Either: compare the two values, and don't save to the Node if they are an exact match. Or, don't add the File text as a default value, but instead set it as a placeholder.
How to add the ALT text to the file
The image field has a nice file-upload widget, but it does not provide a complete entity form. So how do you add the ALT text to the file?
Note: The above code samples assume you have added a field named field_alt to your File entity for type Image.