كيفية نقل زر رأس الموضوع الجديد وجعله أكبر للأجهزة المحمولة

Billy · 18 يوليو 2025، 11:21م

أهلاً بالجميع! بحثت عن إجابات، لكن لم أجد أيًا منها. أود نقل زر عنوان الموضوع الجديد (الصورة مرفقة، لقد غيرت النص إلى “اطرح سؤالك”، الزر باللون الأخضر) إلى يسار رابط الفئة في الرأس. أريده أن يكون أكثر بروزًا بصريًا على كل من أجهزة سطح المكتب والأجهزة المحمولة. أيضًا، أود تغيير حجمه على الأجهزة المحمولة بحيث يظهر الزر الأخضر الفعلي.

هل هذا ممكن؟ شكرًا لأي توجيه!

NateDhaliwal · 19 يوليو 2025، 12:02ص

مرحباً، يمكنك تجربة عمل نسخة منه (forking) وتغيير هذا المخرج (outlet):

github.com/discourse/discourse-new-topic-button-theme-component

javascripts/discourse/initializers/initialize-header-new-topic-button.gjs

ab8b7edee


      
          import { apiInitializer } from "discourse/lib/api";
          import CustomHeaderTopicButton from "../components/custom-header-topic-button";
          
          export default apiInitializer("1.15.0", (api) => {
            api.renderInOutlet("before-header-panel", CustomHeaderTopicButton);
          });

إلى شيء مثل:

api.renderInOutlet("bread-crumbs-left", CustomHeaderTopicButton);

على سبيل المثال، لقد وضعت الزر فوق الشريط الجانبي هنا:

github.com/NateDhaliwal/discourse-new-topic-button-theme-component

javascripts/discourse/initializers/initialize-header-new-topic-button.js

f605192ee


      
          import { apiInitializer } from "discourse/lib/api";
          import CustomHeaderTopicButton from "../components/custom-header-topic-button";
          
          export default apiInitializer((api) => {
            api.renderInOutlet("before-sidebar-sections", CustomHeaderTopicButton);
            /*
            document.addEventListener("DOMContentLoaded", function() {
              const newTopicBtn = document.getElementById("new-topic-button");
              const sidebar = document.getElementById("d-sidebar");
              if (newTopicBtn && sidebar) {
                sidebar.insertBefore(newTopicBtn, sidebar.firstChild);
              }
            });
            */
          });

يمكنك أيضاً على الأرجح تغيير الزر باستخدام بعض CSS (قم بإنشاء سمة جديدة، وضع الـ CSS في علامة التبويب ‘mobile’ أو في mobile.scss إذا كنت تستخدم مستودعاً).

Billy · 19 يوليو 2025، 7:28م

شكراً جزيلاً لك!! أقدر وقتك ومساعدتك. سأجرب ذلك.

الموضوع		الردود	مرات العرض
Move create topic to the top Feature	4	1111	5 يناير 2019
Mobile new topic button Support	0	49	6 أبريل 2025
New Topic button hidden text Dev	1	63	7 مايو 2025
How to move the New Topic button? Support	0	560	22 أكتوبر 2020
Floating "New topic" button Support	24	4350	10 ديسمبر 2022

كيفية نقل زر رأس الموضوع الجديد وجعله أكبر للأجهزة المحمولة

الموضوعات ذات الصلة