لاحظت هذا أيضًا ويبدو أنه لا يظهر إلا الروابط الخارجية تحت المزيد.
أستخدم روابط داخلية في هذا المكون، على سبيل المثال، لدي رابط يفتح دعوات المستخدم: /my/invited/pending/
عند فتح الرابط من الشريط الجانبي، أحصل على: عفوًا! هذه الصفحة غير موجودة أو خاصة.
يعمل الرابط عند الوصول إليه من شريط عنوان URL.
عند إدخال عنوان URL الكامل (https://domain.com/my/invited/pending/)، يتم فتح عنوان URL على النحو التالي:
https://domain.com/https://domain.com/my/invited/pending/
نعم. مشكلة معروفة.
مرحباً،
يجب أن يعمل هذا مع: Chat,/chat/browse/open ![]()
نعم، أعرف. ربما أرسلت تعليقي بسرعة كبيرة. حسنًا، بالتأكيد بسرعة كبيرة، لأنني يجب أن أقول إنه يجب استخدام المسار بدلاً من عنوان URL الكامل.
رابط إضافي للمحادثة… حسنًا، الشريط الجانبي الجديد غيّر الملعب تمامًا ولم يعد هناك حاجة إليه.
ألقيت نظرة على كود الشريط الجانبي لـ Discourse و @manuel إضافة أيقونات.
يبدو أنه في الوقت الحالي، لا يمكن تخصيص الروابط المخصصة للأيقونة لأن طريقة تزيين قائمة الهامبرغر لا تأخذ في الاعتبار الثابت prefixValue (الذي يحتوي على اسم الأيقونة) أو شيء من هذا القبيل…
يبدو لي أيضًا أن تزيينات قائمة الهامبرغر باستخدام api.decorateWidget سيتم إيقافها. انظر:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/lib/plugin-api.js#L534
أيضًا، حقيقة أن الروابط الخارجية لم تعد تعمل قد تأتي من هذا:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/lib/plugin-api.js#L524
لذلك يجب أن تكون هناك بعض التغييرات في النواة لجعل هذا متاحًا.
معرفتي بكيفية عمل Discourse تكاد تكون معدومة لذلك قد أكون مخطئًا جدًا.
هل أنا على حق في اكتشافاتي؟
لقد قمت بتثبيت مكون السمة هذا من مستودع github. أقوم بتشغيل 3.0.0.beta15 على discourse الخاص بي وحتى على الرغم من أنني يبدو أنني أضفته، فإن قائمة الهامبرغر لا تعرض الرابط الخاص بي… أي أفكار؟
قد يكون مرتبطًا بـ:
حتى يومنا هذا، لا تزال الروابط الخارجية لا تعمل.
ويجب أن تبدأ الروابط الداخلية بمسار نسبي، وليس بمسار كامل.
شكراً جزيلاً على هذه المكونات المفيدة. أحتاج إلى إضافة بعض الروابط الداخلية المهمة، ولكن الآن بعد أن تم دمج قائمة الهامبرغر في الشريط الجانبي، أجد أنها ليست مرئية جدًا ضمن قائمة المزيد. عادةً ما يكون المستخدمون سيئين في العثور على الأشياء، لذا أحتاج حقًا إلى وضعها في المستوى الأعلى، ويفضل أن يكون ذلك مباشرة بعد منشوراتي. هل هناك أي حيل CSS لتحقيق ذلك؟
أعتقد أن الأمر يتجاوز ما يمكن أن يحققه CSS. لدى فريق discourse هذا في خارطة طريقهم، لكنه لا يحدث بسرعة (أعتقد):
أنا أستخدم:
<script>
const customHeader = document.createElement("div")
customHeader.className = "sidebar-section-wrapper sidebar-section-community"
customHeader.innerHTML = `
<div class="sidebar-section-header-wrapper sidebar-row">
<button id="ember11" class="sidebar-section-header sidebar-section-header-collapsable btn-flat btn no-text" type="button">
<span class="sidebar-section-header-text"> Rechtliches </span>
</button>
</div>
<div class="sidebar-section-content" id="customNavigation"/>
`
$(document).ready(function () {
// Create the links
const links = [
{ title: "Impressum", src: "/impressum" },
{ title: "Datenschutz", src: "/privacy" },
]
// Mobile
let hamburger = document.getElementById("toggle-hamburger-menu")
if (hamburger) {
hamburger.addEventListener("click", addCustomLinks)
} else {
addCustomLinks()
}
let bool = false;
function addCustomLinks() {
setTimeout(function () {
// Force to wait until navigation has been loaded
const sidebar = document.getElementsByClassName("sidebar-sections")[0]
if (sidebar) {
sidebar.append(customHeader)
if (bool) return;
// Get the customNav Id
const customNavigation = document.getElementById("customNavigation")
if (customNavigation) {
links.filter(function (link) {
let linkDiv = document.createElement("div")
linkDiv.className = "sidebar-section-link-wrapper"
linkDiv.innerHTML = `<a href="${link.src}" class="sidebar-section-link sidebar-section-link-everything sidebar-row ember-view">
<span class="sidebar-section-link-prefix icon"></span>
<span class="sidebar-section-link-content-text"> ${link.title} </span>
</a>
`
customNavigation.append(linkDiv)
let linkIcon = document.getElementById("link_" + link.title)
})
}
}
bool = true
}, 0)
}
})
</script>
يمكنك رؤية النتيجة على https://forum.courservio.de/
النسخة الأصلية من هذا الكود مأخوذة من https://meta.discourse.org/t/add-custom-links-to-sidebar/246848. ربما يمكن أن تساعدك.
@hosch رائع، جميل جداً، هذا بالضبط ما كنت أبحث عنه! شكراً جزيلاً.
@hosch هل من الممكن نقله إلى الأعلى؟ أود أن يظهر بعد قسم المجتمع، أو ربما قبله.\n\n------------\n\nتعديل: يبدو أنه ممكن مع تغيير على هذا:\nRearrange Existing Hamburger Menu Items - #3 by awesomerobot {\n display: flex; / Setup a flex layout so you can reorder things */\n flex-direction: column;\n .sidebar-section-community {\n order: -1;\n }\n}\n```\n\nأتساءل عن نقله إلى أعلى موضع؟
هناك خلل في هذه الطريقة حيث يختفي div المخصص عند تبديل رؤية الشريط الجانبي، على سبيل المثال إذا كانت نافذة المتصفح ضيقة. هذه مشكلة خاصة للأجهزة اللوحية، التي تحصل عادةً على إصدار سطح المكتب من Discourse وتتطلب النقر على قائمة الهامبرغر لعرض الشريط الجانبي. هل هناك أي حلول ممكنة؟ شكرًا!
تعديل: تم الحل هنا:
شكراً @hosch و @Olivier_Lambert على إنجاز هذا.
هل يمكنك أن تشرح لهذا المبتدئ أين يجب أن أدرج هذا؟ ![]()
كيف يمكنني إعادة ترتيب العناصر في قسم الشريط الجانبي / قائمة الهامبرغر؟
على سبيل المثال، أريد وضع “جميع الفئات” فوق الفئات في قسم “الفئات”، ونفس الشيء مع “جميع العلامات”.
شكرا لك!
هل تعرف الآن كيفية استخدام مكون لـ CSS، أليس كذلك؟ أضف ذلك في قسم الرأس.
لا يمكنك ذلك بسهولة. على الأقل في الوقت الحالي. لم يتم الانتهاء منه وصقله بالكامل في الوقت الحالي.
لقد جربت هذا، وأعطاني خطأ عند استخدام فاصلة منقوطة بالقرب من src.
دعنا نحاول مرة أخرى. شكرًا.
هذا لا يزال موجودًا، والحلول التي تلت ذلك لم تعالج المشكلة.
الإعداد: Invite friends,/my/invited/pending/,f
خارج الموضوع:
لقد رأيت هذا التصميم للشريط الجانبي المضغوط من قبل، ولا يمكنني العثور عليه في أي مكان. هل هذه مكونة سمة؟
يمكنك استخدام CSS هذا:
#sidebar-section-content-categories,
#sidebar-section-content-tags {
display: flex;
flex-direction: column;
li:last-child {
order: -1;
}
}
![]()

