Drupal: Display Address Component In Another Field

Aug 11, 2025 by Henrik Larsen 51 views

Getting a Formatted Address Component in Another Field's Template

Hey guys! Ever found yourself needing to grab a specific part of an address, like the administrative area, and display it in another field on your content type? It's a common scenario, and I recently tackled this myself. I wanted to share my approach and hopefully help you out if you're facing the same challenge.

The Challenge: Extracting and Displaying Address Components

So, the main goal here is to extract a specific component from an address field – in this case, the administrative area – and then display it in a different field's template. Imagine you have a content type for events, and you want to automatically display the state or province where the event is taking place, based on the address entered. This is where pulling the administrative area comes in handy. I was able to accomplish this with some clever templating and a bit of Drupal magic, and I'm excited to walk you through the process.

Breaking Down the Requirements

Before diving into the code, let's clarify the requirements. We need to:

Access the Address Field: First, we need to be able to access the address field from our content type. This involves understanding how Drupal stores address data and how to retrieve it within a template.
Extract the Administrative Area: Once we have the address data, we need to pinpoint the administrative area component. This might involve digging into the structure of the address data and using the appropriate keys to get the desired value.
Display in Another Field's Template: Finally, we need to output the extracted administrative area in the template of another field. This means knowing how to target the correct template and insert the value in the right place.

Why This Matters

You might be wondering, why go through all this trouble? Well, extracting and displaying address components can be super useful for a variety of reasons:

Improved User Experience: By automatically displaying relevant information, you can make it easier for users to understand the context of your content. For example, showing the state or province alongside an event listing can quickly provide location information.
Data Consistency: By relying on the address field for location data, you can ensure consistency across your site. This avoids situations where users might enter different versions of the same location in different fields.
Dynamic Content: Extracting address components allows you to create dynamic content that changes based on the address entered. This can be used for things like generating maps, displaying nearby events, or even personalizing content based on the user's location.

Diving into the Solution

Alright, let's get into the nitty-gritty of how to actually achieve this. The key is leveraging Drupal's templating system and understanding how to access and manipulate field data.

Accessing the Address Field in Your Template

First things first, you need to access the address field within your template. The exact way you do this depends on the template you're working with. If you're working with a node template (like node--article.html.twig), you can typically access fields using the content variable. For example, if your address field is called field_address, you can access it like this:

{{ content.field_address }}

However, this will likely output the entire address field, including all its components. We need to dig deeper to get just the administrative area.

Extracting the Administrative Area

The address field in Drupal usually stores address components in a structured array. To get the administrative area, you'll need to access the correct key within this array. The exact key might vary depending on the address field implementation you're using, but it's often something like administrative_area or administrativeArea. You can use the kint() function (if you have the Kint module installed) or {{ dump(content.field_address) }} to inspect the structure of the address field and find the correct key.

Once you've identified the key, you can access the administrative area like this:

{{ content.field_address['#items'].0.administrative_area }}

Let's break this down:

content.field_address: This accesses the address field.
['#items']: This gets the items within the field.
.0: This accesses the first item (addresses are often stored as a list of items, even if there's only one).
.administrative_area: This gets the administrative area component.

Displaying in Another Field's Template

Now that we have the administrative area, we need to display it in the template of another field. This is where things get a bit more specific, as it depends on which field you want to display the administrative area in. Let's say you have a field called field_location_display where you want to show the administrative area. You'll need to find the template for this field (it might be something like field--field-location-display.html.twig) and add the code to output the administrative area there.

Within the field--field-location-display.html.twig template, you can access the administrative area using the same code we used before:

{{ content.field_address['#items'].0.administrative_area }}

However, there's a catch! The content variable in the field--field-location-display.html.twig template might not have access to the field_address field. We need to find a way to pass the administrative area value to this template.

Passing the Value to the Target Template

There are a few ways to pass the administrative area value to the target template. One common approach is to use the hook_preprocess_HOOK() function in your theme or a custom module. This allows you to modify variables before they're passed to the template.

Here's an example of how you might do this in your theme's *.theme file:

<?php

use Drupal\Core\Template\Attribute;

/**
 * Implements hook_preprocess_field().
 */
function mytheme_preprocess_field(&$variables) {
  if ($variables['field_name'] == 'field_location_display' && $variables['element']['#object'] instanceof \Drupal\node\NodeInterface) {
    $node = $variables['element']['#object'];
    if ($node->hasField('field_address') && !$node->get('field_address')->isEmpty()) {
      $administrative_area = $node->get('field_address')->first()->get('administrative_area')->getValue();
      $variables['administrative_area'] = $administrative_area;
    }
  }
}

Let's break this down:

hook_preprocess_field(): This is the hook we're using to preprocess field variables.
$variables['field_name'] == 'field_location_display': This checks if we're preprocessing the field_location_display field.
$variables['element']['#object'] instanceof \Drupal\node\NodeInterface: This ensures we're dealing with a node (content item).
$node = $variables['element']['#object']: This gets the node object.
$node->hasField('field_address') && !$node->get('field_address')->isEmpty(): This checks if the node has the field_address field and if it's not empty.
$administrative_area = $node->get('field_address')->first()->get('administrative_area')->getValue(): This is where we extract the administrative area value. We use the node object to get the field_address, then get the first item (assuming there's only one address), and finally get the administrative_area value.
$variables['administrative_area'] = $administrative_area: This sets a new variable called administrative_area in the template variables, making it available in the field--field-location-display.html.twig template.

Now, in your field--field-location-display.html.twig template, you can access the administrative area like this:

{{ administrative_area }}

Putting It All Together

So, to recap, here's the complete process:

Identify the target template: Determine the template for the field where you want to display the administrative area (e.g., field--field-location-display.html.twig).
Preprocess the field: Use hook_preprocess_field() in your theme or a custom module to extract the administrative area from the address field and add it as a variable to the template variables.
Output the value in the template: In the target template, use the new variable (e.g., {{ administrative_area }}) to output the administrative area.

Additional Tips and Considerations

Here are a few extra things to keep in mind when working with address components in Drupal templates:

Error Handling: Always check if the address field is empty or if the administrative area component is missing. This will prevent errors and ensure your site displays correctly.
Formatting: You might want to format the administrative area before displaying it. For example, you could convert it to uppercase or add a prefix like