Using Environment Indicator in Drupal 7

Every Drupal site builder will at some point experience the dread of accidentally making configuration changes on production thinking it’s their local site. This sort of thing can easily happen when you have 20 tabs opened and forget which site you’re currently browsing.

Luckily there’s a module you can use to indicate which environment (local, staging, production, etc.) you’re currently viewing and it’s called Environment Indicator.

The module helps to separate each environment by displaying a coloured indicator. The indicator itself is fully configurable. You can change its colour, position and text.

In this tutorial, you’ll learn how to create an indicator in two ways: through the module’s UI and with some code in settings.php.

Getting Started

Before we jump into things, head over to drupal.org and download and install Environment Indicator and Ctools.

If you prefer using Drush, run the following two commands:

$ drush dl environment_indicator ctools

$ drush en environment_indicator

How to Create an Indicator

We’ll first look at how to create an indicator through the module’s interface. This is by far the simplest way to create one.

1. Go to Configuration, “Environment indicators” and click on Add.

Fig 1.0

2. In the Name field, enter in the name of the indicator. For this tutorial, I’ll enter in “Local”. If you were creating one for a staging site then you could name it “Staging”.

In the Hostname field, enter in the hostname for this particular environment. For my setup, I’ll enter in d7.localhost. But your hostname will be different. Again, if you’re setting this up for a staging site you should enter in the hostname of the site. Something like “staging.example.com”.

Fig 1.1

3. From the next two colour wheels you can select the colour of the indicator and its text.

Fig 1.2

4. Then further below, you can select a weight. This is used to determine the order if a regular expression is used in the Hostname field.

5. And finally, in the Position section you can define the position of the indicator. But be aware, if you’re using the Toolbar or Administration menu module, then these options will have no effect.

Once you’ve finished configuring the indicator click on Save.

Now, if you installed Drupal using the standard installation profile then the toolbar will be used as the indicator.

Fig 1.3

Also, if you take a look at the favicon, you’ll notice that it has a green badge with the letter “L”.

Fig 1.4

Now if you have 20 tabs open, you’ll be able to spot a particular environment.

Create an Indicator with Code

Another way to create an indicator is by defining it with code in settings.php. This is my preferred method because every environment has its own settings.php.

Open up your settings.php and define an indicator’s name and colour using the code below:

$conf['environment_indicator_overwritten_name'] = 'Local';
$conf['environment_indicator_overwritten_color'] = '#42b96a';

Check out the “Configure Environment Indicator 7.x-2.x” documentation page for a list of available variables.

Conclusion

Environment Indicator becomes really useful when you have to deal with multiple environments at a time. Of course, the module won’t stop you from making configuration changes on production which are intended for staging. But hopefully you’ll notice the indicator before any damage is done.

FAQs

Q: I changed the colour of an indicator but it still looks the same?

Sometimes the new option won’t work until you clear the site cache. So try clearing the cache.

Q: I want users with a non-administrator role to see the indicator, how do I do that?

Simply assign the “See environment indicator” permission to any role and they’ll see the indicator.

2 thoughts on “Using Environment Indicator in Drupal 7”

  1. Hi Ivan,
    How we can get the environment name in a module or a template? I would like to make a simple switch of a path based on the environment.
    Thanks

Leave a Comment

You have to agree to the comment policy.

This site uses Akismet to reduce spam. Learn how your comment data is processed.