Skip to content

Instantly share code, notes, and snippets.

@bookworm2000

bookworm2000/html.html.twig

Created March 24, 2021 18:02
Show Gist options
  • Save bookworm2000/e0eec1e7394072f06fb68a8b3e0340bc to your computer and use it in GitHub Desktop.
Save bookworm2000/e0eec1e7394072f06fb68a8b3e0340bc to your computer and use it in GitHub Desktop.
Download ZIP
Boosting Layout Builder Under the Hood
Raw
html.html.twig
<!DOCTYPE html>
<html{{ html_attributes }}>
<head>
<title>{{ head_title }}</title>
{% if primary_webfont_url|length %}
<link rel="stylesheet prefetch" media="screen" href="{{ primary_webfont_url }}">
<style type="text/css">
:root {
--ff__serif: '{{ primary_webfont_family }}', {{ primary_webfont_type }};
}
</style>
{% endif %}
{% if secondary_webfont_url|length %}
<link rel="stylesheet prefetch" media="screen" href="{{ secondary_webfont_url }}">
<style type="text/css">
:root {
--ff__sans: '{{ secondary_webfont_family }}', {{ secondary_webfont_type }};
}
</style>
{% endif %}
{% if background_color_override|length and foreground_color_override|length %}
<style type="text/css">
:root {
--c__primary--bg: {{ background_color_override }};
--c__primary--fg: {{ foreground_color_override }};
}
</style>
{% endif %}
</head>
<body{{ attributes }}>
{{ page_top }}
{{ page }}
{{ page_bottom }}
</body>
</html>
Raw
mytheme.theme
<?php
declare(strict_types = 1);
use Drupal\node\Entity\Node;
use Drupal\taxonomy\TermStorage;
/**
* Implements hook_preprocess_HOOK().
*/
function mytheme_preprocess_html(array &$variables): void {
// Retrieve node content.
$routeMatch = \Drupal::routeMatch();
$node = $routeMatch->getParameter('node');
// Check for specific content types.
if (
$node instanceof Node && $node->getType() === 'publication' ||
$node instanceof Node && $node->getType() === 'publication_page'
) {
// Retrieve primary webfont if that value has been passed.
if (isset($node->field_primary_webfont_url) && !$node->field_primary_webfont_url->isEmpty()) {
$variables['primary_webfont_url'] = $node->field_primary_webfont_url->value;
$variables['primary_webfont_family'] = $node->field_primary_webfont_family->value;
$variables['primary_webfont_type'] = $node->field_primary_webfont_type->value;
}
// Retrieve secondary webfont if that value has been passed.
if (isset($node->field_secondary_webfont_url) && !$node->field_secondary_webfont_url->isEmpty()) {
$variables['secondary_webfont_url'] = $node->field_secondary_webfont_url->value;
$variables['secondary_webfont_family'] = $node->field_secondary_webfont_family->value;
$variables['secondary_webfont_type'] = $node->field_secondary_webfont_type->value;
}
// Retrieve primary system font if that value has been passed.
if (isset($node->field_primary_system_font) && !$node->field_primary_system_font->isEmpty()) {
// Retrieve taxonomy term given the tid collected from the node object.
$entityManager = \Drupal::service('entity_type.manager');
$primary_tid = $node->field_primary_system_font->target_id;
$primary_term = $entityManager->getStorage('taxonomy_term');
$primary_term->load($primary_tid)->getName();
$primary_family = $primary_term->load($primary_tid)->field_system_font_family->value;
$primary_type = $primary_term->load($primary_tid)->field_system_font_type->value;
$variables['primary_system_font_family'] = $primary_family;
$variables['primary_system_font_type'] = $primary_type;
}
// Retrieve secondary system font if that value has been passed.
if (isset($node->field_secondary_system_font) && !$node->field_secondary_system_font->isEmpty()) {
// Retrieve taxonomy term given the tid collected from the node object.
$entityManager = \Drupal::service('entity_type.manager');
$second_tid = $node->field_secondary_system_font->target_id;
$second_term = $entityManager->getStorage('taxonomy_term');
$second_term->load($second_tid)->getName();
$second_family = $second_term->load($second_tid)->field_system_font_family->value;
$second_type = $second_term->load($second_tid)->field_system_font_type->value;
$variables['secondary_system_font_family'] = $second_family;
$variables['secondary_system_font_type'] = $second_type;
}
if (isset($node->field_background_color) && !$node->field_background_color->isEmpty() && isset($node->field_foreground_color) && !$node->field_foreground_color->isEmpty()) {
$variables['background_color_override'] = $node->field_background_color->value;
$variables['foreground_color_override'] = $node->field_foreground_color->value;
}
}
}
/**
* Implements hook_preprocess_HOOK() for layouts.
*/
function mytheme_preprocess_layout(array &$variables) {
// Retrieve primary system font if that value has been passed.
if (isset($variables['settings']['primary_system_font']) && !empty($variables['settings']['primary_system_font'])) {
$primary_tid = $variables['settings']['primary_system_font'];
$primary_term = _mytheme_retrieve_taxonomy_term();
$primary_name = $primary_term->load($primary_tid)->getName();
$primary_family = $primary_term->load($primary_tid)->field_system_font_family->value;
$primary_type = $primary_term->load($primary_tid)->field_system_font_type->value;
$variables['layout_primary_system_font'] = $primary_tid;
$variables['layout_primary_system_font_family'] = $primary_family;
$variables['layout_primary_system_font_type'] = $primary_type;
}
// Retrieve secondary system font if that value has been passed.
if (isset($variables['settings']['secondary_system_font']) && !empty($variables['settings']['secondary_system_font'])) {
$second_tid = $variables['settings']['secondary_system_font'];
$second_term = _mytheme_retrieve_taxonomy_term();
$second_name = $second_term->load($second_tid)->getName();
$second_family = $second_term->load($second_tid)->field_system_font_family->value;
$second_type = $second_term->load($second_tid)->field_system_font_type->value;
$variables['layout_secondary_system_font'] = $second_tid;
$variables['layout_secondary_system_font_family'] = $second_family;
$variables['layout_secondary_system_font_type'] = $second_type;
}
// Retrieve primary webfont if that value has been passed.
if (isset($variables['settings']['primary_webfont_url']) && !empty($variables['settings']['primary_webfont_url'])) {
$variables['layout_primary_webfont_url'] = $variables['settings']['primary_webfont_url'];
$variables['layout_primary_webfont_family'] = $variables['settings']['primary_webfont_family'];
$variables['layout_primary_webfont_type'] = $variables['settings']['primary_webfont_type'];
}
// Retrieve secondary webfont if that value has been passed.
if (isset($variables['settings']['secondary_webfont_url']) && !empty($variables['settings']['secondary_webfont_url'])) {
$variables['layout_secondary_webfont_url'] = $variables['settings']['secondary_webfont_url'];
$variables['layout_secondary_webfont_family'] = $variables['settings']['secondary_webfont_family'];
$variables['layout_secondary_webfont_type'] = $variables['settings']['secondary_webfont_type'];
}
// Retrieve color override values.
if (isset($variables['settings']['background_color_override']) && !empty($variables['settings']['foreground_color_override'])) {
$variables['layout_background_color_override'] = $variables['settings']['background_color_override'];
$variables['layout_foreground_color_override'] = $variables['settings']['foreground_color_override'];
}
if (isset($variables['settings']['id']) && !empty($variables['settings']['id'])) {
$variables['layout_id'] = $variables['settings']['id'];
}
}
/**
* Get the taxonomy term from entity storage for use.
*
* @return \Drupal\taxonomy\TermStorage
* The taxonomy term related to system fonts.
*/
function _mytheme_retrieve_taxonomy_term(): TermStorage {
$entityManager = \Drupal::service('entity_type.manager');
$term = $entityManager->getStorage('taxonomy_term');
return $term;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment