أضف نصًا بجانب الشعار في العنوان

مطور
7

لقد قمت بهذا للتو لسمة. أنا أستخدم عنوان الموقع ووصفه المختصر، ولكن يمكنك أيضًا إدراج قيم من إعدادات السمة أو نص مترجم.

أضف مكون 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>
}

قم بإرفاقه بالمنفذ في /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 من حالة التصغير للشعار ويضيف النص فقط عندما يكون الشعار الكامل مرئيًا. إذا كنت تريد دائمًا إظهاره، فستحتاج إلى إسقاط هذا الشرط.

4 إعجابات