أهلاً بالجميع،
أواجه مشكلة في قائمة الشريط الجانبي في منتدى Discourse الخاص بي. يبدو أن ترتيب الأقسام ثابت - على سبيل المثال، عندما أقوم بإنشاء أقسام مخصصة إضافية، فإنها تظهر دائمًا فوق قسم “الفئات”.
بالنسبة لمجتمعي، سيكون من المهم أن تكون هذه الأقسام المخصصة أسفل الفئات بدلاً من ذلك، ولكن لا يمكنني العثور على أي طريقة لتغيير هذا الترتيب أو التحكم فيه.
هل هناك طريقة لإدارة موضع أقسام الشريط الجانبي، أم أنه غير ممكن حاليًا تخصيص التسلسل الهرمي/ترتيب هذه الكتل؟
شكرًا مقدمًا على أي توجيه!
مرحباً، يمكنك التحكم في ترتيب أقسام الشريط الجانبي باستخدام CSS. فقط أضف مكونًا جديدًا مع شيء مثل كود CSS التالي. انتقل إلى admin -> themes & components -> components وأنشئ مكونًا محليًا جديدًا
وأضف هذا الكود إلى علامة التبويب CSS، حيث custom-section-name هو اسم الشريحة لقسم قائمة مخصص:
.sidebar-wrapper {
.sidebar-custom-sections {
display: contents;
}
[data-section-name="community"] {
order: -4;
}
[data-section-name="categories"] {
order: -3;
}
[data-section-name="tags"] {
order: -2;
}
[data-section-name="custom-section-name"] {
order: -1;
}
}
ستحتاج إلى تغيير الأرقام وإضافة أقسام مخصصة إلى الكود أعلاه لتناسب احتياجاتك الخاصة. سيبدو الأمر شيئًا كهذا:
شكرا! لقد وجدت هذا وطبقته للتو - لكنه لم يعمل على الهاتف المحمول
كان هذا الموضوع مطروحًا هنا من قبل - لكن هذا لا يعمل أيضًا
يتم استبدال الفئة sidebar-wrapper على الهاتف المحمول بالفئة sidebar-hamburger-dropdown على ما أعتقد. لذا فإن إضافة هذه الفئة يجب أن تجعلها تعمل على الهاتف المحمول أيضًا:
.sidebar-wrapper,
.sidebar-hamburger-dropdown {
.sidebar-custom-sections {
display: contents;
}
[data-section-name="community"] {
order: -4;
}
[data-section-name="categories"] {
order: -3;
}
[data-section-name="tags"] {
order: -2;
}
[data-section-name="custom-section-name"] {
order: -1;
}
}
شكرا! لقد جربته للتو - لكنه لم ينجح للأسف. 
أوه صحيح، تفصيلة أخرى: الشريط الجانبي لا يستخدم flex على الهاتف المحمول على ما يبدو. لذا ستحتاج إلى إضافة ذلك أيضًا.
.sidebar-sections {
display: flex;
flex-direction: column;
}
شكرا جزيلا!! هذا يعمل!! رائع!
اسم رأس القسم المخصص الخاص بي يحتوي على مسافة، على سبيل المثال، “Help users”.
لقد حاولت استخدام data-section-name=“help users”، لكن هذا لا يعمل.
كيف يمكنني تحديد المسافة؟ هل هناك أي قناع يجب تطبيقه هنا؟
يرجى المساعدة
تعديل:
بعد فحص الموقع باستخدام أدوات المطور في فايرفوكس، وجدت أن الحل هو “help-users”.
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.