n Adding custom fields on Node type entity using the ThirdPartySettingsInterface | CodimTh

Please Disable Your Browser Adblock Extension for our site and Refresh This Page!

our ads are user friendly, we do not serve popup ads. We serve responsible ads!

Refresh Page
Skip to main content
On . By CodimTh

In this tuto, I'll show you how to add custom fields on configuration Node type entity using the ThirdPartySettingsInterface .

By default configuration Node type entity fields is like this:




In this article we are going to look at how to use the ThirdPartySettingsInterface to add some extra fields to existing configuration node type entity.

Today we are going to see an example of this and add an extra fields to the node type definition and store the value in this way.

There are a number of steps involved in this process. First, we need to alter the form with which the entity configuration data is added and saved. 

I added a new #entity_builder to the form which will be triggered when the form is submitted.

In this example  I'll add custom css class field to tag <body> for each node type.

Create mymodule.module file:


use Drupal\Component\Utility\Html;
use Drupal\Core\Form\FormStateInterface;
use Drupal\node\Entity\NodeType;
use Drupal\node\NodeInterface;
use Drupal\node\NodeTypeInterface;

 * @param $form
 * @param FormStateInterface $form_state
function mymodule_form_node_type_form_alter(&$form, FormStateInterface $form_state)

  // Load the current node type configuration entity.
  $node_type = $form_state->getFormObject()->getEntity();

  $form['custom_fields'] = array(
    '#type' => 'details',
    '#title' => t('Custom Fields'),
    '#group' => 'additional_settings',

  $form['custom_fields']['custom_body_classes'] = array(
    '#type' => 'textfield',
    '#title' => t('Classes CSS'),
    '#description' => t('Add classes to body tag.'),
    '#default_value' => $node_type->getThirdPartySetting('mymodule', 'custom_body_classes'),
  $form['#entity_builders'][] = '_mymodule_form_node_type_form_builder';

 * @param $entity_type
 * @param NodeTypeInterface $type
 * @param $form
 * @param FormStateInterface $form_state
function _mymodule_form_node_type_form_builder($entity_type, NodeTypeInterface $type, &$form, FormStateInterface $form_state)
  if ($form_state->getValue('custom_body_classes')) {
    $type->setThirdPartySetting('mymodule', 'custom_body_classes', $form_state->getValue('custom_body_classes'));
  } else {
    $type->unsetThirdPartySetting('mymodule', 'custom_body_classes');


The getThirdPartySetting(), setThirdPartySetting and unsetThirdPartySetting  methods on the entity object is provided by the ThirdPartySettingsInterface which all configuration entities have by default if they extend from the ConfigEntityBase class. 

We need also to add our configuration schema so that it becomes translatable. Inside the /config/schema/mymodule.schema.yml file of our module we need to add this:


  type: mapping
  label: 'Custom Fields'
      type: text
      label: 'Add classes to body tag'


With this schema definition we are basically appending to the schema of the node.type config node type entity by specifying some metadata about the third party settings our module provides. For more information on config schemas be sure to check out the docs on Drupal.org.

After adding our custom fields  to existing config node type entity the result is like this:




To add a specific css class to body tag in Drupal 8 I will use hook_preprocess_html().

 * @param $variables
function mymodule_preprocess_html(&$variables)
  $node = \Drupal::routeMatch()->getParameter('node');
  if ($node instanceof NodeInterface) {
    $node_type = NodeType::load($node->bundle());
    if ($node_type instanceof NodeTypeInterface && $classes = $node_type->getThirdPartySetting('mymodule', 'custom_body_classes'))
      $classes_array = explode(' ', $classes);
    foreach ($classes_array as $class) {
      $variables['attributes']['class'][] = Html::cleanCssIdentifier($class, []);


Finally, here's the result after adding CSS classes to node type. these classes will be show in <body> tag.



Riadh Rahmi

Senior Web Developer PHP/Drupal & Laravel

I am a senior web developer, I have experience in planning and developing large scale dynamic web solutions especially in Drupal & Laravel.

Web Posts


Page Facebook