Blog/ How to add custom theme settings for Drupal 7

By neerav.mehta Wed, 05/21/2014 - 22:17 2 Comments

Drupal gives us the ability to change theme settings from the administrative pages. Apart from the Global settings form, each theme has its own settings page.

Navigate to "Appearance" -> "Your theme" > "Settings"

This page has the "Logo Image Settings" and "Shortcut Icon Settings".

Logo Image and Shortcut Icon Settings

You can also add your own fields to this form.

Drupal 7 provides a more easier and flexible way to add your custom settings in the theme settings.

You just need to create a "theme-settings.php" file in your theme folder and write a THEMENAME_form_system_theme_settings_alter(&$form, $form_state) function.

For example, let us add breadcrumb settings to the theme settings.

function MYTHEME_form_system_theme_settings_alter(&$form, $form_state) {
  $form['breadcrumb'] = array(
    '#type' => 'fieldset',
    '#title' => t('Breadcrumb Settings'),
    '#collapsible' => TRUE,
    '#collapsed' => TRUE,

  // Breadcrumb elements
  $form['breadcrumb']['breadcrumb_title'] = array(
    '#type' => 'select',
    '#title' => t('Breadcrumb title'),
    '#description' => t('Do you want to show the title of the page in the breadcrumb?'),
    '#options' => array(
      0 => t('No'),
      1 => t('Yes'),
    '#default_value' => theme_get_setting('breadcrumb_title'),

Check for complete API reference

Breadcrumb settings

function MYTHEME_breadcrumb($variables) {
  $breadcrumb = $variables['breadcrumb'];
  if (!empty($breadcrumb)) {
    $output = '<'.OUTTAG.' class="element-invisible">' . t('You are here') . '<!--{cke_protected}{C}%3C!%2D%2D'.OUTTAG.'%2D%2D%3E-->';

    if (theme_get_setting('breadcrumb_title') == 1) { // show the title setting
      $breadcrumb[] = drupal_get_title();

    $output .= '. implode(' » ', $breadcrumb);
    return $output;

Note: For setting the default value, you need the following code in your file

 settings['breadcrumb_title'] = 1
  1. Create a "theme-settings.php" in your theme folder
  2. Add the following code for the breadcrumb settings
  3. You can check the form in your theme settings page. It will look like this.
  4. You can write the PHP call in any of the .php files in your theme folder.


Related Articles:

By Anonymous (not verified) Monday, February 23, 2015 - 00:15 Permalink

Very good!

By Nivas (not verified) Tuesday, March 10, 2015 - 16:10 Permalink

Hi,I followed the same setup but I need to add a browse button at the end for uploading image.
below is the code i developed...
THEME-SETTINGS.php i added the below code
$form['mytheme_settings']['loaderImage'] = array(
'#type' => 'fieldset',
'#title' => t('Loader Icon'),
'#collapsible' => TRUE,
'#collapsed' => FALSE,
$form[mythemename_settings']['loaderImage']['loader_img'] = array(
'#type' => 'file',
'#title' => t('Upload Loader Icon Image'),
'#default_value' => theme_get_setting('loader_img','mythemename'),
'#description' => t("Upload your desired loader icon."),
THEME.INFO file i added
settings[loader_img] = "loading.gif"
then,I retrieved my value in TEMPLATE.PHP but the value is empty.
<?php print theme_get_setting('loader_img'); ?>

Can u spot me out what is the error I made.
I need to know in which tablename in database,the value of the settings will be stored.
Also,need to know where will be my uploaded file(images) will get stored.(because i checked my entire project but i couldn't find my file).

Any help is really appreciated.Thanks in advance.

Ready to get started?REQUEST A QUOTE