ساعدني في إرفاق كود HTML في قسم الهامبرغر

الجميع الأعزاء،

أرجو أن تكونوا بخير..

هذا هو كودي.. يرجى الاطلاع عليه

    <script>
        $.getJSON("https://forum.example.com/directory_items.json?order=likes_received&period=monthly", function(data, status) {

            var base_url = window.location.origin;
        z0 = base_url + data.directory_items[0].user.avatar_template.replace("{size}", "24");
        z1 = base_url + data.directory_items[1].user.avatar_template.replace("{size}", "24");
        z2 = base_url + data.directory_items[2].user.avatar_template.replace("{size}", "24");
        z3 = base_url + data.directory_items[3].user.avatar_template.replace("{size}", "24");
        z4 = base_url + data.directory_items[4].user.avatar_template.replace("{size}", "24");
        z5 = base_url + data.directory_items[5].user.avatar_template.replace("{size}", "24");
        leader_body = '<h1>لوحة المتصدرين</h1><br><img class="learder_rounded" src="' + z0 + '"><b>' + data.directory_items[0].user.username + '</b><br><img class="learder_rounded" src="' + z1 + '"><b>' + data.directory_items[1].user.username + '</b><br><img class="learder_rounded" src="' + z2 + '"><b>' + data.directory_items[2].user.username + '</b><br><img class="learder_rounded" src="' + z3 + '"><b>' + data.directory_items[3].user.username + '</b><br><img class="learder_rounded" src="' + z4 + '"><b>' + data.directory_items[4].user.username + '</b><br><img class="learder_rounded" src="' + z5 + '"><b>' + data.directory_items[5].user.username + '</b>';
        console.log(leader_body);
        $(".menu-container-footer-links").append(leader_body);

    });
    
    </script>

أريد إرفاق كود HTML الخاص بي (لوحة المتصدرين) في قسم الهامبرغر.

لكن هذا الكود لا يعمل بشكل صحيح.

انظر إلى الصورة، يُظهر الكود أعلاه هذه النتيجة في قسم الهامبرغر فقط عند فتح قسم الهامبرغر وإعادة التحميل.. بعد الإغلاق وفتح الهامبرغر مرة أخرى، لا يظهر.. يرجى مساعدتي في إصلاحه. أنا جديد على discourse.. وعادةً ما أكون مبتدئًا في البرمجة :innocent:

شكرًا مقدّمًا. :pray:

أعتقد أنك بحاجة إلى التعلم حول مُوصّلات Handlebars و api.onPageChange

<script type="text/x-handlebars" data-template-name="/connectors/abc/xyz">
    {{mount-widget widget = "xyz"}}
</script>
api.onPageChange ((url, title) => {
});

الطريقة السهلة هي الاطلاع على قالب الموضوع.

decorateWidget

https://github.com/hnb-ku/discourse-custom-hamburger-links/blob/master/common/header.html

Bcat شكراً لك يا عزيزي.. بالتأكيد سأتعلم كل ما ذكرته وسأنشر الحل هنا.