Я начал с использования регрессивного grep-запроса темы, чтобы узнать, как учитываются платформы, поддерживаемые существующей кодовой базой.
jenkins@efc9c26-01112:~/sites/my_client/web/themes/contrib/drupal8_parallax_theme$ grep linkedin -R .
Бинарный файл ./includes/fontawesome/fonts/FontAwesome.otf соответствует
Бинарный файл ./includes/fontawesome/fonts/fontawesome-webfont.ttf соответствует
./includes/fontawesome/css/font-awesome.css:.fa-linkedin-square:before {
./includes/fontawesome/css/font-awesome.css:.fa-linkedin:before {
./templates/layout/page.html.twig: {% if linkedin_url %}
./templates/layout/page.html.twig: <a href="{{ linkedin_url }}" class="linkedin" target="_blank"><i class="fa fa-linkedin"></i>< /а>
./drupal8_parallax_theme.theme: $variables['linkedin_url'] = theme_get_setting('linkedin_url');
./drupal8_parallax_theme.theme: $form['drupal8_parallax_theme_settings']['social_icon']['linkedin_url'] = массив(
./drupal8_parallax_theme.theme: '#default_value' => theme_get_setting('linkedin_url'),
./config/install/drupal8_parallax_theme.settings.yml:linkedin_url: 'http://www.linkedin.com/company/zymphonies'
Это дало необходимые подсказки для обратного проектирования того, что существует, чтобы я мог воспроизвести то, что мне нужно добавить. Он также показывает, к каким файлам я должен прикоснуться, чтобы выполнить работу.
Я обратил внимание на свою подтему, где мои настройки хранятся в репозитории git, поэтому мне не нужно воспроизводить эти изменения при каждой перестройке. Я до сих пор не разобрался, как сделать так, чтобы мои настройки переопределяли базовую тему, и прибегал к копированию их в базовую тему при каждом обновлении, но надеюсь, что достаточно скоро смогу лучше справиться с более изящными способами получения этой работы. сделано.
Эта работа выполняется по этому пути:
~/sites/my_client/web/themes/contrib/drupal8_parallax_theme_my_client
Поддержка youtube была простой:
В файле: drupal8_parallax_theme_my_client.theme, я добавил эту строку: $variables['youtube_url'] = theme_get_setting('youtube_url');
А затем добавьте эту строфу, адаптированную из базовой темы, для копирования в соответствующий файл базовой темы как часть drupal8_parallax_theme_form_system_theme_settings_alter() функция:
$form['drupal8_parallax_theme_settings']['social_icon']['youtube_url'] = массив(
'#тип' => 'текстовое поле',
'#title' => t('URL-адрес YouTube'),
'#default_value' => theme_get_setting('youtube_url'),
);
Это должно предоставить параметр конфигурации по адресу:
админ/внешний вид/настройки/drupal8_parallax_theme_my_client.
в шаблоны/макет/page.html.twig файл, сразу после строфы facebook.
{% если youtube_url %}
<a href="{{ youtube_url }}" class="youtube" target="_blank" ><i class="fa fa-youtube"></i></a>
{% конец%}
Это должно показать настроенный значок в блоке социальных сетей, отображаемом в нижнем колонтитуле.
Следующий драш кр, настройте URL-адрес в пользовательском интерфейсе по указанному выше пути, а другой драш кр, должен предоставить доступ к изменениям анонимному пользователю.
Это работает, потому что иконка youtube уже поддерживается в версии fontAwesome по умолчанию, поставляемой вместе с темой. Дополнительные значки, по-видимому, регулярно добавляются в пакет fontAwsome. Но ожидание цикла релиза от команды fa не было началом для клиента, которому сейчас нужна эта функциональность. Обновление пакета fa на данный момент, по-видимому, связано с лицензионным сбором плюс накладные расходы на то, чтобы разобраться, как автоматизировать обновление в моем процессе сборки.
Поэтому я позвонил Адаму Мюльхаузену в Индиану, с которым я работал над предварительными запросами для сайта, находящегося в стадии разработки. Я надеялся на телефонный разговор с ним, чтобы сообщить мне об интеграции этих изменений в подтему с контролем версий, чтобы расширить ./includes/fontawesome/css/font-awesome.css файл, включенный как часть базовой темы. Вместо этого я получил электронное письмо с просьбой проверить результаты его работы.
Мы уже использовали модуль, позволяющий хранить css и js в конфигурации базы данных, чтобы при необходимости интегрировать их в сборку страницы. ( композитор требует «drupal/asset_injector:^2.10» ). Не имея доступа к серверной части, Адам продолжил использовать свой существующий доступ к графическому интерфейсу, инструмент firebug/inspect-element в своем браузере и час или около того экспериментов, чтобы добавить это в .css, поддерживаемый значками, которые он собрал с каждого сайта и загрузил. в опубликованный, но несвязанный узел, созданный для этой цели.
/* иконки соцсетей не в шрифте awesome */
.footer-меню .fa-gettr {
background: url('/sites/default/files/inline-images/gettr.png') center no-repeat;
}
.footer-меню .fa-gettr {
размер фона: содержит;
ширина: 12 пикселей;
высота: 12 пикселей;
вертикальное выравнивание: посередине;
}
.footer-меню .gettr:hover{
-webkit-filter: инвертировать (100 %), оттенки серого (100 %), яркость (50 %), сепия (60 %), оттенок, поворот (250 градусов), насыщенность (700 %);
-moz-фильтр: инвертировать (100 %), оттенки серого (100 %), яркость (50 %), сепия (60 %), оттенок, поворот (250 градусов), насыщенность (700 %);
фильтр: инвертировать (100 %), оттенки серого (100 %), яркость (50 %), сепия (60 %), поворот оттенка (250 градусов), насыщенность (700 %);
}
Повторив это, мы смогли предоставить связанные значки в общей сложности для восьми платформ социальных сетей, три из которых поддерживаются темой по умолчанию, еще одна нет, но, тем не менее, поддерживается проектом fontAwesome, а еще четыре настолько новые, что не поддерживаются ни тем, ни другим.
