كيف يتم إنشاء الرابط/اللوحة الرئيسية للقائمة (هامبرغر)؟

[stance455 (Nader)]

عذرًا لقلة خبرتي في هذا الموضوع، ولكن كيف يتعامل Discourse مع النقر على رابط قائمة الهامبرغر؟

السياق: أنا أستخدم خدمة prerender.io لتقديم نسخة HTML من الموقع الرئيسي (نسخة JS من الموقع).
رابط الـ <s class="menu"> هامبرغر لا يعمل.
يمكنك الاختبار (الموقع) باستخدام أدوات مطوري Chrome وتغيير الوكيل إلى Googlebot smartphone. عند استخدام وكيل مستخدم Googlebot، فإنك تحصل فعليًا على نسخة HTML المُعدة مسبقًا.

ملاحظة جانبية: وفقًا لمنشور المدونة هذا من prerender، قد تكون هناك مشكلات مع التعليمات البرمجية مثل

`<a>Anchor</a>`
`<a href="javascript:goTo('page')">Anchor</a>`
`<span onclick="goTo('page')">Anchor</span>`

يجب أن تكون جميع الروابط بين علامات <a></a> وتحديد عنوان URL مستهدف ضمن السمة href حتى يتمكن Google من العثور عليه وتتبعه.

ربما يتم إنشاء رابط القائمة الرئيسي باستخدام هذه الطريقة؟

أي أفكار لحل ستكون محل تقدير كبير.

تعديل لقد أزلت الموقع من prerender في الوقت الحالي (ولكن مع الاحتفاظ بنسخة JS المقدمة للبوتات) - بشكل مفاجئ، يبدو أن Google bot يعرضه بشكل صحيح من حين لآخر. ليس لدي أي مشاكل في القائمة عند استخدام Google bot كوكيل مستخدم في Chrome. سأختبر هذا لفترة قصيرة.

[stance455 (Nader)]

أعتذر هنا، لقد جعلت سؤالاً بسيطًا مربكًا للغاية…

تبدو الروابط داخل القائمة جيدة، مشكلتي هي فقط رابط الهامبرغر الفعلي نفسه - عندما يتم عرضه باستخدام prerender فإنه لن يفتح.

هذه المشاركة من قبل @Johani كانت مفيدة للغاية في محاولة تشخيص المشكلة

هل أنا على المسار الصحيح بالنظر إلى هذا الجزء من التعليمات البرمجية (فيما يتعلق بوظيفة النقر على قائمة الهامبرغر)

[awesomerobot (Kris)]

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

هنا تمت إضافة الزر، يمكنك رؤية أنه يحتوي على إجراء يسمى toggleHamburger:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L246

تم تعريف الإجراء toggleHamburger لاحقًا في نفس الملف، هنا:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L483

يقوم toggleHamburger بتغيير حالة hamburgerVisible، لذلك تتم إضافة القائمة في النهاية باستخدام panels.push(this.attach("hamburger-menu")); والتي يمكنك رؤيتها هنا:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L379

[stance455 (Nader)]

رد رائع @awesomerobot ، أنا متأكد من أن المجتمع يقدر ذلك.

سألقي نظرة على هذا لمعرفة ما إذا كان العمل المخصص يستحق العناء.

كان الرد الذي تلقيته من prerender.io بشكل أساسي هو أنه إذا كان يستخدم “JavaScript معقدًا” فمن المحتمل ألا يعمل. لست متأكدًا من مدى دراستهم للوضع.