Drupal how to automatically add Image ALT text from other field values (requires 720p quality)

IMPORTANT!
To better view the demonstration and avoid a low-res, blurry video, please switch your viewing to at least 720p quality (found in the YT video controls: gear icon, quality, set to at least 720p).

Actual demonstration, with necessary permissions for some content used and shown. This should work the same way with Drupal versions 8,9, and 10 (D11 is to be tested, but should be ok since modules are supported).

Here's a more detailed guide on how to set up automatic image alt text generation using the Image Field Tokens module in Drupal. It includes the steps to insert tokens and enable the necessary formatters from the Manage Form and Manage Display sections of a content type.

Step 1: Install the Image Field Tokens Module

Step 2: Configure the Image Field to Use Tokens for Alt Text in your Content
Type (Field Settings, Manage Forms, and Manage Display)

Insert Tokens into the Alt Text Field:
In the Alt text configuration section, you will see a text box where you can insert tokens.

Click on Browse available tokens (/admin/modules) to view a list of available tokens. Insert the relevant tokens that correspond to other fields in your content type. For example:

[node:field_first_name] [node:field_last_name]

This will now output generated field values from the given fields.

Step 3: Test the Configuration

Create or Edit Content:

Go to Content , Add content, and select your content type (e.g., "Member Profile"). Fill in the fields, including the image upload field.
Check the Alt Text:
After saving the content, the alt text for the image should be automatically populated with the values you configured using tokens (e.g., the first and last name).

Modules used:

Image module (core installed/bundled already by default with Drupal installation)

Image Field Tokens - https://www.drupal.org/project/imagef...

We hope this helps, if you need help, check out our Drupal services: https://www.ibuild.ph/services/web-de...

To learn more, visit and sign up for our training on web design and development, SEO, and digital marketing online courses:
https://www.ibuild.ph/training