Using 'Config Pages Module' in Drupal

Using 'Config Pages Module' in Drupal

When creating custom solutions for a client, you often encounter various situations related to their requirements. Sometimes, the client might want to implement a functionality that doesn't need to be managed, or it's so rare that it's not worth the time/money to create additional views where the client could modify the configuration.
Using Config Pages Module in Drupal

In such cases, the client turns to you and asks if you could do it in the code. It makes sense when the change involves just one line of code, and such requests occur at most once every six months. However, it's not always that simple, and for the implemented functionality, you might want to provide the client with a set of configuration options.

In this scenario, you would have to create a dedicated code responsible for:

  • displaying forms,
  • displaying values depending on the language,
  • placing it in the appropriate location in the menu.

Writing this type of code is quite repetitive, and at the same time, it's pretty lengthy and - as is often the case - prone to errors. So, I will describe a straightforward and interesting module to make your work easier: Config Pages.

1. Module configuration

This module is compatible with Drupal 10, which is good news. After you install and enable it, you will see a new tab called Config Pages in the administrative menu under the Structure tab.

 

Clicking on it will take us to the following view, where:

  • We can manage values for a specific configuration (Config pages)
  • We can manage configuration fields (Config pages settings)
     

 

By selecting the Config pages settings tab and then clicking the Add config page button, we can add our custom configuration, the result of which is presented below.

 

As you can see, this is a fairly simple form where you can set:

  • Label - the name displayed in the list of available configuration pages;
  • Tokens - field values of this configuration page will be accessible as tokens;
  • Menu placement - by specifying the path, you indicate in which tab it should be available;
  • Weight - it determines the position in the menu;
  • Description - text displayed below the link to the configuration page;
  • Context - setting the context based on language versions if you have multiple of them.


 

After selecting the Language option, you can decide whether the information that values for this configuration are context-dependent should be displayed or not. Below, I have presented an example situation where both options are enabled.

At this point, we can already see several advantages of using the Config Pages module, including:

  • Setting configuration per language,
  • The ability to use values as tokens,
  • Inserting the configuration page anywhere in the UI.

The above points would certainly generate a lot of code, but that's not all. After filling in sample data and creating the configuration page, let's move on to managing fields.

2. Managing fields for the configuration page

After creating a test page with configurations, it's time to manage fields. This is where all the magic happens, which would take a lot of time with standard programming.

As you can see below, this is a very familiar interface for managing fields for you. You can configure any field, and manage which fields should be visible on the page and which should not. There is also the option to define your view modes, and so on. All these functionalities are probably well-known to you if you create your Content Type or modify existing ones.

3. Example of use

You already know how to configure the module, and I hope you see its possibilities. I think we should try it out in practice now. Let's assume we are integrating Drupal with an external service through an API from which we will fetch data. To establish a connection, we also need a username and password. Our configuration page can have the following fields: 

  • URL for the base endpoint
  • Username
  • Password

Additionally, this configuration should be accessible in the UI at
/admin/config/services/my-integration.

 

 

 

Next, let's go to the tab /admin/config/services/my-integration, filling out the fields with sample data

 

The following snippet shows how you can retrieve the code both directly using a static method and by utilizing the service:

 

On the screen, the following information should be displayed:

4. Summary

The Config Pages module is beneficial when creating configuration fields. It provides a lot of possibilities and significantly speeds up work, especially when we need to create multiple fields. It's one of my favourite modules that I practically always install. Making even small configurations stops being a problem, and the client will surely appreciate that their functionalities are configurable and that changing values can be done instantly through the UI.