اسم الفئة بعد صورة الفئة

الدعم
1

مرحبًا يا رفاق،

قبل أن آتي هنا لطلب المساعدة، جربت كل شيء لكن دون نجاح حتى الآن :sweat_smile:

أحاول وضع اسم الفئة بعد صورة الفئة مثل ما هو في منتدى FiveM (https://forum.fivem.net)

shit
shit1202×423 48.5 KB

ما جربته بالفعل:

  • تعديل ملف category-title-link.hbs عبر صورة Docker (docker -it imagename sh - \var\www\discourse\app\assets\javascripts\discourse\templates\components\category-title-link.hbs) :x:

  • استخدام jQuery $( “category-text-title” ).insertBefore( “category-logo.aspect-image” ) في محرر السمات، واكتشفت أنه لا يعمل :x:

  • بعض الحيل في CSS (flex, order, table) :x:

لقد راجعت منتدى FiveM، حيث قاموا بتغيير ترتيب عناصر div، لكن لا يوجد شيء في CSS، أو إذا كان هناك، فأنا لست خبيرًا بما يكفي للعثور عليه.

أنا مطور WordPress، آمل أن يساعدني شخص ذو خبرة أكبر، شكرًا مسبقًا :heart:

2

وفقًا لأبحاثي الأولية، يبدو أن اسم القالب هو categories-only.hbs
جرب تغيير ذلك. لم أجربه بعد، لكنني أعتقد أنه القالب الذي تنوي تعديله.

ثانيًا، لا أنصح بتغييره في Discourse. الطريقة الأفضل هي تجاوز القالب.

3

يحتوي ملف category-title-link.hbs على ما أحاول تغييره تمامًا، ولكن عند التعديل، لا تظهر أي تغييرات. هل تعرف ما إذا كان يجب إعادة بناء التطبيق أو القيام بشيء مشابه عند تعديل ملفات hbs؟

{{category-title-before category=category}}

<a class="category-title-link" href={{category.url}}>
  **<div class="category-text-title">**
    {{#if category.read_restricted}}
      {{d-icon 'lock'}}
    {{/if}}

    <span class="category-name">{{dir-span category.name}}</span>
  </div>
  {{#if category.uploaded_logo.url}}
    {{cdn-img
      src=category.uploaded_logo.url
      **class="category-logo"**
      width=category.uploaded_logo.width
      height=category.uploaded_logo.height}}
  {{/if}}
</a>
4

إذا قمت بتعديل كود Ember، فلا تحتاج إلى إعادة تشغيل التطبيق بالكامل، لكن تأكد من إعادة تحميل نافذة المتصفح بشكل قسري حتى لا تعرض شيئًا تم تخزينه مؤقتًا في المتصفح.

5

بعد التغييرات، قمت بإعادة تشغيل حاوية Docker وإعادة تشغيل خادم الويب ههه :sweat_smile:

أعدت تحميل الصفحة آلاف المرات وحاولت أيضًا عبر وضع التصفح المتخفي

لا توجد تغييرات :rofl:

6

يرجى تأكيد الأمر بالنسبة لي، هل أقوم بالتعديل في الدليل الصحيح؟

\var\www\discorse\app\assets\javascripts\discourse\templates\components

يبدو أن مجلد “templates” يحتوي فقط على القوالب وليس ما يتم تشغيله فعليًا، لكنني لا أفهم هذا النوع من البرمجة، لذا فإن ذلك مجرد تخمين.

7

حاول حذف مجلد tmp في دليل discourse الجذري، ثم أعد تشغيل الخادم.

8

Anota%C3%A7%C3%A3o%202019-07-28%20071003
Anota%C3%A7%C3%A3o%202019-07-28%20071003906×289 22 KB

̶ه̶ذا̶ ̶م̶ا̶ ̶أ̶ف̶ع̶ل̶ه̶

9

لماذا تفعل ذلك؟ هذا تغيير في CSS، من خلال لوحة الإدارة أو التخصيص.

11

هل يمكنك مساعدتي في هذا؟ كما قلت، لقد جربت كل شيء :rofl:

بعض حيل CSS (flex, order, table) :x

12

راجع Developing Discourse Themes & Theme Components.

13

شكرًا لك يا جاي، لكنني لست مطورًا. أعرف بعض الأشياء، ولكن كما ترون، ليس كافيًا لحل هذه المشكلة. لقد حاولت حقًا كل شيء، بما في ذلك البحث عن مواضيع مماثلة هنا، دون نجاح :sleeping_face:

14

مرحبًا جايس، شكرًا جزيلاً لك، لقد قمت بذلك :heart_eyes:

إذا كان شخص ما يبحث عن هذا الحل، ففعل ما يلي ببساطة:

انتقل إلى الإعدادات > المسؤول > تخصيص > اختر السمة النشطة > عدّل CSS/HTML

في حقل </body>، ضع هذا الكود:

<script type="text/x-handlebars" data-template-name="components/category-title-link">
{{category-title-before category=category}}
<a class="category-title-link" href={{category.url}}>
    {{#if category.uploaded_logo.url}}
    {{cdn-img
      src=category.uploaded_logo.url
      class="category-logo"
      width=category.uploaded_logo.width
      height=category.uploaded_logo.height}}
  {{/if}}
  <div class="category-text-title">
    {{#if category.read_restricted}}
      {{d-icon 'lock'}}
    {{/if}}

    <span class="category-name">{{dir-span category.name}}</span>
  </div>
</a>
</script>

وهكذا، تم الأمر :partying_face::tada::tada:

15

إذن كنت مطورًا في النهاية!