Theme Settings no Drupal 8

Neste tutorial, vou mostrar como implementar o Theme Settings em um tema custom no Drupal 8.

Para tal implementação, vamos seguir o seguinte cenário:

"O administrador ao entrar na página de configuração do tema (admin/appearance/settings/<theme-name>), terá um campo de checkbox com a opção de exibir ou não o título dos Nodes."

Vamos à implementação:

Crie arquivo "theme-settings.php" dentro da raíz do seu tema:


Dentro deste arquivo, vamos implementar o campo checkbox responsável por exibir ou não o título dos Nodes. Para fazer isso, vamos utilizar o hook "hook_form_system_theme_settings_alter":

/**
 * Implements hook_form_system_theme_settings_alter().
 */
function custom_bootstrap_form_system_theme_settings_alter(&$form, \Drupal\Core\Form\FormStateInterface &$form_state, $form_id = NULL) {
  // Work-around for a core bug affecting admin themes. See issue #943212.
  if (isset($form_id)) {
    return;
  }

  $form['hide_node_title'] = array(
    '#type' => 'checkbox',
    '#title'         => t('Hide node title'),
    '#default_value' => theme_get_setting('hide_node_title'),
    '#description'   => t("Hide title of node types"),
  );
}

Limpe o cache do site e acesse a página de configuração do seu tema (admin/appearance/settings/<theme-name>) para ver o campo implementado:


O próximo passo é implementar a regra de exibição. Para fazer isso vamos utilizar o hook "hook_preprocess_page_title".

Crie o arquivo "<theme-name>.theme" dentro da raíz do seu tema:


Dentro do arquivo "<theme-name>.theme" faça a seguinte implementação:

/**
 * Implements hook_preprocess_page_title().
 */
function custom_bootstrap_preprocess_page_title(&$variables) {
  if(\Drupal::routeMatch()->getParameter('node')) {
    //Recupera o valor do campo hide_node_title
    $hidden = theme_get_setting('hide_node_title') ? 'hidden' : '';
    $variables['title_attributes']['class'][] = $hidden;
  }
}

No código acima, eu recupero o valor do campo checkbox criado e caso ele esteja checado, eu aplico a classe "hidden" ao título, ocultando sua exibição.

Limpe o cache do site e faça o teste.

Lembrando que essa implementação poderia ser feita de outras maneiras, utilizando outros hooks.

Espero que tenha ajudado.
Até o próximo tutorial!

Login do usuário