### Author:  [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [26.Май.2020 15:09:25 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/1 "2020-05-26T15:09:25Z")
Итак, вы заинтересовались созданием собственной темы для Discourse? Вы попали по адресу 😄
Это руководство будет сосредоточено в основном на аспектах работы с SCSS/CSS при создании тем для Discourse. Если вы также разбираетесь в JS/EmberJs/Handlebars, вы можете углубиться в тему, изучив это руководство.
> [@Developing Discourse Themes & Theme Components](https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648):
>
> Discourse Themes and Theme Components can be used to customize the look, feel and functionality of Discourse’s frontend. This section of the developer guides aims to provide all the reference materials you need to develop simple themes for a single site, right up to complex open-source theme components. This introduction aims to provide a map of all the tools and APIs for theme development. If you prefer a step-by-step tutorial for theme development, jump straight to: Themes vs. Theme Compon…
Я опишу свой личный метод проектирования и создания тем в Discourse. Как и в большинстве случаев, существует МНОГО способов реализовать собственный дизайн. Я люблю активно использовать инструменты инспектора при создании тем и покажу вам несколько раз, как я это делаю в этом посте.
# Настройка для работы с темами
Пожалуйста, прочитайте [Руководство для начинающих по использованию тем Discourse](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966), а также [Структура тем…](https://meta.discourse.org/t/structure-of-themes-and-theme-components/60848) перед продолжением. Глубокие знания на этом этапе не обязательны, но эти статьи дадут вам немного больше понимания перед началом работы.
Чтобы максимально эффективно работать с темами в Discourse, я рекомендую настроить следующее для самого быстрого и оптимизированного процесса разработки. Эти шаги позволят вам видеть изменения по мере их внесения, без необходимости «сохранять» и обновлять страницу из панели администратора сайта Discourse.
_Вполне возможно пройти это руководство через консоль администратора (при условии, что у вас есть права администратора на форуме Discourse.)_
- Установите [Discourse Theme CLI](https://meta.discourse.org/t/discourse-theme-cli-console-app-to-help-you-build-themes/82950) и прочитайте соответствующую тему, чтобы понять, что она может делать.
- Получите API-ключ на [https://discourse.theme-creator.io/](https://discourse.theme-creator.io/)
- Войдите в систему с помощью вашей учетной записи Meta
- Нажмите на Мои темы
- Нажмите на API-ключ
- В появившемся модальном окне нажмите Сгенерировать API-ключ и скопируйте сгенерированный ключ (мы будем использовать его чуть позже)
## Запуск Discourse Theme CLI
После установки Discourse Theme CLI и подготовки API-ключа откройте предпочитаемый текстовый редактор или окно терминала и перейдите в директорию, где вы хотите создать папку темы.
После этого выполните следующую команду `discourse_theme new your_theme_name` и заполните подсказки следующим образом:
1. **Как вы хотите назвать свою тему?** Выберите название темы
2. **Хотите ли вы начать отслеживание этой темы?** Да
3. **Какой корневой URL вашего сайта Discourse?** `https://discourse.theme-creator.io/`
4. **Хотите сохранить название этого сайта…?** Да
5. **Какой ваш API-ключ?** Введите API-ключ, полученный в Theme Creator
6. **Хотите сохранить этот API-ключ…?** Да
7. Выберите **Создать и синхронизировать новую тему** , когда будет предложено
8. Выберите **Ничего не делать** , когда будет предложено о компонентах дочерних тем
Если всё прошло успешно, вы теперь сможете перейти в раздел `Мои темы` на [https://discourse.theme-creator.io/](https://discourse.theme-creator.io/) и увидеть свою новую тему в списке тем слева.
Чтобы увидеть изменения в реальном времени, нажмите на название вашей темы, а затем в нижней части области информации нажмите на Предпросмотр
Theme CLI также теперь отслеживает любые изменения в созданной директории и будет сохранять, а также обновлять тему на theme-creator при каждом изменении.
# Первые шаги
Discourse Theme CLI создал для нас каркас темы внутри папки с именем, которое мы указали в ранее выполненной команде. Сгенерировано много файлов, которые нам не понадобятся, поэтому мы удалим всё, кроме следующего:
`common/common.scss`
`desktop/desktop.scss`
`mobile/mobile.scss`
`about.json`
Внутри директории также выполните `rm -rf .git`, чтобы удалить отслеживание версий git, оно не понадобится в этом руководстве.
Ваша директория темы теперь должна выглядеть так:
Стоит отметить, что стили, которые мы добавим в эти файлы, будут применены в соответствующих случаях использования. Стили в `common.scss` будут применены к десктопной и мобильной версиям, стили в `desktop.scss` — только к десктопной версии, а стили в `mobile.scss` — только к мобильной версии.
## Hello World (в цвете)
Discourse использует `SCSS` для стилизации, поэтому для максимальной эффективности работы со стилями вам может быть полезно ознакомиться с [SASS](https://sass-lang.com/guide), но даже если нет, вы всё равно сможете следовать этому руководству.
Хорошо, теперь перейдём к тому, чего мы все ждали… СОЗДАНИЮ ТЕМ!
Сейчас в нашем файле `about.json` пока не определено никаких цветовых схем, поэтому вставьте следующий код в этот раздел и сохраните.
```json
{
"name": "my theme",
"about_url": null,
"license_url": null,
"assets": {},
"color_schemes": {
"Default": {
"primary": "222222",
"secondary": "ffffff",
"tertiary": "0088cc",
"quaternary": "e45735",
"header_background": "ffffff",
"header_primary": "333333",
"highlight": "ffff4d",
"danger": "e45735",
"success": "009900",
"love": "fa6c8d"
}
}
}
```
Если у вас открыт браузер, вы, скорее всего, не заметите никаких изменений, поскольку это цветовая схема по умолчанию, которая используется, когда схема не задана.
# Обзор темы
Чтобы было что-то, что можно реализовать в этом руководстве, я проведу вас через создание простой темы на основе этой цветовой палитры.
## Изменение цвета фона + основного цвета текста
Давайте сделаем что-то очень простое. Мы изменим значение `"Secondary"` нашей текущей цветовой схемы. Давайте изменим его на `"secondary": "EEF4F7"` (это изменит цвет фона). Также изменим значение `"primary"` на `"203243"`.
Всего одной строкой мы уже изменили внешний вид нашего форума. Много кастомизации можно сделать, просто редактируя цвета в цветовой схеме.
## Использование цветовой схемы
Все следующие ключи определены в файле `about.json` под соответствующим названием цветовой схемы. Эти описания помогут вам понять основное назначение каждого имени переменной:
| Цвет | Описание |
| --- | --- |
| **primary** | Большинство текста, иконок и границ |
| **secondary** | Основной цвет фона и цвет текста некоторых кнопок |
| **tertiary** | Ссылки, некоторые кнопки, уведомления и акцентный цвет |
| **quaternary** | Ссылки навигации |
| **header\_background** | Цвет фона заголовка сайта |
| **header\_primary** | Текст и иконки в заголовке сайта |
| **highlight** | Цвет фона выделенных элементов на странице, таких как сообщения и темы |
| **danger** | Цвет выделения для действий, таких как удаление сообщений и тем |
| **success** | Используется для индикации успешного выполнения действия |
| **love** | Цвет кнопки «Нравится\*\* |
Каждая из этих переменных доступна для использования в наших файлах SCSS следующим образом.
```scss
body {
background-color: var(--primary);
}
```
Также созданы другие версии каждого цвета для нашего использования. Например, `var(--primary-medium)` или `var(--primary-very-low)` можно использовать для получения разных оттенков одного и того же цвета.
Давайте изменим остальные цвета в нашей цветовой схеме «Default» в соответствии с этим:
```json
"Default": {
"primary": "203243",
"secondary": "EEF4F7",
"tertiary": "416376",
"quaternary": "5E99B9",
"header_background": "FaFaFa",
"header_primary": "EEF4F7",
"highlight": "86BDDB",
"danger": "8F393E",
"success": "70DB82",
"love": "FC94CB"
}
```
> 🔦 Вы можете увидеть все доступные переменные для использования в ваших файлах SCSS, если нажмёте на ссылку Стиль во время предпросмотра вашей темы на theme creator, а затем выберете «Цвета» в левом меню.
>
> Раздел «Стиль» очень полезен при создании пользовательской темы. Каждый Атом покажет вам, как будут выглядеть определённые элементы Discourse с применёнными вами стилями.
# Углубление
С предыдущим разделом за плечами, думаю, пришло время немного углубиться в то, что можно сделать в Discourse, используя только SCSS. (Подсказка: ОЧЕНЬ МНОГО!)
### Стилизация заголовка
Вы заметите, что наши предыдущие изменения цветовой схемы оставили желать лучшего в отношении нашего заголовка. Иконки едва видны!
Заголовок Discourse включает контейнер (с цветом фона) для размещения логотипа сайта, а также иконок навигации справа. Всё это можно настроить.
Целевой класс для настройки заголовка — `.d-header`.
В нашем файле `common/common.scss` добавим следующее:
```scss
.d-header {
box-shadow: none;
border-bottom: 1px solid var(--primary-low-mid);
height: 5em;
}
```
Это уберёт стандартную тень по периметру заголовка, увеличит его высоту, а также добавит нижнюю границу для разделения.
Для иконок — внутри скобок SCSS `.d-header` добавим этот вложенный код.
```scss
.d-header {
// ...предыдущий код
.d-icon {
color: var(--primary-low-mid);
}
}
```
Выглядит неплохо, но внимательный глаз заметит, что увеличенная высота заголовка оставила меньше места между ним и остальными элементами форума Discourse!
Расстояние между основной областью и заголовком контролируется целевым элементом `#main-outlet`. Давайте немного увеличим это расстояние, добавив следующее в конец вашего файла `common/common.scss`.
```scss
#main-outlet {
padding-top: 6.5em;
}
```
## Контейнер навигации
Контейнер навигации включает следующие элементы.
Самая левая область — это выпадающие списки фильтрации по категориям/тегам, за которыми следуют ссылки навигации, завершающиеся кнопкой «Новая тема».
### Выпадающий список категорий / тегов
Давайте внесём некоторые изменения в эту область. Для этого добавьте следующее в ваш файл `common.scss`.
```scss
.navigation-container {
.select-kit.combo-box {
.select-kit-header {
border-radius: 0.9em;
background-color: var(--header_background);
}
}
}
```
Здесь мы нацеливаемся на `.select-kit-header`, чтобы задать им одинаковый радиус скругления, а также более светлый цвет фона.
Нажатие на любой из них открывает выпадающее меню.
Сейчас у него также острые углы, поэтому давайте добавим стили, чтобы скруглить их, а также изменить цвет фона на тот же, что и у заголовка.
```scss
.navigation-container {
.select-kit.combo-box {
// ...предыдущий код
&.category-drop,
&.tag-drop {
.select-kit-body {
border-radius: 0.9em;
background-color: var(--header_background);
.select-kit-collection {
background-color: var(--header_background);
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
}
}
}
}
```
В результате получается следующий вид…
Если присмотреться, можно увидеть, что наши изменения оставили видимой небольшую границу в правом верхнем углу области поиска.
Давайте исправим это, заглянув в инспектор браузера. Это всегда очень полезный инструмент для определения классов/ID, на которые нужно нацелиться, чтобы правильно применить стили.
С видимым выпадающим меню щёлкните правой кнопкой мыши по области поиска и выберите «Просмотреть элемент» (Inspect) в браузере.
Мы видим, что это поле ввода находится внутри `div` с классом `select-kit-filter`.
Если посмотреть на правила, применяемые к этому селектору, можно увидеть, что у него сейчас есть верхняя и нижняя границы, а также некоторый отступ. Мы хотим изменить только стилизацию верхней границы.
Добавьте следующий код, вложенный в `.select-kit-body` из предыдущего примера.
```scss
.select-kit.combo-box.category-drop,
.select-kit.combo-box.tag-drop {
.select-kit-body {
// ...предыдущий код
.select-kit-filter {
border-top: 0px;
}
}
}
```
С этим наш код для стилизации контейнера навигации должен выглядеть так.
```scss
.navigation-container {
// Выпадающий список категорий + тегов
.select-kit.combo-box {
.select-kit-header {
border-radius: 0.9em;
background-color: var(--header_background);
}
&.category-drop,
&.tag-drop {
.select-kit-body {
border-radius: 0.9em;
background-color: var(--header_background);
.select-kit-collection {
background-color: var(--header_background);
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
.select-kit-filter {
border-top: 0px;
}
}
}
}
}
```
### Ссылки навигации
Давайте добавим стили, чтобы эти ссылки навигации выглядели примерно так:
Давайте снова воспользуемся нашим инспектором, чтобы узнать, на что нужно нацелиться здесь.
Мы видим, что наши элементы навигации находятся внутри UL с классом `"nav nav-pills ..."`
Вернёмся в наш файл `common.scss`, под предыдущий раздел, но всё ещё внутри `navigation-container`, и добавим следующее:
```scss
.nav-pills {
& > li a {
&.active {
color: var(--tertiary);
background-color: var(--secondary);
border-bottom: 4px solid var(--tertiary);
}
}
}
```
Это изменение нацелится только на наши ссылки с классом active, которые являются дочерними элементами `nav-pills`. Это изменение должно сделать нашу активную ссылку похожей на следующее:
Это нормально, но я бы хотел, чтобы нижняя граница простиралась только на длину текста. Для этого выше строки `&.active {` добавим следующее, что затронет все ссылки A внутри тегов навигации ``.
```scss
// ...другой код
.nav-pills {
& > li a {
padding: 0;
margin-right: 20px;
color: var(--tertiary-high);
border-bottom: 4px solid transparent;
&.active {
// ...больше кода
}
}
}
```
Теперь нам нужно стилизовать эффект «наведения» (hover) так же, как эффект «активного» состояния.
Под нашим предыдущим `&.active` добавим
```scss
&:hover {
color: var(--tertiary);
background-color: var(--secondary);
border-bottom: 4px solid var(--primary);
}
```
Итак, весь наш код навигации теперь должен выглядеть так:
```scss
// Nav Pills
.nav-pills {
& > li a {
padding: 0;
margin-right: 20px;
color: var(--tertiary-high);
border-bottom: 4px solid transparent;
&.active {
color: var(--tertiary);
background-color: var(--secondary);
border-bottom: 4px solid var(--tertiary);
}
&:hover {
color: var(--tertiary);
background-color: var(--secondary);
border-bottom: 4px solid var(--primary);
}
}
}
```
### Кнопки
Кнопки в Discourse бывают самых разных форм и размеров. Вы можете просмотреть их ассортимент в разделе «Кнопки» в руководстве по стилю.
Я хотел бы изменить большинство кнопок в этой теме, сделав их скруглёнными с пользовательской стилизацией. Это изменит кнопку + Новая тема, а также другие кнопки по всему сайту.
В конце файла `common.scss` добавим следующее:
```scss
.btn {
background-color: var(--header_background);
color: var(--primary);
border-radius: 1.2em;
border: 1px solid var(--primary-low-mid);
.d-icon {
color: var(--primary);
}
&:hover {
background-color: var(--quaternary-low);
color: var(--primary);
.d-icon {
color: var(--primary);
}
}
&.btn-default,
&.btn-primary {
padding: 10px 12px;
}
}
```
Это сделает наши кнопки похожими на это:
Теперь, когда наши кнопки стилизованы, я хотел бы обратить внимание на один момент касательно стилизации кнопок и почему важно тестировать все свои дизайны.
Перейдите на страницу любой темы в предпросмотре вашего сайта, затем нажмите кнопку ответить в ответе на тему или в кнопке ответа внизу потока темы. Вы увидите, что наша стилизация кнопок затронула некоторые элементы, которые мы, возможно, не планировали.
Я не хочу, чтобы эти кнопки редактирования текста были затронуты моей предыдущей стилизацией. Это требует более сложного SASS/CSS, но мы можем заставить наш код `:not()` не затрагивать эти кнопки. 😉
Давайте добавим эту строку кода перед нашим текущим целевым элементом `.btn`. Это скажет нашим стилям применяться только к кнопкам, которые не являются дочерними элементами `.d-editor-button-bar`.
```scss
:not(.d-editor-button-bar) > .btn
```
Хорошо, это сработало отлично… но подождите! Теперь появился какой-то странный бунтарь, делающий своё дело.
Просмотрев это в браузере, я вижу, что у этой кнопки есть класс `.select-kit-header`, потому что при нажатии на эту шестерёнку появятся дополнительные опции.
> 🔦 Я не могу подчеркнуть достаточно важность использования инструментов инспектора браузера при создании тем Discourse. Они ваши лучшие друзья в этом путешествии.
Теперь, когда мы знаем, что _НЕ_ хотим нацеливаться на эту кнопку, давайте добавим больше функциональности `:not()` в наш код.
```scss
:not(.d-editor-button-bar) >
.btn:not(.single-select-header)
```
Это выберет все кнопки, которые НЕ являются дочерними элементами `.d-editor-button-bar` и не имеют класса `.single-select-header`. Я знаю, что это немного запутанно, но внутри Discourse много движущихся частей, поэтому иногда стилизация должна быть очень специфичной, чтобы правильно влиять на элементы.
Я также заметил, что наша текущая стилизация неудобно влияет на кнопку закрытия модального окна. Нажав на что-либо, открывающее модальное окно, вы сможете это увидеть, или ещё проще — перейдите в раздел модальных окон в руководстве по стилю.
Чтобы исправить это, я добавлю ещё одну цель в наш код.
```scss
:not(.d-editor-button-bar) >
.btn:not(.single-select-header):not(.modal-close)
```
### Продолжаем…
Я вижу ещё одну кнопку, которая, кажется, не была затронута нашим кодом. Это кнопка `Отслеживание`, расположенная в самом низу потока сообщений темы.
Я добавлю следующую строку через запятую к нашему текущему коду `.btn`.
```scss
:not(.d-editor-button-bar) >
.btn:not(.single-select-header):not(.modal-close),
.topic-notifications-button > .select-kit > .btn
```
Это правильно нацелится на кнопку, появляющуюся в этом разделе, и на данный момент мы закончили со стилизацией верхней части нашего форума.
> 🔦 Не стесняйтесь настраивать любые параметры в вашем собственном CSS. Чем больше вы экспериментируете со стилями и смотрите, как они влияют на HTML, тем больше вы узнаете!
# Куда двигаться дальше
Это руководство предназначено лишь для того, чтобы погрузиться в то, как вы можете кастомизировать свою тему для Discourse. Надеюсь, теперь у вас есть больше понимания о том, как нацеливаться на области приложения для ваших собственных кастомизаций.
**Помните** : МНОГОЕ можно настроить, используя только SCSS. Если вы хотите углубиться в разработку, я рекомендую прочитать статьи, ссылки на которые приведены в начале этого поста.
Не стесняйтесь задавать любые вопросы, и я с радостью постараюсь помочь вам или направить в правильном направлении.
* * *
Этот документ находится под версионным контролем — предлагайте изменения [на GitHub](https://github.com/discourse/discourse/blob/main/docs/developer-guides/docs/05-themes-components/03-designers-guide.md).
---
### Author:  [@IdentityDan](https://meta.discourse.org/u/IdentityDan)
#### Post date: [05.Август.2022 18:54:46 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/4 "2022-08-05T18:54:46Z")
Привет, @jordan.vidrine,
При работе над разделом _Запуск CLI темы Discourse_ этого руководства я столкнулся с ошибкой 301.
Мне удалось её исправить, используя `https://discourse.theme-creator.io/` вместо `https://theme-creator.discourse.org` в качестве корневого URL.
Надеюсь, это поможет!
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [05.Август.2022 19:24:18 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/5 "2022-08-05T19:24:18Z")
О да, мы обновили этот URL, и этот пост тоже требует обновления — спасибо, что сообщили нам!
---
### Author:  [@dmc](https://meta.discourse.org/u/dmc)
#### Post date: [07.Январь.2023 17:50:37 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/6 "2023-01-07T17:50:37Z")
Спасибо за эту информацию, @IdentityDan!
Также для справки: если вы столкнулись с этой ошибкой, вам, скорее всего, потребуется отредактировать файл `/home/USERNAME/.discourse_theme`, в котором хранятся связи между ключами API и сайтами Discourse для каждой темы.
Таким образом, даже если создание темы завершается сбоем, данные, введённые в «мастере», сохраняются в этом файле. Если вы попытаетесь создать новую тему с тем же именем, URL и ключи API будут получены из этого файла.
---
### Author:  [@dmc](https://meta.discourse.org/u/dmc)
#### Post date: [08.Январь.2023 05:11:19 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/7 "2023-01-08T05:11:19Z")
Ещё один момент: при использовании предварительного просмотра темы ссылка на «Руководство по стилю» работает некорректно. Она перенаправляет на страницу со стандартной темой, но если добавить к URL `?preview_theme_id=THEME-ID-NUMBER`, то «Руководство по стилю» отобразится с правильной темой.
---
### Author:  [@Valcoholics](https://meta.discourse.org/u/Valcoholics)
#### Post date: [12.Январь.2023 11:10:25 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/9 "2023-01-12T11:10:25Z")
Спасибо, это потрясающе
---
### Author:  [@AkaiBukai](https://meta.discourse.org/u/AkaiBukai)
#### Post date: [01.Март.2023 16:55:44 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/10 "2023-03-01T16:55:44Z")
Здравствуйте, я только начинаю читать пост…
Но прежде чем двигаться дальше, я хотел бы узнать, можно ли использовать CLI с самостоятельно размещённым экземпляром?
Или же нам необходимо использовать CLI с [theme-creator.io](http://theme-creator.io) для разработки, а после завершения «импортировать» тему в самостоятельно размещённый экземпляр?
В моём случае меня больше интересует использование в качестве темы для настройки разового форума, а не создание многоразовой темы, предназначенной для публикации.
Так что мне всё ещё следует использовать CLI с этим публичным сайтом?
Спасибо.
---
### Author:  [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [01.Март.2023 17:03:07 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/11 "2023-03-01T17:03:07Z")
> [@AkaiBukai](#):
>
> Но прежде чем двигаться дальше, я хотел бы узнать, возможно ли использовать CLI с самохостинговым экземпляром?
Это возможно, и я рекомендую именно этот метод. Единственное, о чём стоит помнить: все изменения будут сразу же отображаться на форуме по мере их внесения.
Что я делаю: делаю тему выбираемой пользователем, устанавливаю её в личных настройках своего аккаунта, оставляя тему по умолчанию для всех остальных пользователей. Это позволяет видеть любые проблемы, возникающие при настройке темы, только вам.
---
### Author:  [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [01.Март.2023 19:06:30 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/12 "2023-03-01T19:06:30Z")
Я часто делаю это с помощью «тестового» живого сервера, доменное имя которого я не решаюсь прекратить арендовать.
Это более экономично, потому что я просто выключаю сервер на недели, когда не использую его.
Очевидно, я все еще плачу за хранилище (и, возможно, за IP-адрес), но по крайней мере я не плачу за круглосуточные вычислительные ресурсы.
---
### Author:  [@jenmck](https://meta.discourse.org/u/jenmck)
#### Post date: [08.Апрель.2024 21:32:15 UTC](https://meta.discourse.org/t/designers-guide-to-getting-started-with-themes-in-discourse/152002/13 "2024-04-08T21:32:15Z")
> [@Kris](#):
>
> Да, мы обновили этот URL, и этот пост тоже нужно обновить.
Кажется, есть ещё одно место, которое требует обновления!
> [@Jordan Vidrine](#):
>
> **Какой корневой URL вашего сайта Discourse?** `https://theme-creator.discourse.org`