Добавление класса категории к опубликованной странице

Разработка
1

Если мы не можем использовать type="text/discourse-plugin" в теге script, есть ли способ получить текущий слаг категории опубликованной страницы?
Цель состоит в том, чтобы добавить новый класс, содержащий слаг, в HTML-тег страницы.

2

Здравствуйте,

Я не совсем уверен, что полностью понимаю, но категория доступна в body, поэтому вы можете использовать её для таргетинга.

Например:

Screenshot 2022-11-01 at 17.42.55
Screenshot 2022-11-01 at 17.42.55598×127 17.1 KB

Вы можете выбрать все темы категории lounge с помощью:

.published-page.lounge {
  ...
}
3

Извините, я не был достаточно ясен и должен был лучше объяснить цель.

В настоящее время публикация страниц не использует фоновое изображение категории.

Настройка:

image
image636×743 82.3 KB

Просмотр темы:

image
image1432×772 71.6 KB

Просмотр опубликованной страницы:

image
image898×330 19 KB

Фоновое изображение категории определяется в файле color_definitions.scss:

body.category-test-category {
    background-image: url(/uploads/default/original/1X/1851d5e9eb66a9ecf49f0dc747dfbad1a0fd220b.jpeg)
}

У опубликованной страницы нет класса category-test-category, поэтому она не наследует фоновое изображение.

Моя идея заключается в использовании JavaScript для получения слага категории и добавления класса category-[слаг категории] к тегу body, независимо от названия категории. Таким образом, фоновые изображения категорий будут применяться автоматически, вместо того чтобы писать пользовательский CSS для каждой категории опубликованной страницы, например:

.published-page {
    &.test-category {
        background-image: url("/uploads/default/original/1X/1851d5e9eb66a9ecf49f0dc747dfbad1a0fd220b.jpeg");
    }
}
4

Согласен, отличная идея :+1:

5

О, я понял… Да, это хорошая идея, но, к сожалению, я не думаю, что можно изменить опубликованную страницу с помощью компонента темы (JavaScript)… Возможно, с помощью плагина или добавления в ядро префикса category- перед именем категории.

На данный момент, думаю, работает ручной способ. Создайте компонент темы с соответствующим SCSS для категорий опубликованных страниц и добавьте для этого настройки.

Я имею в виду что-то вроде этого: GitHub - VaperinaDEV/published-page-category-background-image · GitHub

Но, возможно, есть лучшее решение, я не уверен. :slightly_smiling_face:

6

Это очень изящное решение, но я согласен, что было бы здорово иметь такую возможность по умолчанию (или настраиваемую) в ядре. Текущая цель — явно использовать фоновый цвет по умолчанию из цветов темы, как мы видим в publish.scss:

.published-page {
  background-color: var(--secondary);
  color: var(--primary);
}

А что, если URL-адреса пользовательских фоновых изображений категорий хранились бы в CSS-переменных, к которым мы могли бы легко получить доступ в нашем собственном CSS? По крайней мере, нам не пришлось бы указывать полный URL изображения в нашем CSS.

Я отправил запрос на реализацию функции здесь: Published pages could inherit categories' background image setting