تغييرات العناوين القادمة - إعداد السيمات والإضافات

[saquetim (Sérgio Saquetim)]

@Danny_Dainton

هل يمكن لأحد مساعدتي في التغييرات التي أحتاجها لهذا، من فضلك؟

<script type="text/discourse-plugin" version="0.4">
const { iconNode } = require("discourse-common/lib/icon-library");

api.decorateWidget('header-icons:before', helper => {
    return helper.h('li', [
        helper.h('a#graduation-cap.icon', {
            href:'https://example.com/',
            title: 'Learning Center'
        }, iconNode('graduation-cap')),
    ]);
});

</script>

أعتقد أنني بحاجة إلى تحويله لاستخدام api.headerIcons.add(“foo”, FooIcon, { before: “search” }) ولكنني لست متأكدًا تمامًا من كيفية القيام بذلك

سيكون أي مساعدة هنا موضع تقدير كبير

مرحباً @Danny_Dainton،

ألقِ نظرة على المكون المظلي Custom Header Links (icons). أعتقد أنه يفعل ما تحتاجه.

إذا لم تتمكن من استخدام المكون المظلي، فإن api.headerIcons.add سيؤدي الغرض.

• أنشئ ملف تهيئة جديد. يجب أن يكون له امتداد .gjs
• يجب أن يقوم الكود التالي بما تريده:

// javascripts/discourse/initializers/custom-header-icons.gjs

import { apiInitializer } from "discourse/lib/api";
import dIcon from "discourse-common/helpers/d-icon";

export default apiInitializer("1.34.0", (api) => {
  api.headerIcons.add(
    "custom-header-home",
    `
      <li>
        <a id="graduation-cap" class="icon" href="https://example.com/" title="Learning Center">
          {{dIcon "graduation-cap"}}
        </a>
      </li>
    `,
    { before: "search" }
  );
});