Добавить текст в шапку рядом с логотипом

Я новичок в Discourse, поэтому извините, если это что-то легко сделать, однако я не могу найти, где можно определить текст, который должен отображаться рядом с нашим логотипом в заголовке нашей страницы Discourse.

Внутри красной рамки в заголовке я бы хотел добавить текст «Форум сообщества» или что-то в этом роде:

Как мне это сделать?

Заранее спасибо за любую обратную связь!

Привет, Daniel :wave:

Вы можете использовать что-то вроде этого, чтобы добавить текст рядом с логотипом в заголовке вашего сайта:

<script type="text/discourse-plugin" version="0.8">
api.decorateWidget("home-logo:after", helper => {
  const titleVisible = helper.attrs.minimized;
  const headerText = "Текст, который вы хотите добавить"; // <--- измените этот текст

  if (!titleVisible) {
    return api.h("span.header-text", headerText);
  }
});
</script>

Добавьте этот код в секцию заголовка вашей темы или компонента. Подробнее о системе тем Discourse вы можете прочитать здесь:

Теперь из-за изменений в Discourse появляется баннер с ошибкой. Есть ли у вас предложения, как достичь того же результата с помощью нового подхода? Спасибо.

Да, этот метод больше не будет работать, и вам нужно использовать коннекторы, указанные здесь в разделе о плагин-аутлете home-logo, заменяющем виджет-декорации home-logo:after:

Если у меня будет время сделать это самому, я вставлю код сюда. Или, если кто-то найдёт время раньше, я буду очень признателен… :slight_smile:

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

Добавьте компонент glimmer в components/header-logo-title.gjs

import Component from "@glimmer/component";
import { service } from "@ember/service";

export default class HeaderLogoTitle extends Component {
 @service siteSettings;

 <template>
   {{#unless @outletArgs.minimized}}
     <div class="header-logo-title">
       <span
         class="header-logo-title__title"
       >{{this.siteSettings.title}}</span>
       {{#if this.siteSettings.short_site_description}}
         <span
           class="header-logo-title__description"
         >{{this.siteSettings.short_site_description}}</span>
       {{/if}}
     </div>
   {{/unless}}
 </template>
}

Присоедините его к outlet в /api-initializers/my-theme.js

import { apiInitializer } from "discourse/lib/api";
import HeaderLogoTitle from "../components/header-logo-title";

export default apiInitializer("1.26.0", (api) => {
  api.renderAfterWrapperOutlet("home-logo", HeaderLogoTitle);
});

Хелпер #unless проверяет состояние минимизации логотипа и добавляет текст только тогда, когда будет отображаться полный логотип. Если вы всегда хотите показывать его, вам нужно убрать это условие.

Вы также можете использовать api.renderAfterWrapperOutlet("home-logo") (начиная с версии 1.26.0). Это имеет преимущество: вы используете фактическое имя слота, не указывая магические суффиксы __before/__after.

Спасибо @Arkshine. Это лучше, я обновил предыдущий пост.

Пытаюсь сделать это сейчас, но возникают проблемы — как получить доступ к «компоненту Glimmer в components/header-logo-title.gjs»?

Мое сообщество находится здесь: https://community.worldradioleague.com/.

У меня платный тариф — возможно, у меня нет доступа к ядру Discourse, чтобы увидеть это?

Я обернул это в компонент, вы можете попробовать использовать его: Manuel Kostka / Discourse / Helpers / Header Logo Title · GitLab. По умолчанию он добавляет заголовок сайта и краткое описание сайта. В качестве альтернативы вы можете добавить собственный текст для заголовка и описания в настройках компонента.