Пользовательский код

||||
-|-|
:discourse2: | Summary | Custom Code позволяет настраивать шрифт и цвета для исходного кода, размещаемого на сайте.
:eyeglasses: | Предварительный просмотр | Предварительный просмотр в Discourse Theme Creator
:hammer_and_wrench: | Ссылка на репозиторий | https://github.com/discourse/discourse-custom-code
:open_book: |Новичок в темах Discourse? | Руководство для начинающих по использованию тем Discourse

Установить этот компонент темы

Возможности

Как правило, шрифты, используемые для записи кода, относятся к семейству monospace. Наиболее известные шрифты:

(При этом ничто не мешает экспериментировать с самыми разными шрифтами!)

Чтобы изменить шрифт, перейдите на https://fonts.google.com

  • выберите нужный шрифт

  • настройте его

  • Выберите EMBED и скопируйте строку, относящуюся к семейству шрифтов (1), в настройку темы Font

  • Скопируйте и вставьте строку, относящуюся к CSS (2), в настройку темы font-family (не добавляйте символ ; в конец строки).

Все остальные настройки должны быть понятны.

Настройки этого компонента разделены для тем light (светлая) и dark (темная). Если вы используете обе, не забудьте добавить компонент в обе темы.


Настройки

| Имя | Описание
|-|
| font | Выберите новый шрифт из Google Font. В зависимости от выбранного шрифта вы можете дополнительно настроить его, например Sarabun:300,400,500 . Если не задано, будет применен шрифт по умолчанию.
| font size | Указывает размер используемого шрифта. Если не задано, будет применен шрифт по умолчанию.
| font family | Указывает шрифт, который будет использоваться. Если не задано, будет применен шрифт по умолчанию.
| border radius | Выберите радиус границы для вашего кода. Значение по умолчанию — 0px.
| hljs light | Светлая тема. Выберите цвет текста.
| code light | Светлая тема. Выберите цвет кода.
| code background light | Светлая тема. Выберите цвет фона для кода.
| comment light | Светлая тема. Выберите цвет комментариев и доктэгов.
| title light | Светлая тема. Выберите цвет заголовка, имени и метаданных.
| string light | Светлая тема. Выберите цвет строки.
| number light | Светлая тема. Выберите цвет числа.
| keyword light | Светлая тема. Выберите цвет ключевого слова, subst, request и status.
| class title light | Светлая тема. Выберите цвет заголовка внутри элемента класса.
| tag light | Светлая тема. Выберите цвет тега.
| attribute light | Светлая тема. Выберите цвет атрибута.
| symbol light | Светлая тема. Выберите цвет символа.
| hljs dark | Темная тема. Выберите цвет текста.
| code dark | Темная тема. Выберите цвет кода.
| code background dark | Темная тема. Выберите цвет фона для кода.
| comment dark | Темная тема. Выберите цвет комментария.
| title dark | Темная тема. Выберите цвет заголовка, имени и метаданных.
| string dark | Темная тема. Выберите цвет строки.
| number dark | Темная тема. Выберите цвет числа.
| keyword dark | Темная тема. Выберите цвет ключевого слова, subst, request и status.
| class title dark | Темная тема. Выберите цвет заголовка внутри элемента класса.
| tag dark | Темная тема. Выберите цвет тега.
| attribute dark | Темная тема. Выберите цвет атрибута.
| symbol dark | Темная тема. Выберите цвет символа.


:discourse2: Хостинг у нас? Компоненты тем доступны для использования на наших планах Standard, Business и Enterprise.

36 лайков